Divi LearnDash Kit

Description

Divi Learndash Kit enables the Divi Builder on Learndash pages; but goes further than that by adding new modules to the Divi Builder.

Learndash is a learning management system (LMS) that lets you create your own courses for your WordPress website. It’s easy to use and learn, but the design capabilities are somewhat limited. Courses with better-designed layouts will be more attractive to potential customers, so having the ability to design your own course layouts could set your course apart from the crowd. The obvious choice would be to design your layouts with the Divi Builder. A third-party plugin called Divi Learndash Kit does exactly that.

 

Divi Learndash Kit enables the Divi Builder on Learndash pages; but goes further than that by adding new modules to the Divi Builder. These modules can be used to place Learndash elements within the editor area for courses, lessons, topics, quizzes, etc.

 

For this plugin highlight, I’m using version 1.0.5 along with LearndashLMS version 2.5.4 and Learndash Course Grid version 1.3.0. All images are taken from the Learndash demo.

Standard Learndash Pages

 

Divi LearnDash Kit

 

The normal Learndash pages use the standard WordPress editor to create the content. This includes courses (which can provide a different description for both visitors and students by using shortcodes), lessons, topics, quizzes, certificates, groups, etc.

 

Divi LearnDash Kit

 

This is the sample course in the Learndash demo. The design comes from the editor, just like any standard page or post. It’s functional but of course, it’s limited. Publishing options are the same as a standard post, so your lessons and course descriptions will display with titles, meta, sidebars (Learndash has several widgets), etc.

 

Divi Learndash Kit doesn’t control EVERYTHING. There are still course-builder elements that we don’t have access to. We have access to the description area and we can use modules to place certain elements. Some things, such as course navigation, are controlled by the lessons and other pages themselves. Other elements, such as deciding what to display based on whether or not a user is logged in, are controlled by shortcodes.

 

Learndash Pages using Divi Learndash Kit

 

Divi LearnDash Kit

 

Divi Learndash Kit adds the Divi Builder to your LearnDash courses, lessons, quizzes, topics, certificates, and groups. Now all of those pages can be created using the Divi Builder. This includes the Divi Custom Post Settings so you can choose your page layout (sidebar placement), dot navigation, hiding navigation before scroll, and show or hide the post title.

 

Divi LearnDash Kit

 

As an example, I’ve recreated the demo course page with the Divi Builder. I’ve added a Post Title module and displayed the title over the image. I also increased the title size and gave it a shadow.

 

Divi LearnDash Kit

 

I’ve set it to display fullscreen without showing sidebars. Of course, the sidebars do display some useful information. Fortunately, we can show that using the new modules.

 

Divi Learndash Kit Modules

 

Divi LearnDash Kit

 

Adding the Divi Builder to the Learndash custom post type is helpful, but Divi Learndash Kit goes further by adding 13 modules to the Divi Builder:

 

  1. Course Content – a table showing the content of the course
  2. Course Expire Status – shows the expiration date of the course
  3. Course Info – shows information about the courses available to the user
  4. Course List – shows the list of courses
  5. Course Progress – displays a progress bar, showing the progress the user has made through the course
  6. Lesson List – shows the list of lessons
  7. Payment Buttons – displays buttons where the user can make a payment
  8. Profile – displays the user’s profile
  9. Quiz List – shows the list of quizzes
  10. Topic List – shows the list of topics
  11. User Course Points – shows points the user has earned
  12. User Groups – shows a list of groups the user is assigned to
  13. Video – shows a list of courses with video

 

The modules allow you to create your own layouts using the LearnDash elements without having to use Learndash shortcodes for those elements. They’re labeled well and are easy to find.

 

Note – the modules do not work in the Visual Builder.

 

Divi LearnDash Kit

 

The modules include all the customizations you expect. Content, Design, and Advanced tabs include settings for backgrounds, text, border, shadow, animation, spacing, CSS, etc. They also include selections for the number of columns to display, the number of items to display, filters for categories, tags, etc. Of course, this depends on the type of content the module displays.

 

Save Your Divi Learndash Kit Layouts to the Divi Library

 

Divi LearnDash Kit

 

You can choose to use the main library for your layouts. In the dashboard, go to Settings > Divi Learndash Kit. The only setting is Use Main Library. This allows you to use the Divi Library to save and reuse your layouts including pre-defined layouts that come with Divi and anything you’ve uploaded or saved to the Divi Library.

 

Divi LearnDash Kit

 

Once you create your page design you can save the layout to the library and reuse it. This image shows a layout that I created and one that I uploaded. I like that it can import layouts to build your courses with. You can also create them in the library. It would be nice if it included a few examples.

 

Divi Learndash Kit Course Example

 

Divi LearnDash Kit

 

Here’s a modification of the basic course page that we saw earlier. I’ve loaded the header from the Homepage Layout for Universities & Colleges and changed the image and button text. I set it to full-screen and added Course Progress, Lesson List, Course Content, and a Quiz List.

 

Divi LearnDash Kit

 

It creates a clean course page with all of my elements.

 

Divi Learndash Kit Lesson Example

 

Divi LearnDash Kit

 

Here’s a standard lesson layout with a video.

 

Divi LearnDash Kit

 

I recreated the layout using Divi modules. I added the video to a video module, added a post title without meta under the video, added user course points, and added a profile that will display other courses the user is enrolled in. I kept the sidebar and didn’t add a header.

 

Divi LearnDash Kit

 

The result looks similar to the original but it now has my additions and tweaks. I want to add a few more features.

 

Divi LearnDash Kit

 

I’ve moved all of the modules to a specialty section so I can add a full-width post title and sidebar. I’ve disabled the sidebar in the post layout settings.

 

Divi LearnDash Kit

 

I’ve added the title to the full-width image with a background behind the text. I’ve also increased the header font.

There are no reviews yet.

Write a review

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.