Installation
- Upload ‘ld-visual-customizer’ to the ‘/wp-content/plugins/’ directory
- Activate the plugin through the ‘Plugins’ menu in WordPress
- Under Learndash > Settings you will have a new tab called “Appearance”
- Under appearance you can switch between selecting your base theme, customizing colors and managing your license
Theme Selection
You can select a base theme by going to Learndash > Settings and then clicking on the “Appearance” tab.
You can then select a template and theme. Templates control the structure of the LearnDash elements like course, lesson and topic listings. Themes control the colors and style.
The current available templates include:
- Default LearnDash
- Enhanced LearnDash – This adds the option to select content types for each lesson or topic, add estimated duration and a short description
- Expanded Style – This creates a more timeline styled listing for courses, lessons and topics and also supports content type, duration and description.
Themes:
Currently there are five base themes to select from. Selecting a theme will give you a preview (note: preview does not update when you change colors.)
Each theme has unique styling and colors. You can further customize the selected theme by changing the color pickers below.
Note that while the colors will effect the expanded style template, it won’t effect the look and feel… only the colors.
SHORTCODES
LearnDash Visual Customizer currently has the following additional shortcodes:
Course Listings
[[lds_course_list]]
The course list shortcode will output a grid of your courses with a featured image or icon. There are the following arguments:
- style – This can be “icon” or “banner” i.e. [[lds_course_list style=”icon”]] or [[lds_course_list style=”banner”]]
- cols – This can be 2 or 3 and will change how many columns the courses are in, i.e. [[lds_course_list cols=”2″]]
[[lds_expanded_course_list]]
This will output your course listing in the “Expanded Style” template, consider switching all your content listings to this style by selecting “Expanded Style” in the template option of LearnDash > Settings > Appearance > Themes.
Extra
[[lds_progress]]
This will output an enhanced course progress bar including an output of what percentage complete the logged in user is and how many steps are remaining.
Adding images, icons, duration and descriptions
The [[lds_course_list]] shortcode can output an icon or banner for each individual course. To include a banner image simply set a “featured image” when editing your course page. To display an icon, select from the list of icons in the “Additional Details” field on the right. NOTE: Clicking on the icon input will open up an icon picker you can select from.
Content Type, Duration and Short Description
If you’re using the LearnDash Enhanced or Expanded Style template you can add additional information about your content to their listing. This includes:
- An estimated duration, for example 5min, 10min, 1hr or 1 week
- A short description – Recommended 1 or 2 sentences max
- Content Type – You can indicate if it’s text, video, a presentation, audio, etc…
This is done in the “Additional Details” box when editing any course, lesson, topic or quiz.
Additional Customization
If you are adept at CSS you can write custom CSS and put it into the styling window below. This is for experts only.