LearnDash Design & Tutorials

LearnDash Design & Tutorials

Category: Tutorials Page 5 of 6

Learn how to customize various aspects of the LearnDash LMS, including design, custom CSS, quizzes, certificates, payment solutions & more.

Redirect Clicks on Course Content Table for Logged-Out Users

By default, when a visitor—anyone not logged in to your site—lands on a LearnDash course page and tries to click a link in the course content table (it could be to a lesson, topic or quiz)… the page just reloads.

LearnDash has built-in course protection, so this is in place to stop a random visitor from accessing a course that they don’t have access to. The problem is that it redirects them back to the same page they are already on, essentially just reloading the course page.

This is less than ideal. But there’s a simple way to redirect these clicks on the course content table to any page of your choice:

  • a login page
  • a sales page powered by an ecommerce or membership plugin
  • your favorite cat video (probably not the best marketing strategy 😉)

This does involve a little PHP code, but don’t let it intimidate you. I’ll walk you through it.

Use the Code Snippets Plugin

The Code Snippets plugin is an alternative to adding code to your theme’s functions.php file. I believe it’s a much safer and more organized way to maintain code, especially for beginners and non-coders.

We’ll be using this plugin to implement the code to redirect clicks on the course content table.

NOTE
It’s a good idea to use this plugin for ALL future PHP code snippets that you would otherwise put in your functions.php file. And please don’t worry about plugin overload or “Ugh, I really don’t want to add another plugin to my site…” Code Snippets will not slow down your site.

Install & Activate the Plugin

  1. In your WordPress admin area, navigate to Plugins > Add New
  2. Search for “code snippets”
  3. Install & activate the plugin (author: Shea Bunge)

WordPress Code Snippets plugin card

Code for Course Content Table Redirects

Now that you’ve got the right tool in place, let’s add the code to actually implement our redirect.

  1. Navigate to Snippets > Add New
  2. Give your snippet a title. This is just internal naming, so choose anything you’d like.
  3. In the “Code” section, we’re going to add the following:
add_filter( "learndash_access_redirect", "ldfb_content_table_redirect", 10, 2 );

function ldfb_content_table_redirect() {

	$link = "https://learndash.com/";
	return $link;

}

Where it says https://learndash.com/, you would change that to the page on your site that you want to redirect people to. For example, it could be:

  • https://yoursite.com/login/ – if you’re using a custom login page
  • https://yoursite.com/product/name-of-product/ – if you’re using an ecommerce platform like WooCommerce
  • https://courses.yoursite.com/enroll-today/ – if you have one general sales page for all of your courses (perhaps you used a page builder to create a custom landing page, and are hosting your courses on a sub-domain)

The possibilities are endless. You can use any URL in the world! 🌏

(Optional) Description & Tags

It’s totally optional, but you can give your code snippet a description and/or some tags. These are just for internal organization, so use them as you’d like… or not at all.

Run on Front-end Only

The final option is WHERE you’re going to allow this code to run. You can run it in the admin area, the front-end of your site, or both.

  • Choose Only run on site front-end

Code snippets run on front-end only checkbox

Because this code only applies to site visitors accessing your LearnDash course content table, there is no need to have it executed in the admin area. So just choose to run it on the front-end only.

Save & Activate

The final step is to click the “Save Changes and Activate” button at the bottom. Then navigate to a course page in a private browsing window (or logout of your current session) and click a link in the course content table. It should redirect you to the URL that you specified.

Customize the “Return to Course” Link in the LearnDash Navigation Widget

When you use the LearnDash course navigation widget, and navigate to a lesson, topic or quiz page, you’ll see a “Return to [Course]” link appear at the bottom. No surprise, this brings you back to the course page.

But what if you wanted to customize the “Return to [Course]” link?

  • 🚫 Hide the “Return to” part and just display the course title?
  • 👈 Add a back arrow before the course title?
  • 👆 Move the entire link to the top of the navigation?
  • Or just completely remove the link all together?!

You’ve come to the right place!

How to Clone LearnDash Courses, Lessons, Quizzes & More (Create Templates)

Do you offer a lot of similar courses? Wouldn’t it be great if you could just clone one and start from a template? Well, thanks to a few different LearnDash add-ons, now you can.

There are 3 plugins that offer the ability to clone LearnDash content, and each one provides a different set of features. One plugin can clone just about everything (with one caveat), but it’s not free. The other 2 options are free, but each have some drawbacks. I’ll evaluate the options & help you choose the best one for your situation.

How to Show Percentage (%) Complete in the LearnDash Progress Bar

By default, the LearnDash progress bar only displays a colored bar to indicate a student’s progress in the course. There is no text-based example of what percentage they have completed.

LearnDash progress bar with percentage complete

Sweet lookin’ bar, man! How’d you do that? With this →

I’ve previously covered how to show “X out of Y steps completed” beneath the progress bar, but if you are trying to display a percentage instead, this article is for you.

Show “X out of Y steps completed” under the LearnDash Progress Bar

The LearnDash progress bar does an OK job at visually representing a student’s progress, but there are ways to improve it. If you have 50 or more steps in your course, the progress bar itself might not be the best indicator.

LearnDash progress bar with steps shownHere’s how I did it.

" data-medium-file="https://ldx.design/wp-content/uploads/2019/01/learndash-show-steps-completed-progress-bar-300x67.png" data-large-file="https://ldx.design/wp-content/uploads/2019/01/learndash-show-steps-completed-progress-bar.png" decoding="async" loading="lazy" >

Like the stripes? 😍 Here’s how I did it.

In this tutorial, I’m going to show you how to use a little CSS to display “X out of Y steps completed” below (or above) your LearnDash progress bar.

2 Ways to Manually Enroll Users into a LearnDash Course

There is no shortage of powerful form builder, membership & ecommerce plugins that automatically enroll users into your LearnDash courses. But many educators still like to enroll users manually.

There are 2 ways to manually enroll users in LearnDash. Let’s go over each one.

Explaining LearnDash Course Types: When & Why to Use Each One

LearnDash Course Price Type dropdown

There are 5 types of courses in LearnDash, and each one offers a different set of options. The names aren’t quite as intuitive as they could be. And if you’re using a third-party membership or ecommerce plugin (WooCommerce, MemberPress, etc.), things can get even more confusing.

How do you know which LearnDash course type to choose? We’ve got you covered.

Customize LearnDash Button Styles with CSS (Class/ID Names)

If you’re using LearnDash for your LMS, you probably know that there are buttons that perform all kinds of different functions. From navigation and payment to quiz actions, completing tasks & downloading certificates. Buttons galore!

By default, not every LearnDash button looks the same. When I built Design Upgrade for LearnDash, I went through every line of CSS to find every LearnDash button style, and I’ve compiled them all for you right here, in one convenient place.

If you’re looking to change any LearnDash button style, chances are you’ll find it here.

Hide the Comment Form on LearnDash Courses, Lessons, Topics, Quizzes & Essays

WordPress is designed to encourage discussion, and it does so by allowing comments on all types of content. This is the default behavior. In many cases, this makes sense for those who run a blog, discussion forum, etc. But for LearnDash courses, comments don’t make a whole lot of sense 🤔.

There are several ways to handle comments in WordPress, and I’ll cover all the ways to disable/hide the comment form on every type of LearnDash content, including course pages, lessons, topics, quizzes & essays.

How to Find the LearnDash Course ID

Were you told that you need to insert the LearnDash course ID for one of your blocks or shortcodes to work properly? 🧐 Did it make you feel like a lost puppy in a haystack? I feel your pain. So, let’s alleviate it.

There are generally two ways to find the LearnDash course ID, both of which we’ll cover in this article.

Page 5 of 6

Powered by WordPress & Theme by Anders Norén