Academy LMS

Academy LMS 2.0 Beta is Now live! Check it out!

Get 65% discount with Coupon Code : ALMSEARLYBIRD

Academy LMS Version 2.0 Coming Soon

International mother language day

Grab this deal before end

21% OFF

Coupon: ALMS52

  • 00Days
  • 00Hours
  • 00Minutes
  • 00Seconds

How to use Academy Elementor Addons?

How to use Academy Elementor Addons?

Hello, Website Designers! Academy LMS has enhanced its domain further with the Academy Elementor Addons. It gives you amazing features to create the perfect LMS site and gather more knowledge seekers. Therefore, you will get recognized sooner than expected and generate more sales through your courses. 

Currently, online courses are the easiest way to gain knowledge and generate money as an author. However, developing an effective online course is not an easy undertaking. However, Academy LMS collaborated with Elementor to produce online courses that were simpler than ever. Now, you can develop a unique course page, display courses uniquely, sell courses, and do a lot more. 

In this article, we will walk you through the process of creating a beautiful eLearning website using Academy Elementor Addons. As a result, you will be able to represent and sell online courses more effectively. Without any more delay, let’s explore Academy Elementor Addons.

Features Breakdown #

Before learning about the installation process and usage of Academy Elementor Addons, let’s learn about the features that it offers: 

  • Edit and build a course single or course details page via template builder 
  • Create your own course page template 
  • Personalize each course page 
  • Design different ages with 5 global widgets for all pages (Registration, Front-end Dashboard, Course Grid, Login, and Course Carousel)
  • With 23+ widgets, you can design a course single/details page 
addon collection

We are constantly upgrading and adding new features to Academy Elementor Addons. We are planning to add more widgets to this add-on. Now, let’s explore how you can include this fantastic add-on into your Academy LMS-powered website. 

Utilizing the Academy Elementor Addons  #

We all know that Elementor Page Builder is the most intuitive visual page builder in WordPress. To create a successful eLearning website, the Elementor page builder is a must. You can create your dream online learning platform that looks professional and applicable for selling courses through learning platforms. 

Academy Elementor Addons integrates with the Elementor Page Builder and gives you a useful collection of widgets and page-building options. As a result, creating an effective eLearning website has become far easier than before. So, let’s learn how you can use this amazing addon. 

Prerequisite  #

Before installing the Academy Elementor Addons on your WordPress site, you must first install the following plugin: 

  • Elementor Page Builder 
  • Academy LMS 

Elementor is the king of the WordPress website-building platform. It will allow you to create a professional and accurate website with a spontaneous visual builder. You don’t need to worry about coding since this page builder gives you so many easy drag-and-drop options to customize. 

elementor plugins installation

Academy LMS – This plugin is the future of a WordPress-based learning management system. This amazing plugin gives you the most user-friendly and fastest user interface. As a result, you can quickly create, modify, and sell online courses via your eLearning site. If you are running an eLearning site, this is a must-try plugin. 

academy lms installation

Installation Process  #

Now let’s learn about the installation process of the Academy Elementor on your site. 

First of all, let’s go to Plugin > Add New, write Academy Elementor Addons in the search bar, and hit enter.  When the Academy Elementor Addons appears with the Install button on the screen, click the install button and initiate the installation process. 

academy elementor addons

After the installation process is complete, click the Activate button. When the plugin is activated, click the Academy EA from the dashboard. 

demo templates of academy elementor addons

All these templates are built for the course single page and are entirely ready. To test the single course pages, turn on any one of the templates and preview the pages to view the changes. 

We will now show you how to work with the Academy Elementor Addons by maintaining the following sequence:

  • Design any pages using Academy Elementor Global Widgets
  • Design Course details page using Academy Elementor Addons template builder
  • Design a Completely New template using Academy Elementor Addons 

Using Academy Elementor Addons for Necessary Pages  #

You can edit all the Academy LMS necessary pages with the Elementor Addon. Here are the academy LMS necessary pages: 

academy lms created pages

 But for necessary pages, you will get the following widgets available at the moment:

  • User Dashboard 
  • Student / Instructor Registration
  • Course Grid 
  • Login Widget 
  • Course Carousel  
academy widgets

Now let’s see the Academy Elementor widget in action. 

Design Frontend Dashboard Page #

First of all, go to Pages > All Pages, hover over the  Dashboard page, and click Edit with Elementor

all pages

Now click the Edit button, click the Edit with Elementor button, and navigate to the Academy Widgets. Simply drag the User Dashboard widget to the spot where it is written – drag the widget here. 


The dashboard widget will transform the page into a detailed dashboard page once it is moved to the body of the Dashboard page. So, with Academy Elementor Addons, you can easily create an entire page and also edit all the crucial elements using the Elementor Page builder. 

dashboard widget

By following the above-mentioned process, you can easily create all the Necessary pages, such as Dashboard, Instructor Registration, Student Registration, Privacy Policy, etc. 

Note: Academy Elementor Widget for the Course Page is under construction. For now, you can customize the rest of the page except the course page. 

Design Student Registration Page

Go back to Pages, click the Student Registration page, and click Edit With Elementor. Now, drag and drop the Student / Instructor Registration widget on the right side. 

student registration widget

Click the preview button to see the page that you just designed using the Student Registration widget. Here is the page preview: 

student registration page

Design Instructor Registration Page  #

Get back to your WordPress dashboard and go to Pages, click Instructor Registration, and click Edit With Elementor. Now drag & drop the Instructor Registration widget on the right side. 

instructor registration widget

Click the Preview icon located at the bottom of the page to see the full preview of the page. Here is the page preview: 

instructor registration page

Design Course Single/Details page #

Now, let’s activate one of the default templates for the course single page. Go to Academy EA from the dashboard and enable one of the default templates available on this addon. We have enabled the following template: 

enable templates

Now, go to the courses page from the site’s front end and click on a course. Head to Pages > Courses – Academy Course page and then click the view button. 

course page

Now, from the course page, select a course to view the page design. We’ve selected the “Learn HTML5 Programming From Scratch” course. 

The page represents the design that you’ve Turned on in the Academy Elementor Addons. 

Now, let’s turn on another design and then view the page. Please follow the steps that we mentioned earlier to view the page design. 

course page templates enable

Now head back to the course single page to view the design. This page’s design settings differ from the previous one we demonstrated. 

demo course

Course Archive Page Design #

Design your Course Archive page using the Academy Elementor addon. Follow these guidelines to create a visually appealing and functional course archive page for your website.

Navigate to the Academy Elementor addon in your WordPress dashboard. Click on “Add New” to start building a new template for your Course Archive page.

add new

Name your template to easily identify it later. Select the desired template type for your Course Archive page. Save the template settings.

save settings

Optionally, mark the “Set As Default” checkbox to make this page the default Course Archive page. Click on “Edit with Elementor” to start customizing your Course Archive page. The Course Archive page will load in the Elementor editor.

edit with elementor

In the Elementor editor, you’ll find two widgets: Course Grid and Course Filter. Configure the layout by selecting a two-column format for the widgets.

select columns

Drag and drop the Course Grid and Course Filter widgets into their respective columns. As a result, your page will display a selection of courses and filtering options. Adjust the number of course columns according to your preference. Choose whether to display or hide pagination for the courses.

set course in columns

Click on “Course Query” to customize the courses displayed on the archive page. Configure the following settings:

  • Number of courses per page.
  • Difficulty level (Beginner, Intermediate, Expert).
  • Pricing type (Free, Paid).
  • Order by (Product title, Modified Date, Date).
  • Order (Ascending, Descending).
  • Include and exclude specific Course IDs.
  • Course category selection.
course query settings

To fine-tune the visual appearance of your Course Archive page, access the “Style” and “Advanced” sections of the widgets. Modify various design elements to match your website. After making the desired changes, click the “Update” button to save your modifications. 

modifying style and advanced options

Upon completing the design process, your Course Archive page will showcase the courses in the layout and style you’ve configured.

course archive page preview

Using Elementor Addon for Creating New Pages  #

This time we will show how you can create an entirely new template using Academy Template builder. Go to Academy EA and click Add New.  

create new template

After clicking the Add New button, a popup will appear that will ask you to provide a Template name. When you are done providing a template name, simply click Save Settings.  

template name

Right after clicking the Save Settings button, the Edit With Elementor button will be activated. So, click the Edit With Elementor button to edit the Example Page template that you are creating. 

edit with elementor

You can also set this page as the default by putting a tick mark on the box beside the text “Set As Default.” If you set this template as default, it will be activated instantly for the Course Single page. 

By clicking the Edit With Elementor button, you will get redirected to the Example Page (Template that we provided). So here is the Example page and the available Academy Widgets that are ready to be implemented for the page that you want to customize.  

So, let’s drag and drop some widgets and see what the page looks like. To see how it appears, we’ve dragged the following templates:

  • Title 
  • Thumbnail
  • Overview 
  • Requirements 
  • Course Reviews
  • Course ratings 
  • Course price 
drag and drop course templates

Now, click on the Preview icon at the bottom of the Elementor addon. Here is the full preview of the page: 

preview of a course

Note: You are getting 23+ Academy Elementor Addons Widgets for the Course Single page. Using these widgets, you can create and customize a page using the Elementor Page Builder. 

Wrapping Up  #

This is how you can use Academy Elementor Addons to construct whatever page you need for your eLearning site. In our mentioned example, we have shown a small piece of what this addon is capable of, but you can do a lot more and construct a full-fledged eLearning site with it. To understand its sophistication, you should also look at the demo pages accessible on this addon.

We hope you’ve started building and enhancing your eLearning site with the help of Academy Elementor Addons. We regularly upgrade our plugins and add-ons, so stay tuned to Academy LMS for the latest updates. Your next-generation eLearning site creation will be more effective with us! 

However, if you run into any difficulties while constructing your site, we are here to help. Academy LMS support team is always ready to support all the free and premium users! 

Powered by BetterDocs