Create an LMS Site with Elementor and without using an LMS Plugin

[@ShortDigitalMarketingTutorials]

I am going to try this! May be just what I need.

[@rizwanzaman1793]

This is exactly what I was looking for thanks!

[@nwdragonfly]

By the way you are technically awesome+ this is exactly what I was looking for ….. and it is still so relevant….

[@websquadron]

Love it!

[@annamarkov9293]

This is a great content, super useful! Thank you :-)

[@ztpimenov]

Good job! Impressive I'd say.

[@gregmfarmer]

So for us that rely on plugins, is there a memberships dashboard the members can see what they have seen etc

[@healthyhealthtipswithafifa3051]

Amazing video. Here I need to know which plugin is good for Singn up, Sign in, forgot passward, client Dashboard?

[@websquadron]

The paid membership pro (free) plugin has all of that included

[@healthyhealthtipswithafifa3051]

What's your opinion about Elementor essential addons plugin?

[@websquadron]

@@healthyhealthtipswithafifa3051 It's not bad, but I prefer not to use Addons

[@webtecatube71]

Hi! Thank you for the NEW APPROACH to the problem! I have a problem of creating simple enough layout for customers needs. In LMS's there is ALWAYS some problem with layout, like author avatars, menus appearing wrong way etc... Do you think this works with courses which has many pages...? Do you think accordion layout works for most of the courses? Thank you @Imran Siddiq!

[@websquadron]

I think it would as long as you plan it out in terms of the look/items.

[@OscarObians]

10:10 you could use a toggle widget instead of the accordion. From what I've seen so far it is exactly like the accordion sans the annoying expanded first line

[@websquadron]

Totally true my friend :) I chose not to use Toggle because you could end up having many toggles open - and each one contains a large sized video, so on the mobile and desktop it started to get a little too much. Because some also have full-screen PDFs embedded, the toggle causes lots of scrolling. Accordion with the CSS works well :) Try it out!

[@OscarObians]

@@websquadron Ah! Makes sense

[@websquadron]

@@OscarObians Indeed, Indeed :)

[@joshlangley-inspiringkids]

LOVE this video and It's given me some great ideas. Thank you. Are you able to show where I can copy the shortcode for stopping the first accordion item opening?

[@websquadron]

The new Elementor update now has a setting to stop that :)

[@joshlangley-inspiringkids]

@@websquadron Oh thank you! Now I have to work out where to find it lol!

[@websquadron]

@@joshlangley-inspiringkids when you’re in the pop-up template. Click the bottom left cog to see the settings. Go to the 3rd tab. It’s there :)

[@windowtinttraininginstitut5558]

Great Video , instead of having all the videos on one page, can we have button that say "Next Lesson" so everything is not in one page?

[@websquadron]

Yes as separate pages with it’s own menu system too

[@windowtinttraininginstitut5558]

@@websquadron thanks mate, so menu is Nav Menu done in Apperance and stick on the side of every page?

[@kikidesign]

Thank you for this fantastic solution to creating a course without an LMS. I followed and made a similar webpage. One quick question, how did you embed the PDF. I also created mine using Canva and want to embed it into the webpage. Could you please guide me?

[@websquadron]

I’ll need to check but from Canva there was some embed code - and I added it inside a shortcode

[@kikidesign]

@@websquadron Thank you for the reply☺. I tried that too but it keeps turning the doc into a video when I embed it. It works if I resize it into a presentation which I don't want to do. For now, I have added an HTML code to add a PDF download button. But, it redirects. So thinking of a solution to make this work.

[@CreateAgain]

Im just in the beginning phases and process to sell courses. Thank you as I know I won't need a whole LMS system set up. You mentioned the video plug-ins but also if I want to just house them right on the site. I know I don't pay for an enormous amount of space for my site, any idea on the recommended number before it would slow my site? Sorry it's kind of random and not exactly about LMS and Elementor. Thanks!

[@websquadron]

Great to hear that you’re considering a LMS type site. If the videos are part of a course and not on your home page where speed matters then you may get away with a small video. But anything over 10MB then I would add to KZbin as an unlisted video. No one can find it unless you give them the url. Then use Presto Player (it’s Free) and set up your video. This will protect the KZbin url so no one can go in and pinch the video. If you add the video to Video directly to wordpress then someone could still pinch it but not if you secure it with presto player. Like I said - it’s free :) Reach out to me if unsure - [e-mail] - and if you ever want to hire us for a power hour - we are here too. Good luck and hope to hear from you.

[@CreateAgain]

@@websquadron Thank you for taking the time to answer so throughly and quickly. I will definitely consider hiring you. This has helped alot. 💞🙏

[@MichaelTBishop]

I am attempting to create a site just as you have outlined here but have a come upon issues. If a non-member happens to hit the actual course page without registering they see a notice that says "This Content is for Members Only" with two buttons to Login or Join Now. The PMP message content doesn't appear within the Elementor designed page. It shows to the left of the page without any of the designed page content. How did you design the page to have the PMP message appear within the designed content?

[@websquadron]

We may need to do a 1-2-1 to better probe this

[@massi368]

oh that's video is saving me, i have a client who want me to make a e-learning platform with courses done in a certain way (design) that LMS plugin cant make or overcomplicate things. But now that i did find this video i wanna try it, but i've got a question ! my client in the future would like to make other courses. and i want to simplify this process to him, How can i do this ? and is it possible to do that in the way that he dont add a new level in pmo for every course ?

[@websquadron]

In that case use my alternate method using a WooCommerce Restricted Product feature. kzbin.info/www/bejne/Z5XVn3x6d6yne7M And you'll see how I use it here: websquadron.co.uk/web-design-mastery/

[@mpsmanger4713]

what about adding quizes , will we need a plug in for that feature?

[@websquadron]

You would yes. And it could be added to the relevant page.

[@jmwentzeltrb]

And when you have your course on a subdomain and sell on the maindomain? How to connect the users?

[@websquadron]

Tricky one. I'm no expert of courses, but I would have the button from the Min Domain direct you to the Sub-Domain. But that's just me. Tale care.

[@jmwentzeltrb]

@@websquadron Yes that's the way. I mean: when you sell on the maindomain users who are created are not automatically on the subdomain. I'm looking for a way to make that working. Easy and safe. Thanks for the vid btw!

[@websquadron]

@@jmwentzeltrb As long as the User can see that the Main and Sub Domain are connected - and of course that's simple as they'll share parts of the URL - then directing them is fine. Good luck and love to hear about your solution. Keep it simple - keep it safe!

[@ChaiandCookies]

Do you need the paid version of elementor to create the LMS with paid membership pro? I don't think I caught that in the video.

[@websquadron]

No. You could just use Elementor Free.

[@kv4805]

Thank you so much for the video.I learned a lot. One question... How about Admin or Teacher Reports Dashboard? Thanks again.

[@websquadron]

That’s when a separate LMS may be better unless you integrate a management system like memberpress to enable more details

[@worksmartomnimediatv5890]

@Imran Siddiq I would really like to see your ideas on creating a client management portal.

[@websquadron]

Email me on [e-mail] with your thoughts so I can get into your head :)

[@worksmartomnimediatv5890]

@@websquadron I will when I get back to my computer. My phone won't allow me to send email.

[@abel_wellness]

can you do a video for example if we are in a different country which don't use credits card payment but use bank transfer accounts

[@websquadron]

You'll have to use your own alternate gateway then .

[@snappedpixel]

Really helpful thank you! I've been struggling with simple membership / LMS set-up and just hit a dead end with Masteriyo LMS 505 errors when used with a separate membership plugin. Question - do you know if Paid Membership Pro works alongside WooCommerce restrict - so a website could host both courses (one-off payment) and member access (content)? I'll test it, but maybe you already have done?

[@websquadron]

Yes but you got to make sure that you define which products are touched as you could also allow subscription as a product via a WooCommerce addon and just use Restrict

[@joannesmolka1990]

Great tips but I was kind of hoping for how to mimic some of the other LMS features like progress, certificates, those kinds of things.

[@websquadron]

That’s where you’ll need much more custom JS and plugins. For a basic LMS without the certificates etc then it can work really well.

[@Popcorncandy09]

How do you embed the PDF via canva ? i tried your other method and it doesn't look as nice.

[@websquadron]

I need to dig out the method again but added some shortcode that contains the pdf url

[@Popcorncandy09]

@@websquadron I tried the one you posted a video about and it’s not the same look.

[@petrusvanbreda6533]

Thank you for the video. It will help me. I see you have a login page on the video, which seems to be different than the normal WordPress login, maybe a video on this will be great.

[@websquadron]

Hey :) That Login came with Paid Membership Pro :))))) So it's all there automatically once you install the plugin. Great feature.

[@southbanktkd]

How can we implement 'mark as complete'? Any ideas?

[@websquadron]

Not for this solution.

[@corazlepszy1550]

I love you for that video

[@websquadron]

Awesome

[@scottam19]

Great video, I'm just looking into doing an LMS and it hadn't even occurred to me that I could do it all through Elementor - now I'm all fired up that I can use my favourite page builder! Do you know if there is a way to monitor when a video has been fully viewed and then enable a button or link when it has - so that the student has to finish one part of the course before moving on to the next. I'm guessing I'll need to insert some JS but I haven't been able to find much on detecting when a video in Elementor has reached the end.

[@websquadron]

Yup that would need some code. If you’re using Presto Player then that might make it tricky but based on KZbin maybe the next section can’t be unlocked until the video is watched. Do share any code if you ever don manage to crack it :)

[@scottam19]

@@websquadron Hey, thanks, actually mentioning KZbin put me on the right track. After about 20 minutes playing with the KZbin API, I got this script together, it's rough around the edges and the button appearance needs styling to look disabled but it essentially works. // The next lesson button element has a Button ID of "btn_next_lesson" // The video element has a CSS ID of "lesson_video" var player; var checkReadyInterval; var path_next_lesson = jQuery('#btn_next_lesson').attr('href'); jQuery('#btn_next_lesson').attr('href', ''); function onKZbinIframeAPIReady() { checkReadyInterval = setInterval(testReady, 500); } function testReady() { if (jQuery('#lesson_video .elementor-video').length > 0) { clearInterval(checkReadyInterval); player = new YT.Player(jQuery('#lesson_video .elementor-video')[0].id, { events: { 'onStateChange': onPlayerStateChange } }); } } // when video ends function onPlayerStateChange(event) { if(event.data === 0) { jQuery('#btn_next_lesson').attr('href', path_next_lesson); } }

[@scottam19]

@@Notham8231-co9cjHi, yes, the code I posted seemed to do the trick - it needs some CSS to make the button look disabled as well. But my client decided to put on hold that side of their business, so I never got to implement it in a production environment. If you need any pointers with using the code, let me know.

[@scottam19]

@@Notham8231-co9cj Hi, it's in my comment in reply to Web Squadron (in this thread 2 years ago). But I'll repost it here - I hope it helps: // The next lesson button element has a Button ID of "btn_next_lesson" // The video element has a CSS ID of "lesson_video" var player; var checkReadyInterval; var path_next_lesson = jQuery('#btn_next_lesson').attr('href'); jQuery('#btn_next_lesson').attr('href', ''); function onKZbinIframeAPIReady() { checkReadyInterval = setInterval(testReady, 500); } function testReady() { if (jQuery('#lesson_video .elementor-video').length > 0) { clearInterval(checkReadyInterval); player = new YT.Player(jQuery('#lesson_video .elementor-video')[0].id, { events: { 'onStateChange': onPlayerStateChange } }); } } // when video ends function onPlayerStateChange(event) { if(event.data === 0) { jQuery('#btn_next_lesson').attr('href', path_next_lesson); } }

[@algislorian]

Hello Imran, I intend to sell several stand alone courses on my website for a one time payment each - no subscriptions, no memberships. I'm planning to create the courses themselves on regular WP pages, just like you do, without LMS plugins and I'd like to use PMPro to restrict access to those pages. I'd use WooCommerce AddOn to offer multiple payment ways. Now I have two questions: 1. How do I offer the same user to purchase different courses with the same account? Do I need more PMPro AddOns for this or is it possible with the base plugin and WooCommerce AddOn? 2. How can I add "members" (course users) manually for free (friends, family, giveaway gifts)? Thank you, I appreciate your tutorials.

[@websquadron]

You need to use a Restrict Content Pro plugin that only gives access if they purchase via Woo. We may need a 1-2-1 consultation to better discuss your requirements.

[@northeasttv8352]

A lot of waffle going on I wish people would get to the point

[@websquadron]

Thank you so much for commenting on my waffle. It’s made my day. And I hope you stick around :)

[@northeasttv8352]

@@websquadron unfortunately not. I clicked to learn how to create a course site using elementor and half way in was none the wiser so left

[@websquadron]

@@northeasttv8352 you really should watch the Site Tutorial videos. Take care.