Integrations

  1. Docs
  2. Integrations
  3. LearnDash
  4. LearnDash Visual Customizer

LearnDash Visual Customizer

The LearnDash Visual Customizer plugin lets you visually edit the look and feel of your LearnDash courses. You can customize the LearnDash elements by:

  • Selecting a template style
  • Picking a theme and
  • Customizing individual colors and design elements

LearnDash Visual Customizer has enhanced templates for the LearnDash course, lesson, topic and quiz listings. You can add or customize the look and feel of the elements as per your brands requirements.

The plugin features include:

  • 6 bundled skins
  • Ability to select custom icons for courses and lessons
  • Numerous layouts for displaying course content including grids and a timeline mode
  • Display additional course information such as expected duration, content type, brief descriptions and post thumbnails
  • Select from hundreds of available fonts and customize the size of fonts within your LearnDash content
  • Compatible with any theme
  • Fine tune LearnDash to display exactly how you want it by customizing the color, drop shadows, border width, spacing, hiding various elements, and much more.

The integration works with the BuddyBoss theme and supports all templates, and elements in the LearnDash Visual Customizer plugin.

Installing the plugin

To install the plugin:

  1. Buy and download the LearnDash Visual Customizer from the link below
    https://snaporbital.com/learndash-visual-customizer/ 
  2. Extract the downloaded ld-visual-customizer.zip file to the WordPress plugins folder yourhostname/wordpress/wp-content/plugins OR
    Go to your WordPress Dashboard > Plugins > Add New. Click the Upload Plugin button. Browse to the download file location, select the ld-visual-customizer.zip & install the plugin.
  3. Click the Activate Plugin button to activate the LearnDash Visual Customizer plugin on your website. OR
    To activate the plugin on your website site go to WordPress Dashboard > Plugins and then click the Activate button for LearnDash Visual Customizer.

Using the Theme Customizer

LearnDash Visual Customizer is configured through the Theme Customizer. Please select a course to preview to start your customizations. To customize the 

  1. Go to WordPress Dashboard > Appearance > Customize > LearnDash Styling.
  2. Use the styling options to customize LearnDash as preferred.
  3. Click the Publish button.
LearnDash Visual Customizer - Using the WordPress Customizer
LearnDash Visual Customizer – Using the WordPress Customizer

If you are using the LearnDash Enhanced or Expanded Style template, each course, lesson, topic or quiz will have a Content Type / Duration meta box for adding information for it. 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, image, audio, presentation, or assignment.
LearnDash Visual Customizer - Content Type Duration meta box
LearnDash Visual Customizer – Content Type Duration meta box

Shortcodes

LearnDash Visual Customizer currently has the following additional shortcodes:

[lds_course_list]

Outputs a grid of your courses with a featured image or icon. Works with Legacy and LD30 LearnDash themes.

Arguments for the shortcode:

  • 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]

Outputs 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. Only works with Legacy LearnDash Theme. 

[lds_progress]

Outputs an enhanced course progress bar including an output of what percentage complete the logged in user is and how many steps are remaining. Works with Legacy and LD30 LearnDash themes.

[lds_login]

Allows you to embed a stylized login form on your page. Works with Legacy and LD30 LearnDash themes.

Arguments for the shortcode:

  • redirect – What web address should the user be redirected to upon successful login?
  • username – What label should be used in place of “username”
  • password – What label should be used in place of “password”
  • button – What label should be used in place of “login”
  • remember_me – What language should be used in place of “Remember Me”
  • lost_password – What wording should be used in place of “Lost Password”

For further setup and usage tutorials, refer to the official documentation of LearnDash Visual Customizer.

Questions?

We're always happy to help with code or other questions you might have! Search our documentation, contact support, or connect with our sales team.