1. Home
  2. AccessAlly
  3. Online Courses
  4. Create An Icon Dashboard For Courses and Memberships

Create An Icon Dashboard For Courses and Memberships

With AccessAlly, you can create an icon dashboard for courses and memberships that creates organic upsell opportunities for your free and paying members.

Not sure where your disabled icon is redirecting to? Please check the settings for that course inside the Course Setup Wizard.

Why Use The Dynamic Icon Dashboard Shortcodes (instead of simply adding linked images)

It’s certainly possible to manually create a dashboard by adding images that link directly to your course material.

However, if you use the methods on this page that use the shortcode adder, the icons become dynamic, which means:

  • Course icons display the “enabled” or “disabled” versions based on whether or not the user has permission to the course.
  • If your courses are set up so that users without the proper permission are redirected to a sales page, the AccessAlly shortcode will take care of the redirect for you

Locate Your Main Course Dashboard Page

If you used the Onboarding Wizard to configure your key pages, you can easily locate your main dashboard page by going to: AccessAlly > General Settings > Initial Setup > Key Pages

FUN FACT: You can create multiple icon dashboards for your site.

Method 1: Add Icons Individually (Advanced)

This method gives you the most flexibility, but if you’re looking for a faster solution you’ll love option 2 below.

Written Tutorial

On any WordPress post or page, you can use the AccessAlly shortcode adder located in the toolbar to easily add any course icon to your page.

The process is simple:

Step 1: Click on the Shortcode Adder button

Step 2: Select the appropriate course icon

Clicking on the dropdown will reveal your website’s pages. Select the main page for the course you’ve created.

Step 3: Add Icon to Page

Click on the yellow INSERT SHORTCODE button to add the icon to the page.

Step 4: Add Styling, Etc.

By default, the shortcode only shows the course icon as you’ve configured it in the AccessAlly Course Wizard settings for your course.

If you’d like it to appear in a different size, or create several columns of icons, you must use CSS styling or use your theme’s design tools (if applicable).

This first method uses the AccessAlly shortcode adder to individually add each icon to the page. With this method, you’ll need to have additional styling resources available to improve the look/layout of the icons (styling resources might include your theme settings, CSS, or a page builder plugin like Beaver Builder).

NOTE: to simply select the icon that represents that course as a whole, look for the word (Course) in the shortcode selector, followed by the course name.

Alternatively, you can style the dashboard from inside the Course Wizard area and add it to a page using a single shortcode.

Important note on Progress Overlay settings as seen at minute 1:47 in the video above. The Progress Pie Chart or Progress Bar percentage of completion are attached to the objectives on the Welcome Page (or Parent Page) for that particular course.

Find more information on how to show course progress using the progress pie chart or progress bar.

This method only allows you to style a single dashboard … so if you wish to create multiple, you might want to use the “course dashboard” styling/shortcode for your main dashboard, then use Method 1 on this page to create any subsequent dashboards.
Updated on October 30, 2020

Was this article helpful?

Related Articles


If you have any questions, we're just an email away.

We take your success seriously, and you'll always get a speedy reply from a real person during business hours.


AccessAlly is the #1 WordPress Course and Membership Solution for Industry Leaders


You'll get follow-up emails about AccessAlly and new features. Opt out anytime. Full privacy policy here.