How to Build a Course Website with Using LifterLMS and Divi (or any page builder)

Website Design

“Why are course and membership plugins so ugly?” I’m hearing a lot of frustration from website owners who want to add online courses to their website, that look beautiful as well as being functional.

I feel you. Wherever possible, I try to make sure that I NEVER sacrifice good design.

In this blog post, I’m going to show you the tools I’ve chosen to build my course and membership site and the sales funnel that helps me to grow it.

I’ll be showing you my design hacks to make creating beautiful courses using popular page builders instead of custom code. If you want to skip straight to the ‘how to make it pretty’ part, just scroll down to the video.

Before launching my first course, over three years ago, I did a LOT of shopping around. From simple plugins to fully fledged WordPress e-learning solutions like LearnDash and Sensei.

But all of them needed a lot of custom coding to look half way decent and the annual price tag was pretty hefty.

Both of the above are excellent solutions by the way, but when it came to creating a membership AND course site for The Marketing Fix, I settled on LifterLMS for a number of reasons.

(And before I tell you those reasons, I’m not affiliate for LifterLMS – I just get a lot of questions about how I use it.)

Why I use LifterLMS

  • The free version is perfect for free courses
  • It integrates with WooCommerce so that you can buy courses and products in the same transaction
  • It includes membership levels, so you don’t need an additional plugin
  • It’s heavily shortcode-driven which means that you have total design freedom when using a page builder

Integrating LifterLMS With Your Funnel

Before we dive into how to use Lifter with a page builder, I just want to touch on how it integrates with the other moving parts in my marketing funnel.

Deciding on which systems you are going to use for your cart, email marketing and landing pages is hard enough even before you start to try to connect them. Here’s the stack I’ve eventually arrived at, after a lot of testing.

What does it all cost?

There are several ways you can tackle this tech stack.

In theory, LifterLMS and WooCommerce are free and actually I don’t pay for any of the add ons. Instead, I’ve chosen to knit everything together with a very cool plugin called WP Fusion.

WPFusion connects your email marketing system with Lifter AND with WooCommerce, which means you can track student behaviour in detail, from pre-purchase to active course members. With this set up, ActiveCampaign tags sync across your whole system and power everything that happens seamlessly.

(I’m not going to get into detail about how it works here – if you want to nerd out about it, get in touch with my friend Kay Peacey over at Slick Business. She’s an expert on this set up.)

If you don’t need to heavy lifting that WPFusion brings, you can buy the WooCommerce add-on for LifterLMS which will allows you to use WooCommerce to charge for your courses. The integration is easy to use and costs $99 annually.

How to an elegant course website with LifterLMS and Divi (or any page builder)

Now for the part you’ve all been waiting for. In my walkthrough, I’m going to use Divi to explore three key areas of Lifter that can be designed with a page builder. But you can use Elementor in the same way, or any other page builder which allows you to build templates for custom post types.

In the walkthrough video below, we’re going to look at 3 areas:

  1. Using a page builder and the LifterLMS shortcodes to enhance auto-generated pages like the Student Dashboard
  2. Creating templates for lessons and courses
  3. Using a page builder instead of the Gutenberg block editor, to create stunning sales pages

1. Using a Page Builder like Divi with Lifter LMS Shortcodes

When you install and activate LifterLMS, some key page will be auto-generated for you (see below). These are the catalog pages that Lifter needs to operate.

Out of the box, these pages are pretty plain. They’ll default to your overall theme styles but you can’t add additional content to the page. Considering how much traffic these key pages get, this can be frustrating if you want your user experience to be really enjoyable.

Happily you don’t have to use them at all, because Lifter comes with an extensive range of shortcodes which you can drop into a page builder code or html module.

2. Creating Templates for LifterLMS Courses & Lessons using a Page Builder

Let’s tackle the standard Lifter course and lesson layouts. Like the auto-generated pages, you don’t have very much design freedom out of the box. But page builders like Divi and Elementor give you the option to create templates for all of the Lifter post types, including Memberships, Courses and Lessons. In the video below, we’re going to look at the Course and Lesson layout.

Top tip: If you are using Elementor, then it’s worth mentioning that there is paid plugin called Lifter Elements, which gives adds a range of Lifter modules to Elementor, including course outlines and Mark Complete buttons. Check it out here.

3. Using a Page Builder To Create Stunning Sales Pages for LifterLMS Courses

LifterLMS is designed to scale up to selling a wide range of courses and memberships, where people browse the course list, read the description and hit the buy button.

In practice, most people start with a single course or membership, and that means having a killer long-form sales page rather than a course catalogue.

Again, the team at Lifter have made it easy to replace the standard course catalogue and course purchase page with a sale page of your own design.

In Conclusion

LifterLMS is a great tool for both beginners and course experts alike. I’ve been using it for several years to run courses and now a busy membership site. I particularly like the community and mindset that owner, Chris Badgett and his team, have built around the product.

They have a very friendly and useful Facebook group for users, which you can join here.

More importantly, they do listen to feature requests and keep their community informed about new developments, as well as giving away lots of high quality free content around online teaching and course sales strategy.

Get my DIY Your Website Ebook

+ get 20% off your first order

You don't have to settle for an average website.

Follow my 5 seriously actionable pro design tips to help you level up your website.


Submit a Comment

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

Free DIY Your Website Ebook +

20 % off your first purchase

You deserve better than an 'average' website...

By downloading our ebook, you agree to receive our excellent marketing emails.