Tutor LMS Frontend Course Builder Tutorial (Complete Guideline)

Tutor LMS has many amazing features that help you build and publish an online course. Not just that, it is also one of the first plugins to introduce the frontend course builder. We’ve mentioned this feature in some of our previous posts, but in this post, we are going to create a complete course using the Tutor LMS frontend course builder.

Designing your eLearning courses is a time-consuming process. However, it is also a very important part of your online course platform. Students enroll in a course after reading the descriptions, prerequisites, included materials, instructor’s portfolio, and much more. If these details are given properly, students become much more confident and enroll in that course.

That is why you have to take your time with your course creation. But many people find this step boring. That is why Tutor LMS introduced the frontend course builder. This allows you to build your course from the frontend rather than the backend. So, let’s see how you can create an entire course using the Tutor LMS frontend course builder. Let’s get started.

The Benefits of Using the Frontend Course Builder

Themeum always updates. Whether it is an LMS feature or a design, you can count on Themeum to always deliver. The frontend course builder is such a feature. We’ve seen a frontend course builder on some LMS plugins, but Tutor LMS was one of the first to introduce this amazing feature.

The frontend builder allows you to build courses and visualize the changes as you keep building. Since we’re using the Tutor LMS frontend builder, let’s discuss some of the advantages.

  • Build courses and see the changes take place live
  • Course creation is much more engaging
  • Improved security as instructors don’t have to log in to the backend
  • WooCommerce compatibility
  • Greater flexibility when creating courses

If you’re a beginner, it’s much easier to build courses using the frontend course builder. However, this feature is only available in Tutor LMS Pro. So if you’re using the free version, you have to use the backend to create your courses. Another great reason to purchase Tutor LMS Pro right?

With that being said, let’s move on and see how you can use the Tutor LMS frontend course builder to create your courses.

Get Latest Post Notifications!

Subscribe to our newsletter

Adding a Course

As we mentioned above, the frontend builder is only available on the Tutor LMS Pro. To open the course builder, go to Tutor LMS > Courses from your WordPress dashboard. Then click on the “Add New” button on top to create a new course (can also select an existing course). On the top admin bar, you should see a button to edit courses with the Tutor LMS frontend course builder.

If you don’t see the option to open the frontend builder, this means that you’re not using the Tutor LMS Pro or there’s something wrong with your license. However, if everything is ok, you should see the button labeled “Edit With Frontend Course Builder” on top. Clicking on this button will launch the frontend builder.

opening tutor lms frontend course builder

Once the frontend course builder loads up you should see the course exactly how it should look from the frontend. Now you can edit your course and witness the changes take place live. This is a fantastic way to build your course since you now know where your data will be placed. If you had used the backend to input data, for example, if you entered “course prerequisites”, you won’t see where this section will be placed. But now, you can input data and visualize the changes.

Now to create a complete course, we will go through each of the essential options. So let’s start creating our course one step at a time.

👉 Get Tutor LMS Pro NOW! 🔥
📌 Unlimited License Pack Available! 😮 GET TODAY! ✅

Course info

The first thing that we need to input is the course information. In this section, you can give your course a title, and description and also set the course slug. 

course info of frontend course builder

Try to describe your course the best you can. Many course creators like to explain why this course is important for you, the goals of this course, what the students will learn, etc. After that, move on to the next area.

Course settings

The course settings are divided into two parts, the General settings, and Content Drip settings. Let’s go through the General Settings first.

There are 4 options in the general settings. These are as follows:

There are 4 options in the general settings. These are as follows:

  • Maximum Students: Decide the maximum number of students who can enroll in this course. If you set it to 0, then there will be no limit to student enrollment
  • Difficulty Level: Set the difficulty level of the course. You can choose All Levels, Beginner, Intermediate, and Expert
  • Public Course: You can choose to make this course public so that no enrollment is required
  • Q&A: This enables the Q&A session for your course.
general course settings of Tutor LMS

The content drip is also an add-on. This allows instructors to release lessons, quizzes, and assignments based on their selected criteria. You can enable content drip and select the content drip type. We usually go with the 3rd option which unlocks the course contents sequentially. But you can choose the option that you like.

content drip settings in Tutor LMS

Course category and thumbnail

In the next section, you can choose your course category and a thumbnail for your course. A course can have multiple categories. For the featured image, the standard size is 700x430px. You can try other sizes if you want, but anything bigger than this might get some portions cut off.

course category and thumbnail

Course intro video

You can add a course intro video if you want. This will make your course look more professional and in the video, you can better explain the contents of your course.

course intro video

You can choose YouTube or Vimeo URL. You can also upload the video to your WordPress media library and use that video here.

Course Builder

Next comes the course builder. In the previous settings, we basically created the introduction part of our course. We also changed some general settings of our course. Now comes the part of actually building our course.

The course builder allows you to add several topics and then you can add lessons, quizzes, and assignments within those topics. Click on the “Add new Topics” button to add a topic. Then give the name of your topic and write a topic summary. After you’re done, click on the “Add Topic” button.

adding topic in Tutor LMS

Now you’ve created your first topic. Similar to this step, add several topics to your course. The topics may be considered as the chapters of a book, and the lessons, quizzes, etc. may be the contents of the chapter. So plan your course using this strategy and then add several topics to your course.

Adding a Lesson

Now that you have several topics, the next step is to add some lessons within those topics. You probably have already realized how you can add lessons and quizzes to your topics. This just shows how user-friendly Tutor LMS is. Let’s still see how you can add lessons.

adding a lesson to a topic

Click on the “+Lesson” button and it will open up a small window similar to the one when you added topics. Now give your lesson a name and add contents to your lesson. You can add texts and also media files in the lesson content area.

adding lesson name and content

Then upload a featured image of your text. The preferred resolution of the featured image is 700×430 pixels. The supported file format are .jpg, jpeg, .gif, or .png.

After that, you have the option to add a video to your lesson. You can drag and drop your video from your computer or you can add the URL from YouTube or Vimeo. Next, select the playback time so that students can view how long the video is.

lesson featured image and video

Next, you can upload attachments to your lesson. If you want to add exercise files or include notes, you can upload the file from here. Click on the “Upload Attachments” and select your file from the media library or upload it then select it.

The final option asks you if you want to enable your course preview. If you enable this option, users/guests can view the lesson without enrolling. After you’re done, click on the “Update Lesson” button.

And that is how you can create a lesson. Follow these steps and populate your topics with lessons. Add videos to your lessons and if you want to include materials, you’ve already seen that option.

Adding quizzes

The next thing that we are going to do is add quizzes to our lessons. Quizzes are a great way to evaluate what your students learned. This will keep them alert and attentive. You can add quizzes to your lessons from the Tutor LMS frontend course builder. The quiz builder is the same one you’ve seen in the backend.

The first step is to give your quiz a title and add a summary. After that click on the next button to go to the next step.

adding quiz title and summary

In this step, you can actually create the question. Click on the “Add Question” button and select your question type first. There are 10 quiz categories to choose from.

selecting quiz category

Depending on which category you choose, your interface will change to facilitate your quiz creation. For example, if you choose the Single Choice type, you have the option to enter your question, then add multiple options and select the correct option. There are a few more options below. These are:

  • Answer Required: Students cannot skip this quiz. They must answer this quiz.
  • Randomize: The options will be randomized
  • Display Points: The number of points that the students will receive upon answering the question correctly will be displayed.
  • Point(s) for this answer: Decide the number of points students will be awarded upon answering this question correctly.

In the end, you can add a description to your question if you deem it necessary. After you’re done with this step, click on the “Add to Question” button to add this question to your quiz. In this way, you can add multiple questions to your quizzes. Click on the “Save & Next” button to proceed to the next step. You can learn more from our Tutor LMS quiz tutorial.

Here you will find several quiz settings options. Some of these settings are the quiz time limit, quiz feedback mode, passing grade, etc. If you scroll down, you’ll find advanced options. Take a look at these options and customize those according to your wish.

👉 Get Tutor LMS Pro NOW! 🔥
📌 Unlimited License Pack Available! 😮 GET TODAY! ✅

Adding assignments

Since we added lessons and quizzes, it’s now time to add assignments to our course. Just like quizzes, we can also add assignments the same way. Click on the “+Assignment” button and it will open up a new interface. Give your assignment a title and write a summary for the assignment.

adding assignment in Tutor LMS

You also have the option to add media files to your summary. After the summary, you can upload attachments to the assignment by clicking on the “Upload Attachment” button. Then you have the following options:

  • Time Limit: Add a time limit within which students must complete their assignments.
  • Total Points: Maximum points students can earn.
  • Minimum Pass Points: Minimum points students need to earn to pass the assignment
  • Allow to upload files: The number of files students can upload in this assignment. If you input 0 then this option will be disabled
  • Maximum file size limit: Select the maximum file size in MB students can upload.

After you’re done with all these settings, click on the “Update Assignment” button to add this assignment to your topic.

👉 Video: Tutor LMS Frontend Course Builder Tutorial

Adding instructors

You can add multiple instructors to a single course. Simply click on the “Add Instructor” button and select the instructor. However, the instructors have to be registered in order for their names to appear.

Zoom Meeting

If you have the Zoom add-on enabled, you will see the option to add Zoom meetings after the instructor part. If you don’t see this option, then go back to your WordPress dashboard and go to Tutor LMS > Addons. From there, find the Zoom integration and check if it’s enabled or not. If it’s disabled, enable it and check the frontend course builder. If it’s enabled and you still don’t see the option in the frontend course builder, then contact the support of Tutor LMS.

For setting up a Zoom meeting, simply give the meeting a name, and a summary then adds a time and duration. You can set the time zone and add audio recordings. Also, set a password for the meeting and set the host of the meeting.

However, once you’re done with the meeting, move on to the next step.

👉 Get Tutor LMS Pro NOW! 🔥
📌 Unlimited License Pack Available! 😮 GET TODAY! ✅

Course attachments

If you want to include any materials for your course, you can do it here. This however is the course attachment and not the lesson materials. We included the lesson materials from the lesson builder earlier. 

But if you want to attach something specific to your course, such as course outlines, objectives, etc. simply click on the “Upload Attachment” button and select your attachment.

Additional data

Next, we have the additional data. The additional data is very important because here you have the chance to include what the students will be learning from this course. You can also include other important details such as the target audience, course duration, materials included, etc. All this information is something that the students look for before enrolling in a course.

👉 Video: How to Create a Course with Tutor LMS (Complete Tutorial)

The first thing that we need to include is “What will I learn”. The title is self-explanatory we’re not going into further details. But you can write in short what the students can expect to learn from this course. Instead of creating bullet points, write each point, then move to the next line by hitting ‘Enter’ on the keyboard. The builder automatically creates bullet points for you.

additional data in Tutor LMS frontend course builder

The target audience is the users for whom the course is meant. Just point out the people who might benefit from your course. Use the same tactics as you did for the “What will I learn” section.

The next section is the course duration area. Just write how long is your course in hours and minutes. This is there for students to understand how long will it take for them to complete this course.

Next, you can write down what materials will be provided in this course. For example, if you want to provide some articles, on-demand videos, downloadable content, certificate upon completion, etc. you can mention those here. It would be easier for students to know what they will receive.

Finally, there’s the requirements and tag section. This is to simply point out what students need before they enroll in this course. For example, if you’re making a Javascript course, you can mention here that students require basic knowledge of HTML and CSS. If you’re making an online art course, you can mention that students will need their own art equipment such as easels, colors, etc. In the next section, you can also mention tags such as business, arts, development, etc.

Course prerequisites

If the course you’re making is a bit advanced and students need to complete some other courses in order to enroll in this course, then mention those courses here. Simply left-click on the input box and all the available courses on your website will show up. If you have no courses, then nothing will show up.

Adding a Certificate

When completing a professional course, students expect to get certified. Tutor LMS Pro provides you with beautiful certificate templates for your courses. Simply select the certificate you like for your course and done!

tutor lms certificate templates

However, do keep in mind that these certificate templates are only available on Tutor LMS Pro. If you’re using the free version you won’t be able to use these.

The Certificate Builder

If you want to get creative with your courses, there’s a treat for you. Tutor LMS has its own certificate builder. Using this application you can design your own certificate the way you want. However, you can only use the certificate builder if you have Tutor LMS Pro.

tutor lms certificate builder

If you have Tutor LMS Pro, you can download the certificate builder from the official site. This is a separate plugin, so download it and then upload the file to your WordPress website. Then finally install and activate the plugin. 

We have posted an article on how to create beautiful certificates with Tutor LMS Certificate Builder. Be sure to check it out if you wanna know more about the certificate builder.

After you select a certificate for your course, click on the ‘Publish’ button on top to publish your course. And that’s all that you need to do in order to create your course. We now have a complete course made right from the Tutor LMS frontend course builder. Go ahead and check out how your course looks.

To check your site, visit your site or click on the ‘Preview’ button. The certificate builder and the frontend course builder are just 2 amazing features you get from Tutor LMS Pro. For more details check out our Tutor LMS Free vs Pro post.

👉 Get Tutor LMS Pro NOW! 🔥
📌 Unlimited License Pack Available! 😮 GET TODAY! ✅

Conclusion

Congratulations! You just created a complete course using the Tutor LMS Frontend Course builder. As you can see how easy and flexible it is to build a course in the frontend builder. Using a similar strategy, you can create several courses for your online education platform.

There are more options and settings to go through, for example, if you want to sell courses, you have to turn on the monetization option. Then select either WooCommerce or Stripe and setup your payment gateway. We are not going into that much detail about that but that is something that we might do in the future.


Disclaimer: This post may contain affiliate links and we may receive a small commission if you purchase something by following them. However, we recommend services/products that we believe good to serve your purpose.

Leave a Reply

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