Divi eLearn for LearnDash
A child theme for Divi and Learndash
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.
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
After you install and activate the theme, you will see a new menu item on the left side of your WordPress Dashboard called Divi eLearn. 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 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 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
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
[divi_ld_course_grid category=”34″ per_page=”6″ hide_author=”yes” hide_price_tag=”yes” hide_free_tag=”yes”]
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:
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.
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:
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:
[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.
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 firstname.lastname@example.org or use the form below