If you’re using Elementor with LearnDash, and you like to tinker with your layouts, this one’s for you. We’re going to walk you through setting up a course page template using Elementor Pro’s Theme Builder. This only works with the Pro version, so if you’re still on free and want to give this a try, upgrade to Pro →
Page 2 of 5
Black Friday & Cyber Monday sales bring us some of the biggest deals on WordPress plugins that you’ll find all year. But the roundup posts are cluttered with 100+ WordPress plugins & themes, 99% of which you don’t need and will never use.
So I’ve pulled together a handful of LearnDash Black Friday deals to make your life easier. If you’re looking to take your online course platform to the next level, or have been eyeing a certain plugin but haven’t been able to justify the cost… here are the top LearnDash Black Friday deals.
Just gimme the LearnDash plugin deal
Sorry. The LearnDash Black Friday discount has expired.
Today (12/6) is the last day of deals. A few membership & affiliate plugins remain 👇
Have you ever wanted your answers displayed inline (next to each other) instead of stacked? How about using an actual blank line for fill-in-the-blank questions?
In this tutorial, I’ll explain how you can use custom CSS to design your quiz questions in various ways.
A few people have asked me if I could create a “dark mode” for LearnDash’s focus mode. The answer is yes, but it does come with a few caveats. Overall though, I was able to replicate the same colors in YouTube’s dark mode and apply them to the LearnDash Focus Mode experience.
If you’re interested in using a dark mode with LearnDash, I’ll provide you with the custom CSS below.
The Elementor page builder recently passed the 3 million active install mark, making it arguably the most popular WordPress page builder out there. And for good reason.
It can be a powerful tool for designing beautiful landing pages, including those used in your online courses. Since LearnDash doesn’t provide much in the way of design for course, lesson & topic pages, Elementor is a great tool to use alongside LearnDash.
The Big Problem: Why can’t you select the course, lesson or topic post type when creating a “Single” Elementor template with the Theme Builder?
Thankfully, there’s a fairly easy solution. I’ll explain the two main steps below.
This article will answer that question, provide an update for what we’re planning in the coming weeks & months, and lay out a timeline for when it’s all happening.
UPDATE: June 23, 2019
Design Upgrade Pro is now 100% compatible with the LearnDash 3.0 active template, including 20+ new options for focus mode, profile, tooltips & more.
Don’t worry, you can continue using all the old options with the Legacy template. Our plugin automatically detects the template you’re using, and provides different Customizer options for each 🙌.
We’re still working on videos & updating our product page, but rest assured, there are TONS of awesome features available right now for 3.0 😀.
For the rest of this article, if I mention “3.0,” it is in relation to the “LearnDash 3.0” active template, NOT version 3.0 of the LearnDash plugin. You can safely update to version 3.0 of the LearnDash core plugin.
“Legacy” vs. “LearnDash 3.0” Active Template
- If you’re upgrading from LearnDash 2.x, you will default to the Legacy template. You can continue to use Design Upgrade just like you always have. You shouldn’t notice any difference on the front-end of your site.
- If you’re brand new to LearnDash, and starting with version 3.0+, you’ll default to the LearnDash 3.0 template. Design Upgrade works with either template, so feel free to switch back & forth to find the design you like best.
- Design Upgrade Pro is now fully compatible with the LearnDash 3.0 template.
- We will continue to support those who want to remain on the Legacy template (for as long as LearnDash provides it as an option) 👊.
- Because LearnDash 3.0 adds several new features, there are more opportunities for improved design. We’ll be releasing new features somewhat steadily over the next several months.
Our first step is to port over as many existing styles from the Legacy template as we can to the 3.0 theme. Because the 3.0 design is structurally unique, and outputs some different content than the Legacy template, not all current features will be available in 3.0 (but we’ll maintain Legacy support so you can continue to use the plugin exactly as you are today, if Legacy is your jam).
The 3.0 template still supports…
- all progress bar styles
- most course grid styles (ribbon colors were excluded in 3.0)
- most course navigation widget styles
- most course content table styles (and a bunch of new ones 😍)
- all button styles (we added hover styles in 3.0 👍)
The course content table options will look different for users of the 3.0 template. That’s because the entire layout has changed, and the same options just don’t apply. But we have added options to customize the course content table, and they’re even better than in LD2.
Phase 1 is complete, and there are already more options for the LD3 template than there were for Legacy. But we’ll continue to add new features over the coming months.
If you have specific feature requests for design customizations you’d like to see with the 3.0 template, please leave them in the comments.
Possible New Features for 3.0
- Breadcrumbs: hide them globally (you can already do this on focus mode pages), change the bg color
- Alerts: several color options for alerts, broken down by type (regular, warning/error, success/completion, etc.)
- Profile: possibly adding 1-2 different layouts for the top section
- Status Labels: possibly adding color options for status labels
- Login/Registration: colors, shadows, sizing options
Phase 1: Completed on June 23, 2019
Phase 2: New features will begin rolling out for the 3.0 template gradually, based on user feedback (so please comment below what you’d like to see).
As always, I’m here to help. If you have any questions at all, don’t hesitate to ask. [email protected]
Thank You 🙂
And a big thank you to all of those who have supported me so far by using and/or purchasing the plugin. The reaction was far better than I ever expected, and you have inspired me to continue innovating and building a better product. So thank you 🙏.
I also greatly appreciate your patience. I know many of you were eager to get your hands dirty with those new 3.0 features. I would’ve loved to have all this ready for the launch on May 28th, but I pride myself on remarkable craftsmanship, so the wait time ensured I could produce the same quality of work you’ve come to expect.
I have done everything in my power to over-deliver 👊.
Will you continue to add new features to the Legacy template?
Probably not. The current feature set will remain, and we’ll continue to provide support if you have questions, but all future updates & features will be dedicated to the 3.0 template.
Design Upgrade for LearnDash 2.0 (Free) (Changelog)
A lot of work went into the free version of Design Upgrade for LearnDash 2.0, which brought about compatibility with the new “LearnDash 3.0” active template. We kept track of most of the noteworthy changes we made. It’s not 100% exhaustive, but if you don’t like surprises, you can read through this list to get an idea what will happen if you’re using the “LearnDash 3.0” template and upgrade to version 2.0 of our plugin.
If you’re still on LearnDash version 2.x, or using the “Legacy” template, you will not see any changes. Things will continue to work as they always have.
- Revert font sizes & line height to the theme’s default, instead of forcing 16px & 1.5em respectively.
- Status Indicators: Remove letter spacing & adjust font size
- Focus Mode: Sidebar Tray: Adjusted spacing throughout
- Focus Mode: Sidebar Tray: Larger clickable areas for lessons & topics
- Focus Mode: Sidebar Tray: Reduced the overall vertical space that items occupy
- Focus Mode: Sidebar Tray: Added hover effect to lessons & topics
- Focus Mode: Sidebar Tray: Flip arrow based on collapsed or open status
- Focus Mode: Sidebar Tray: Improve legibility of collapse arrow
- Focus Mode: Sidebar Tray: Added shadow on mobile
- Focus Mode: Sidebar Tray: Added bottom border to course title
- Focus Mode: Sidebar Tray: Remove icon next to course title
- Focus Mode: Sidebar Tray: Remove border when sidebar is collapsed
- Focus Mode: Sidebar Tray: Added background color to section headings
- Focus Mode: Sidebar Tray: Made the final quiz function like the lessons
- Focus Mode: Avatar/Menu: Rounded corners on menu to match course content lists
- Focus Mode: Avatar/Menu: Added drop shadow to menu
- Focus Mode: Avatar/Menu: Removed opacity on hover; added highlight
- Focus Mode: Avatar/Menu: Adjusted padding on items; added min-width
- Focus Mode: Avatar/Menu: Removed bold from menu items
- Focus Mode: Avatar/Menu: Added dividers between menu items
- Focus Mode: Avatar/Menu: Capitalized user’s name
- Focus Mode: Avatar/Menu: Added hover effect on avatar
- Focus Mode: Top Bar: Improved Prev/Next navigation buttons; added hover effect
- Focus Mode: Top Bar: Improved hover effect for Mark Complete button
- Focus Mode: Logo: Reduced vertical padding so the logo image is displayed larger
- Focus Mode: Increased font size of “Back to Course” link
- Profile: Search: Improved font sizes & styles
- Profile: Search: Improved
- Profile: Course List: Removed extra space below “Course Progress” area
- Profile: Course List: Removed “Course Progress” label; % & steps moved to the left
- Profile: Course List: Adjusted spacing around assignment & quiz lists
Login & Registration Modal
- Login/Registration: Added border-radius to input fields
- Login/Registration: Changed font sizes & colors to theme defaults
- Registration: Fixed up input fields & spacing as best I can
- Assignments: Added red hover color on delete icon
- Assignments: Removed bold from uploaded assignment title
- Assignments: Increased length of “status” column so status fits on one line
- Assignments: Upload: Adjusted padding for filename to allow for more characters
- Assignments: Upload: Several font adjustments
- Breadcrumbs: Removed bold font weight
- Breadcrumbs: Increased font size
- Breadcrumbs: Mobile: Remove 100% width of status indicator
- Tooltips: Styles: removed bolding, adjusted border & font size
- Tooltips: Added a slide-up effect
- Pagination: Styles: Removed bolding, adjusted font size
- Pagination: UX: Larger clickable area for prev/next arrows
- Pagination: Center align all instances
- Pagination: Make width consistent across all instances, and expandable to account for infinite number combinations
Progress Bar Widget
- Progress Bar: Increased font size
- Progress Bar: Moved stats to the left
Course Status Area
- Course Status: Not Enrolled: Mobile: Reduced spacing
- Course Content: Increase font size in a few spots
- Course Content: Mobile: Improved styles (reduced spacing, full-width clickable areas)
- Course Content: Remove unnecessary bolding & capitalization (% complete)
- Course Content: Added background color on hover (topics)
- Course Content: Reduce size of grey footer area when there’s nothing in it
- Course Content: Removed extra space above/below assignment file uploads
- Tabs: Added hover color
Widget: User Status
- Adjusted spacing & font sizes
- Course Grid: Improved spacing throughout
- Course Grid: Updated some text colors to inherit theme styles
- Course Grid: Standardized border style & radius throughout
- Course Grid: Standardized buttons to match LD3 buttons
- Course Grid: Bolded course titles
- Course Grid: Faded short description text color
- Course Grid: Removed spacing/margin from empty
- Course Grid: Equal height columns
- Course Grid: Buttons & progress bar aligned at bottom of grid items
Uncanny LearnDash Toolkit
- Resume Button: Inherits default LearnDash button styling
In today’s world, shared accounts are commonplace. I bet if you asked 10 friends if they’ve ever used someone else’s Netflix or Amazon account, at least half would say yes. That might not be a huge deal for a company as big as Netflix—with 138 million paid subscribers (source) and $15.8 billion in revenue in 2018 (source)—but for your small business selling online courses, it matters.
You’ve worked hard to create an online course that provides value to your students. The last thing you want is for students to share login information with a friend, who then gets to take your course for free.
This article will outline how you can prevent students from sharing login information for your LearnDash site (or any WordPress membership or LMS). So far, I’ve identified three different solutions, which I’ll outline below:
- Only allow one login per account, at a time – prevents simultaneous logins, but is more of a deterrent than a complete solution
- Enable two-factor authentication (2FA) – a stronger solution that makes it more difficult, but still doesn’t completely prevent it
- Social login – require a user to connect via Facebook, LinkedIn, Google or another account that they wouldn’t want anyone else to access
There is no guaranteed way to prevent multiple students from sharing login information. You can make it more difficult, but you can’t completely prevent it from happening.
Should You Prevent Students from Sharing Logins?
Before implementing a solution, I encourage you to consider if it’s worth it. I understand your desire to get paid for your work. You’ve spent hours creating awesome content. You deserve to be compensated and not taken advantage of.
But did you ever wonder why even the biggest online giants (Google, Netflix, Amazon, Spotify, etc.) don’t prevent the sharing of login information?
They certainly have the resources. They could probably have it up-and-running in half a day. And yet, while most of them employ some form of advanced security (email notifications of suspicious logins, security questions, backup phone numbers, two-factor authentication, etc.), none of them completely prevent anyone from sharing login information.
I suspect there are at least two reasons, both of which you should consider for your LMS:
- They want you to be able to login from anywhere, at any time (because we travel, and demand convenience). How would they truly know if it’s you trying to login, or one of your friends?
- They want logging in to be as easy & seamless as possible, so that you come back and use the service. If you had to go through extensive verification every time you logged into Amazon, would you find somewhere else to shop?
Hopefully, you’ve given it some thought. If you’d like to explore the options, here we go…
☝ Only Allow One Login Per Account, at a Time
This method will prevent simultaneous logins with the same account. A student could still share their login information with a friend, and as long as the real student is logged out, the friend could log in.
If your courses are released on a specific schedule, or only run for a short period of time, this could be an excellent option. Because all students need to complete the course at the same time, this method would only allow one person to be logged in, taking the course, at a time.
🚷 WP Bouncer Plugin
For this method, we’ll be using the free WP Bouncer plugin.
- Install & activate the plugin
- That’s it! There are no settings.
The WP Bouncer plugin will take care of everything behind the scenes.
- User A logs in as “student”
- User B then also logs in as “student”
- The next time User A tries to load a new page, they are kicked out
- User B continues to use the site
- If User A logs back in again, User B is kicked out
They could continue this pattern indefinitely. I think the idea is to show both users (the paid student & the “free friend”) that it’s not worth it. They’ll keep booting each other out and neither will be able to use the site freely.
Of course, if they communicate their schedules, and make sure one is always logged out before the other logs in, they’ll be able to get around it. Thus why this is more of a deterrent than a complete solution.
Options & Filters
By default, the user who gets kicked out will see a warning message:
However, if you know how to use WordPress hooks, there are a few filter hooks available.
- ignore admins (allow admin accounts to be logged into simultaneously)
- custom redirect URL (upon logout)
- change the number of simultaneous logins allowed
📱 Enable Two-Factor Authentication (2FA)
A slightly more advanced option is to use two-factor authentication (2FA). This method takes a different approach than the WP Bouncer plugin. With 2FA, each time a user tries to login to their account, they will need three things:
- username or email address
- a one-time, randomly-generated code sent to a single device
KEEP IN MIND
This method will make it more difficult to login—not just for the mooch who is trying to access your course for free, but also for the person who paid for it.
The additional code is typically a 4-6 character code sent via email, SMS text message, or generated via an app on a user’s smartphone. It is only valid for a very short period of time (30 seconds to 5 minutes), before a new code is needed.
There are also some two-factor authentication apps you can install on your phone, and simply tap a button to confirm your login.
Technically, a student could receive a 2FA code on their phone, and still have time to share it with a friend, who could then login. But because of the short lifespan of the code, the student and friend would need to be in immediate communication with one another.
With LearnDash & WordPress, there are multiple plugins that enable two-factor authentication. I recommend you read through the details of each, and choose the one that works best for you.
- Google Authenticator by miniOrange – Free & premium options for most of the common 2FA smartphone apps
- Two Factor Authentication by UpdraftPlus – Free & premium options that support Theme My Login, WooCommerce & several other plugins
- Google Authenticator – Older, and not recently updated, but still works well
- Two-Factor – A super-simple plugin that could eventually get merged into WordPress core. Limited options.
If you already use the premium version of either iThemes Security or Wordfence, they both offer two-factor authentication as well. You might want to consider using their options before installing another plugin.
👥 Social Login
Personally, I’m not a fan of requiring a user to authenticate with a third-party service. Some users might not have a Facebook account, or just don’t want to connect Facebook with yet another application (Facebook isn’t necessarily known for protecting your data 🤨).
However, most students would not be comfortable providing access to a very personal social media account. If you required them to connect to a social account when they log in, it’s unlikely they would share this access with anyone else.
Social Login Plugins
There are quite a few social login plugins to choose from, but I’d probably recommend this one:
I haven’t personally used it, but I’ve done some research, and it appears to be the best all-around option. Please let me know if you’ve used it, or have other recommendations.
I certainly realize the desire to prevent the sharing of login information, but you should consider if it’s worth the added frustration it could cause to your actual students. If you decide to implement something, keep a close eye on any student feedback you receive.
If you have another suggestion for how to prevent multiple logins on the same account, please share it in the comments.
I’ll briefly outline below how I made this happen, but here’s a video explaining how I set up a certification track in LearnDash. If you need to offer a certificate after the completion of multiple courses, this is for you.
Award a certificate after completing multiple courses in LearnDash
With LearnDash, it’s easy to award a certificate upon completion of one course. You can also easily provide a certificate upon completion of a quiz.
However, if you need to award a certificate upon completion of multiple courses, it’s not as easy. Here’s the best way I found how to award a certificate after completing several courses.
Creating a New Course for Just the Quiz
- Create a new course that just contains one quiz
- Set the course to FREE (this makes the course page viewable to everyone, but you have to be logged in to access it)
- Set course prerequisites for this course (in my case, 3 courses had to be completed in order to take a final exam to get the certificate)
- Apply your certificate to this course
Creating the Quiz
- Now create the quiz and place it within this course
- No prerequisites for the quiz
- DO NOT apply any certificates to the quiz
- (optional) Add in a completion percentage in order to pass the quiz (ex: they need to score a 70% or higher to pass the quiz)
This prevents them from accessing the certificate until they have scored a 70% or higher.
Use Shortcodes to Enhance the Experience
I also used some shortcodes & messages to help enhance the experience.
Place a message at the top of each prerequisite course that only shows up for those who have completed it
I provided a link to the final exam course, as well as a link to purchase any other courses that they might not have bought yet (example: If they only bought 1 of the 3 courses in the certificate track, they’ll have a link to buy the other 2).
If you have another way of setting this up, or any creative idea for achieving the same thing, I’d love to hear it. Please share in the comments.
I’m still in the early stages of collecting the best LearnDash example sites, but here are some to get you started.
I hope to be expand upon this collection, and maybe even do a few mini video-style podcasts with some of these creators. I’ve tried to include important tools, themes & plugins they used, but a video walkthrough/explanation would be even more badass. One day, perhaps.
Until then, please enjoy this collection of LearnDash inspiration.