DOCUMENTATION

Divi eLearn for LearnDash

A child theme for Divi and Learndash

Getting started

Before you install the eLearn child theme, please make sure you have the Divi Theme installed first. It is recommended to have the LearnDash plugin installed and activated as well. Then, you can go ahead and install the eLearn child theme for Divi and LearnDash.

NOTE: DOCS for version [1.1.0] click HERE 

How to install the theme

From your WordPress Dashboard, go to Appearance > Themes > Add New and click on Upload Theme. Locate the .zip file on your computer and click Install Now.

Once the file upload is finished, you can click on Activate. You will then see Divi eLearn for LearnDash as the active theme in your theme panel.

How to import the Demo Content

Since version [1.1.0] the demo importer is in a separate plugin:

From your WordPress Dashboard, go to Plugins > Add New and click on Upload Plugin. Locate the .zip file on your computer and click Install Now and Activate. Then continue with the next step.

Note: The plugin contains all the resources and media in it to prevent downloads from external servers. That makes the .zip file ~30mb, but the import process is significantly faster.

Activating demo content for older versions of the child theme:
After you install and activate the theme, you will see a new menu item on the left side of your WordPress Dashboard called Demo Importer. Hover over this and click Easy Demo Import.

Next, you will see a list of options that are checked by default. Theses items will import and be assigned during the demo import process.

For new websites we recommend keeping everything checked, but you can go go ahead and skip uploading any of the content if you wish.

How to customize the course grid

To customize the course grid colors and fonts, please go to your Dashboard > Theme Customizer > General Settings > Divi LearnDash Course Grid . You will see all the options for visual customization there.

How to customize course grid meta data

The 3 fields for meta data that you see on the demo are completely customizable. You can choose what to display there for each individual course. To do that go to LearnDash LMS > Courses and click on a course to edit. Then, on the course back end page scroll down and you will see a field at the bottom “Divi Learndash Theme Course Meta”. Click on the expandable arrow ▼ and you will see the 3 fields where you can enter your own personalized course meta. You can do that with each course. If you leave those fields empty, nothing will show on the course grid.

How to assign a course author

To do that go to LearnDash LMS > Courses and click on a course to edit. Then, on the course back end page, on the panel on the right side you will see the box where you can assign a course author. You can choose it from the list of your own WordPress user accounts.

How to assign a course category

To do that go to LearnDash LMS > Courses and click on a course to edit. Then, on the course back end page, on the panel on the right side you will see the box where you can assign a course category. You can choose one or a few categories from your list. At the moment, the course grid only displays one category – the first one in alphabetical order. If you have assigned more categories to your course, they will still be active, but they will not be displayed on the course grid.

How to display a short description for the course

To do that, first you need to activate the LearnDash add-on called “Course Grid”. Then, when you have that installed and activated, go to LearnDash LMS > Courses and click on a course to edit. Then, on the course back end page, at the bottom of the page you will see the field for Short description. You can fill that in and your short description will show on the eLearn Theme course grid.

How to customize the course grid button

The course grid button follows the main theme button styles. To change them go to Theme Customizer > Buttons and change your global button styles. This will affect the buttons in the course grid as well.

How to include and exclude element from the course grid

By defaulf, the course grid shortcode shows everything (if information entered) and looks like this: [divi_ld_course_grid]

If you want to display certain specific things only, you have the following options:
– show courses from a specific category – you can display courses by a specific category, by a category ID
– choose the number of courses to show – this part of the shortcode allows you to enter a specific number of courses to be shown on the grid (the default number is 12. If you want to display all courses, use -1)
– you can hide the price tag
– you can hide the FREE tag
– you can hide the author
– you can show only the courses the user has enrolled in (mycourses=”true”)
– you can add your custom button text
– you can add your custom “free” tag text

Example: this shortcode shows only category with id 34 , 6 courses, dont show author, don’t show price tag and don’t show free tag, shows only the courses the user has enrolled in, and has custom text for button and free tag:

[divi_ld_course_grid category="34" per_page="6" hide_author="yes" hide_price_tag="yes" hide_free_tag="yes" mycourses="true" button_text="your custom button text here" free_tag_text="your custom text for free tag here"]

If you don’t want to display course meta and course short description, just leave the fields for those blank on the course admin page.

For more information on how to display a course category, see below.

How to display the course grid anywhere

The course grid is a shortcode that you can copy and paste wherever you want with the Divi Code or Text module.

The shortcode for all courses looks like this:
[divi_ld_course_grid]

How to display the course grid for a specific category

If you would like to display courses from a specific category on the grid add this shortcode:

[divi_ld_course_grid category="3"] – on the place of 3, add the ID number of the category you would like to display.
To see what the ID number of your chosen category is, go to Admin Panel > LearnDash LMS > Courses . Then on the top left side of your screen click on Actions > Course categories. Then Hover over your desired category and you will see a line of code at the very bottom of the page, where you can find the category ID number.

How to disable the default LearnDash auto content on Course Pages

To disable the default LearnDash auto content on Course Pages go to Admin Dashboard > Divi > Theme options and click on the “Divi LearnDash” tab. Then click on the option to be enabled. This will switch off the default auto content that goes on the LearnDash Course Pages by default, and will leave you with a blank course page to customize as per your liking.

How to set-up your course pages

Each of the course pages is built entirely with the Divi Builder and is using Learndash shortcodes to display Learndash elements within the page. You can use one of the eLearn Theme’s excisting course page layouts, which you can find in the Divi Library, or you can build your own custom one.

Before you begin building your course page, please make sure you have set up the following two options from the course back-end admin page. Go to your Admin > LearnDash LMS > Courses > click on the course and you will see the options on the right side bar:
– Course Hide Title – you can choose whether to show or hide the default LearnDash course title display. Choose “hide”, if you want to make your own customized title.

– Divi page settings > No Sidebar – choose the “no sidebar” option to have a fully customizeble blank page. You can build your own custom sidebar with the Divi Builder if want

How to customize your course pages with the Divi Builder

To customize your course page with the Divi Builder, just go to the page and click on “Edit with Divi Builder” as usual. You can use any of the existing course page layouts that come with eLearn theme, or you can build your own ones. You can have different layouts for your different course pages, or you can set-up one layout to show for each course. You can set-up a global layout from the Divi > Theme Builder options.

Displaying LearnDash dynamic elements on course pages

You can use shortcodes in a Divi code module to display Learndash dynamic elements wherever you want on your course page. Examples:

– Learndash course content – displays the lessons/topics/quizes that your course consists of. You can use this shortcode to display it:
[course_content]

– Learndash Course Info bar – displays whether the course status, price and buy now button if the visitor is not enrolled in the course. If the visitor is already enrolled in the course, it displays a course progress bar. You can use this shortcode to display the bloc:
[divi_ld_status]
– Learndash “Buy This Course” Button – Displays a Take This Course or Login button. Displays nothing if the visitor is already enrolled in the course. You can use this shortcode to display the bloc:
[divi_ld_status_action]

If you want to display a message to the already enrolled visitors, you can use this shortcode in combination with the button shortcode: [student] Your message to already enrolled students [/student]

The combination of shortcodes can look like this. You can use one divi code module for them both:
[divi_ld_status_action]
[student] You are Enrolled in This Course [/student]

And this is what it will display:

How to set-up the general Learndash settings

To set up the general Learndash settings go to your admin dashboard > LearnDash LMS > Settings .

Under general tab you can set-up your colors and logo, and you can unable or disable the LearnDash login and registration pop-up.

Under PayPal Settings tab you can enable the PayPal payment option by inserting your paypal email address.

How to unable registration in general

To unable user registration in general go to your admin dashboard > Settings > General and in the “Membership” field choose “Anyone can register”. This will enable the registration option in the LearnDash Login Pop-up.

Have Questions or Need of Support

If you have any other question, need of support or request for a new feature, please contact us at info@powdistudio.com or use the form below

12 + 6 =