Plugin Page Video Tutorials Changelog
Resources

Gutenberg Blocks

Our LMS plugin seamlessly integrates with Gutenberg, the modern WordPress block editor, to provide a user-friendly and flexible content creation experience. With our custom Gutenberg blocks, you can effortlessly enhance your site with dynamic and interactive elements tailored to your e-learning platform. These blocks allow you to showcase courses, feature instructors, and create engaging course navigation, all within the intuitive Gutenberg interface. This integration ensures that you can build and manage your educational content with ease and precision, leveraging the full power of WordPress's latest editing capabilities.

How to Use MasterStudy Gutenberg Blocks?

Adding MasterStudy Blocks

On the Gutenberg editor press the '+' button to add blocks:

In the Blocks tab, you can see the available blocks to use. Find MasterStudy Blocks:

After adding blocks there are four types of settings you can play:

You can set the available presets and styles just in the visual editor part of the Gutenberg. For example here is how Visual Editor shows when you add Courses Grid:

We see Visual Editor and Block Settings: General preferences of our blocks, as other settings are default and almost the same for all Gutenberg Blocks

Enabling MasterStudy Blocks

If you cannot find them among the available blocks, open the editor preferences:

Move to the Blocks tab and enable all MasterStudy Blocks:

MasterStudy Blocks

Featured Teacher

The MasterStudy Featured Teacher block highlights an instructor on your site with better progress than others. You can showcase the instructor's profile, including their biography, the courses they teach, and any relevant achievements. This block helps to promote instructors and provide students with insights into their expertise and teaching style.

Block Parameters

In the Visual Editor, you have to indicate a special picture to indicate the instructor and select the course card style:

In the Block Settings you can change:

  • Courses Per Page - indicate the number of courses of the instructor that have been displayed in the block

  • Courses Per Row - indicate the number of courses per row

  • Instructor - you can choose the specific instructor using it

  • Sort By - use this setting to sort the courses of the courses

  • Course Category - using it you can display only the courses of the specific category

  • Label - using the toggle you can enable/disable the label 'Teacher of the Month'

  • Label Text - indicate the text for the label

  • Position - enable the toggle to display the position of the instructor

  • Biography - enable the toggle to display the biography of the instructor

  • View All Button - enable the toggle to display the special button that opens all courses of the instructor

  • Button text - indicate the text of the View all Button

  • Button URL - you can also indicate a specific URL to this button according to your needs

Courses Grid

The MasterStudy Courses Grid block enables you to display a grid of courses on your site. It allows for customizable layout options to showcase your courses, including filtering by category, popularity, or rating. This block is perfect for presenting a detailed view of your course offerings, helping students easily find and choose courses that suit their interests.

Block Parameters

In the Visual Editor you can select the Course Card Style and change the text 'Courses Grid':

Here is the look of the course card presets on the front:

In the Block Settings you can change the following:

Layout:

  • Courses Per Page - indicate the number of courses per page

  • Courses Per Row - indicate the number of courses per row. You can use the icon to select for mobile and tablet views as well.

  • Sort By - choose the method to sort the courses that need to be displayed

  • Course Category - choose the specific categories to display

Filter (by taxonomy)

If you select the filter, you will get the following block settings:

  • Filter by taxonomy - disable it to hide the filter

  • Filter - choose the style to display the filter:

  • Options - select the options to display. Available options are Newest, Oldest, Popular, Overall rating, Price low, and Price high.

  • Filter Position - select the position of the filter: left, center, right.

Filter by Course Category

Parameters are the same as Filter by Taxonomy.

Course Card

Available Block settings for the Course Card:

  • Card Preset - select the one of the presets

  • Space between Cards - indicate the space between cards in pixels

  • Card Items - modify the items that have been displayed on the card. Use the hamburger icon (on the left side) you can change their orders.

    • Rating - inserts the rating of the course (with stars)

    • Category - inserts the category of the course

    • Title - inserts the title of the course

    • Dataslots - inserts a special division that consists of two data slots to add more data. Available data are Views, Lectures, Duration, Leve,l Members, and Empty.

    • Divider - inserts a divider (horizontal row) into the card

  • Featured Label Position - choose the position of the featured label

  • Status Style - select the style to display the status of the course

  • Status Position - select the position of the status of the course

There is also a Load More button which can be positioned and displayed at the bottom of the course grid according to your needs.

Courses Categories

The MasterStudy Courses Categories block provides an organized list or grid of course categories. Users can easily browse different categories to find courses that match their interests. This block helps in structuring your course offerings and improving user navigation.

Block Parameters

Available options in the BlockSettings:

  • Presets - select the preset according to your needs

Do not forget to indicate special images and colors for the Course Categories! Without them, you will not get the result you wanted in presets Colorful, Sleek, Dynamic, and Dynamic with Title Below.

  • Select Taxonomy - the setting gives you the availability to display several categories only

  • Categories Per Row - indicate the number of categories per row

  • Wrap - disable the toggle to get a horizontal scroll of the categories. They will be displayed in a row.

  • Align Content - choose the alignment

Courses Archive

The MasterStudy Courses Archive block enables you to display a list or grid of all archived courses. This block is useful for keeping your site organized by providing a dedicated space for courses that are no longer actively running but are still accessible for reference or self-paced learning. Archive Pages can be specified in the MasterStudy LMS Settings > Courses > Page Layout > Courses Page. Learn More about the Archive Page:

Block Parameters

In the Visual Editor choose the Course Card preset and indicate the text 'Courses Archive':

In the Block settings you can modify the layout parameters:

  • Courses Per Page - indicate the number of courses of the instructor that have been displayed in the block

  • Courses Per Row - indicate the number of courses per row

Courses Archive block is constructed using Courses Filter Columns, Course Card, and a Filter by Taxonomy. You can click on them and modify their settings according to your needs.

Courses Carousel

The Courses Carousel block presents courses in a dynamic, sliding carousel format. You can highlight featured courses, new releases, or popular courses in a visually engaging way. This block is perfect for drawing attention to specific courses and encouraging user interaction.

Block Parameters

In the Visual Editor of Gutenberg, you have to select the card style preset and change the 'Course Carousel' text:

The available parameters in the Block Settings:

Layout

  • Slides To Show - indicate the number of courses that need to be displayed in the carousel

  • Slides in Carousel - indicate the number of courses in the carousel

  • Sort By - choose the method to sort the courses

  • Course Category - choose the course categories that the courses need to be displayed

  • Autoplay - enable the toggle to turn on the autoplay of the carousel so slides (courses) in it will change without pressing the navigation buttons

  • Loop - enable the toggle to create a loop of slides so that once you reach the end of courses it will display the first one again

  • Nav Arrows Position - choose the position of the arrows in the navigation buttons

Courses Bundles

The MasterStudy Courses Bundles block allows you to display groups of related courses that are offered together as a bundle. This block is ideal for promoting bundled course packages, offering students a comprehensive learning path often at a discounted rate.

Course Bundles

Block Parameters

Available parameters in the Block Settings:

Layout

  • Number of bundles - indicate the number of bundles that will be displayed on a page

  • Bundles per Row - indicate the number of bundles per row

  • Select Bundles - choose the bundles that will be displayed (or do not select to display all)

  • Order by - select the method to order bundles

  • Alignment - choose the alignment of the block

Courses Search

The MasterStudy Courses Search block adds a search bar that allows users to quickly find courses by keywords. This block enhances the user experience by efficiently locating specific courses, making it easier for students to find exactly what they are looking for.

Block Parameters

Available parameters in the Block Settings:

Layout

  • Presets - select the preset to display the search bar

  • Categories - enable the toggle to add categories dropdown to the search bar so users can search the courses only in the course category that they selected.

Testimonials

The Testimonials block lets you display student or instructor testimonials on your site. You can showcase feedback and reviews in a visually appealing format, helping to build credibility and trust with prospective students. This block is perfect for highlighting positive experiences and success stories related to your courses and instructors.

Block Parameters

In the Visual Editor add the title, testimonial text, and the name of the person who left those words:

The available preferences in the Block Settings:

Testimonial Slide

  • New Slide

    • Add Slide - adds a new testimonial slide

  • Colors - choose the colors for the elements respectively

  • Current Slide - in this tab you can select the image for the current slide of the testimonial

Instructor Carousel

The Instructor Carousel block presents your instructors in a dynamic, sliding carousel format. You can highlight featured instructors, new additions, or popular teachers engagingly. This block helps to draw attention to your teaching staff and provides students with insights into the expertise available on your platform.

Block Parameters

The available preferences in the Block Settings:

Layout

  • Slides to Show - indicate the number of slides to display

  • Slides in Carousel - indicate the number of instructors that will be in the carousel

  • Order by - choose the method to order instructors in the carousel

  • Instructors - you can select the instructors to display manually

  • Autoplay - enable the toggle to change the slides within the predefined time

  • Loop - enable the toggle to change the slides in a loop, ensuring continuous and smooth transitions between instructors

  • Navigation - enable the toggle to display navigation buttons (arrows)

  • Nav Arrows Position - choose the position of the navigation buttons

Instructor Card

  • Presets - choose the preset for the instructor's card

  • Position - enable the toggle to display the position of the instructor (info will be inherited from the instructor profile, e.g: Lead Instructor, Professor of BA)

  • Biography - enable the toggle to display the biography of the instructor (info will be inherited from the instructor profile)

  • Rating - enable the toggle to display the rating of the instructor. Rating will be calculator automatically by the LMS

  • Rating Style - choose the style to display the rating

  • Card Content Alignment - select the alignment of the card contents

  • Show Socials - enable the toggle to display the social accounts of the instructors

Instructors Grid

The Instructors Grid block allows you to display a grid of instructors on your site. You can customize the layout to showcase various instructors. This block is ideal for presenting a comprehensive view of your teaching staff in an organized and visually appealing manner.

Block Parameters

The available preferences in the Block Settings:

Grid

  • Instructors Per Page - indicate the number of instructors to display in the grid

  • Instructors Per Row - indicate the number of instructors to display in a row

  • Order By - select a method to order instructors on the grid

  • Instructors - you can choose the instructors to display on the grid manually

Instructor Card

  • Presets - choose the preset for the instructor's card

  • Position - enable the toggle to display the position of the instructor (info will be inherited from the instructor profile, e.g: Lead Instructor, Professor of BA)

  • Biography - enable the toggle to display the biography of the instructor (info will be inherited from the instructor profile)

  • Rating - enable the toggle to display the rating of the instructor. Rating will be calculator automatically by the LMS

  • Rating Style - choose the style to display the rating

  • Card Content Alignment - select the alignment of the card contents

  • Show Socials - enable the toggle to display the social accounts of the instructors

PreviousLMS WidgetsNextLMS Pages

Last updated