How to Create an Online Course with WordPress (Step by Step)

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
this video is brought to you by WP forms WP forms is the most beginner friendly drag-and-drop WordPress forms plug-in on the market just click on the link in the description below to get started the first 200 people to use coupon code WP v IP will get 50% off WP forms are you ready to have a course on your website we'll keep watching in this video I'll walk you through how you can set up a course plugin so you have maximum control over your courses on your website these are the things that we'll go over but don't worry if you already have a website or you've been following along in our series then you can go ahead and click on a link in the description below we'll have the time stamp or exactly where you need to go so it will install learn - plug-in and then we'll set up the course using learn - so that'll be the bulk of what you'll do but if you still don't have a website and you want to get started today then keep watching from the beginning and let's get to it this is probably my favorite animation it took me entirely too long to create so I use it as often as I can but it does a really great job of explaining how all of this ties together when you're building a website it's very similar to what's happening when you build a house you had the land that you need to use to put the house on that's the same as the hosting provider the hosting provider has servers that all of your files and folders will go on next you have an address and that's so people know where to find you and the address is your domain name or your web address you want to start building your website and your website is your home that's what houses all of your files all of your images the color structure the way that looks or the functionality of it via the plugins finally you have your mailbox which is your email address and that's how people can contact you and all of these come together to make up your whole website on the web now at wpbeginner we've recommend using Bluehost as your hosting provider they have great customer support they are one of the oldest most established hosting companies out there they're officially recommended by the wordpress.org organization and wpbeginner users can get 60% off and a domaine by using our discount code to get that discount just go - w-w-w-w-wait we also have a link below that you can use as well from here just click on the big green get started button and it'll take you to the select your plan page you can choose your plan here the biggest difference between these two is with this one it's very basic in you're only allowed one website whereas with this one if you have web addresses or multiple websites that you want to set up then this might be the best one for you after you've chosen which setup you want go ahead and sign up with a new domain name that you want since it comes free and click Next from here you want to go ahead and create your account by filling in all of this information and then down here you want to verify the package information I will say that your domain privacy you don't need we normally just turn that off things like backup site and site Locker there are a lot of great plugins and features available within WordPress so you don't need that either once you fill out all the information you see the amount that's being discounted now just fill in your payment information and you'll have your hosting account set up now that we've signed up we'll get a congratulations screen and we'll just need to click on the next screen where we can create our password this password will be used to manage our hosting account once you create the password they will start setting up the account for you one of the great things about Bluehost is now they've made installing WordPress even easier from here you can select a theme that you might like to go with your site since I'll be walking you through the whole process let's go ahead and skip this step and now they automatically set up WordPress for you you no longer have to go into your Bluehost account and install WordPress and go through that process once we get everything set up you can click start building and we'll be taken to the backend of our WordPress dashboard where we can start customizing it once you log into your dashboard it might look something like this where we have a lot of notifications and things like that what we want to do first is kind of clean everything up there will be some plugins that will install but for now I'll just walk you through how you can remove everything so you can start with a clean slate first so we will head over to our plugins area and when we do that we can scroll down all the way down until we see all of the plugins and we can select them all and click deactivate and you want to click on apply so we're deactivating all of the plugins first then we need to select them all again and then click delete and apply and go ahead and say yes to were sure that we want to remove all of those plugins there will be a few of these that we will reinstall but I want to show you that process later so right now we just want to get with a clean slate to start our whole process and you'll see once they're deleted you see them going away and you see the whole process being updated in real time also if you see something like a wordpress update go ahead and click update now and now you have a screen on your dashboard like this and now we can move on okay now we can start building it but really quickly I want to show you that this is what it looks like in action right now it's just a simple coming soon page on the front end but if you notice up here it says not secure and that's because we don't have a SSL certificate installed on there making sure that your site has an SSL certificate installed and activated does a couple of things of course it is more secure for your readers or the people who come to your website it's also a slight ranking factor with Google because it tells Google that you are a secure site in the past you used to have to pay like sixty to one hundred and fifty dollars to get a secure certificate installed on your site but nowadays companies like let's encrypt have made this process super easy with our hosting providers like Bluehost what you can do is go back into your dashboard go down to security and then you can ask for a let's encrypt certificate it'll might take a little bit of time for them to set that up but once they do then we can go in and set it up for ourselves once you go there you can request a certificate and you'll see that it is pending and that they're working on it as you can see it can take a little bit of time for them to get that set up once that is done and set up the next thing we can do is go to our WordPress dashboard you'll want to log in with the credentials that you saved before from our dashboard go over to plugins add new and we can type in SSL what we're looking for is this plug-in and it's called really simple SSL what we want to do is we want to install that and then we also want to activate it once we activate it you can see that it's active in the plugins area and then we can go to settings to set it up from here you see some detections we can see that it's not enabled but the SSL certificate is detected on our site so we can go ahead and activate the SSL great now that it's activated you see up here we have HTTPS and everything is active and we also have the little padlock connected so that's a good start and now we can move on to designing the rest of our site okay now that we have some of the technical aspects out of the way let's go ahead and start taking a look at our theme this is the theme and by default I've removed the coming soon plug-in and so you can see what our theme looks like out of the box when WordPress first is installed on your site it comes with a theme already and it's usually set up for the year that it's installed for instance this is the 2019 theme and you see it's pretty good it's nice and clean but it's a little lacking and we're going to fix that next so to show you what theme we have you can go into appearance themes and you see by default this is the current theme you see it's showing right here is the 2019 theme automatically installed by WordPress when you want to install a new theme for your website you can simply go click on the add new and it will go into the WordPress repository where all the free themes that are vetted and proven to be okay for WordPress are here but for this video we're actually going to be using the Astra theme it's a very specific theme it is a great theme to allow you to customize your site exactly how you want it to look we need to install it and we also need to activate it so now this is our theme that is on our site and we'll take a look at it you see it's still pretty bland but we're about to fix that so let's head back over and with the Astra theme what they've done now is they've created what's called starter sites basically what used to happen if you had a theme and you wanted to install it on WordPress you had to go through the documentation and follow along hope that there's good documentation on how to make your site look like the demo that you saw and that you wanted and it was a lot of frustration for a lot of people what Astra has done is they've created these starter sites that make everything look exactly like the demo that you're seeing and the demo site that you want so to get this going we need to install a plugin so let's head over to our plugins area add new and let's type in the Astra starter sites this is the one that we want so let's go ahead and click install now and then once it's installed we also have to make sure that we activate it and now we see this plug-in is active so now we can click on the ready starter sites here and from here we want to select the page builder in this video we'll be using the beaver builder and that is a light page builder there's also a pro version but for this I'll show you how to work with the light page builder so we'll click beaver builder and then let's click Next and now here are all of the starter sites that we can choose from to install on our site and when you see agency that's for a premium version but we can click on the free version and you'll see we even with the free version we still have like 35 sites that we can choose from so you want to just take a minute to go through and see which one of these starter sites do you want to choose to start with like what is it that you're ultimately building what type of blog are you building what type of website are you building is this for a business is this for fitness is this for outdoors do you have a product that you're wanting to sell just go through there and figure out which one you want to do and even if you hover over it it actually also will show you what the homepage will look like and it kind of Scrolls down for you so you can see it all now I've been talking a lot about gardens so I can look at this one and I think I'm going to use the garden maintenance for this theme so I want to take a look and preview it see it in action and you see it showing up on my site and it gives me a good idea of what this will look like this is the one I want to use so I'm going to go ahead and click import site now before I do you want to see that these are all the check marks that it's doing and it's letting you know what all is happening and now you can click on the little question mark here and it will tell you everything that it's installing when it imports all this stuff you see that it's going to also install some extra widgets the beaver builder plug-in lite version we will get the ultimate add-ons for beaver builder lite and then it's also going to install the WP forms Lite plug-in which is a contact form plug-in and that is also our sister site and it's a really great drag-and-drop contact form plug-in aside from that it'll also import some customizer settings and then it will also import some content to make the site look exactly how the demo looks so we're ok with all of that once we review everything let's go ahead and click import site and you see it can take anywhere from two to ten minutes for this set up what I'm going to do is go ahead and speed this up so that you're not having to wait around for this ok in real time that took a little bit longer than a minute to import all of those plugins and all those settings so those are really super fast and now we see that the site is done and we can take a look at it so opening it up in a new tab opening up in a new tab we see this is what our site looks like and I do notice that some of the pages are double but I'll take care of that later it's probably just some glitch but scrolling through and looking at all of this it looks really good all you really need to do is add your actual content put in your information and your site is pretty much good to go that is way faster than what it usually takes for WordPress sites to get going so now that we see what this looks like let me walk you through how you can make some changes to your site one of the first things we want to do is going up at the top you see we have our logo the blog title and things like that we can customize that by clicking on the customize button from here and it will open up this customizer area and now you'll see these little pencil areas and these are the things that we can change so if I click on this you can see I can change my logo here if I want I can also remove it clicking on these other items this will change my site title and so let me change that to something that is more about my blog I'll call it my garden blog and we can decide if we want to display that here or not the same thing with the tagline that's simply what your site is about so you can update that here as well and then we can choose to display the site tagline if you want or not and then when you do the in line logo that will either put it underneath the logo or in line with it we'll keep it in line for now now the little site icon that's this little guy up here and we want to make that change here my default you'll typically want to have something by 512 by 512 their ultimate goal is to have a good clear logo to work with and you want it square if you can but we're going to select this one and you see if it's not square it'll let you crop it which is what I'm going to do here so I'll crop the image and now it's automatically placed up there so that looks pretty good we can click the publish area okay now you see that there some duplicates that usually shouldn't happen in this case it did but that's okay we can just go in and I'll remove those extra pages so I'm going to go back to the site I'm going to go to pages and I'll remove the duplicates here select all the duplicates and go up to the top and move to trash then I'll also want to make sure I go into the trash area select them all again and I want to delete them permanently it's a two-part process in case you delete something that you don't want to Lily then you can go back in and get it back but we'll keep that deleted and now it looks pretty good I'm in the customizer area so we can do some more customizations you'll also see over here there are other pencil areas and this will let you change up some of these items for instance we can change the menu area here we can edit the menu and we can choose which ones we want on there you can also add an item since this is a blog I want to add a page and right here it will let me add a blog you know create that page on the fly and add that to my menu you see that that is my primary menu if you wanted to you could also add another footer menu and that would go at the bottom but for now we'll just keep it like this now let me click on this area and this will change my header layout you see that these are the different layouts I can have to choose from if I click on them then it will Center my logo or it will put it to the right for this one I just want to keep it you can also disable the menu altogether but then people won't know how to get to you so let's not do that and for this one I want to keep it on the left you see here we can choose what the last item is and this could be changed to having nothing having it a search button or having an actual button this is great if you have a website that you want to get a quote for that you could send them to a quote form if you wanted you could also do something like asking them to sign up for a newsletter or something like that for the button link you that's where you would send them to an actual web address and you'd have to know what that web address is for this I'm just going to send them to our contact page so let me open that up so I can grab the URL on I will come back here and paste that URL here now yeah you can also just send them to the contact page but this is just to show you what you can do with this and from here you can choose what type of button to do you can even customize it if you want for this will just keep the theme button and right here you can choose the color and the layout of what you want your theme to look like so you could play with that here if you don't like any other colors that you choose you can just hit clear and it will go back to the default color there are a lot of settings that you can choose from from hover of the text and also the hover of the background color so when you mouse over your button changes colors like you see here right here you can also choose the radius so right now it's pretty square but we can change the button radius and you can start see it starts to round off when I put 10 in there it's really rounded off so you can adjust that as you want you could also see the padding that's how much space on top or bottom that you want to have your button half and the same thing for the horizontal if we make it really big then it would be a really wide button but then that will cause some problems so we'll put it back down so we're pretty happy with that button we'll go ahead and click publish and then we can go back and back and a few other things that we can look at let's go ahead and look at typography and let's look at the primary header typography that's for my title and you see when I change the font size it gets really big so if you want that to be a little bit bigger you're gonna adjust that here same with the site tagline if you want to make that a little bit you can do that here going back we can look at the base typography that's basically for everything else on the site and you see for this one it's the body and content we can change the font here to any of these there are several several to choose from and you can just play it with the fonts to see which one fits your brand for your site if you also know which one it is that you want you can type that in here to show you what lada looks like let me just do that and that's pretty good the font variant is for things like italics same thing with the font size that's just how big the text of the body will be and before it used to be like twelve back in the day that's become really difficult to read especially on the larger screens so the typical variation is between 16 and 20 and then you also see the line height that's how much white space is between your words if you do anything that you don't like you can simply click on the little undo and it will revert back to what the default settings are so all that looks pretty good and that's for the body and content area now you can also make changes to your headings area and that are these larger headings on your site you want to choose the fonts that you want for that for this one I will show you what open sans looks like and that changes down here again you can also give the font area if you want and for this one it's semi bold this is also where you can choose the text transform if you want everything in uppercase or if you want it lowercase or capitalized you can do that here we'll just leave that all uppercase for this and that all looks good so we'll head back and you just want to do the same thing for pretty much all of your content go in and change it all out so it looks exactly how you want it to look now that we're done with typography then we can also look at publishing this and then let's make some changes to the actual web page so I can show you how beaver builder works from here I'm logged in to the website but I'm on the front of the website so you see that so you see the toolbar at the top so let's click on beaver builder here and you can get a walk through to go through the whole process since I'll be showing you how this is done I'm going to click no thanks and from here you can just start to make the changes that you want for instance I want to change this whole area out where it's talking about it's time for you to have the garden of your dreams you can highlight this area and then just start typing in what you want it to say and then scrolling down I can also change the description area here and once I start typing it in it starts to fill in the information and you see I can change the alignment here but we want to keep the alignment centered so I'll do that and that looks pretty good under the separator you can choose if you want to have a separator in between like you see here you can change the style where you want to put the separator you can also choose the dash or a different color just pick it from the color wheel like this but we'll choose none so and then under typography this is where you can change a little bit of the font you can also change things like the line height and the style and spacing this is also where the uppercase is and you can change it here to be normal or in uppercase or lowercase under advanced you can also do some things like animation where you can make it slide in from say the left like you see there here I don't want to have this so I can just click on that and just X out of that so I can remove that and you see once you hover over any of these things this is where you can make the changes for instance right here this is the big background image and I can choose to work with this image from here scrolling down for the background photo I can choose to edit this and I can also remove that here if I want to edit this these are all the photos that came in with the starter site so I could just go scroll through and find one that I would prefer and that's an image that I like a little bit better so maybe we can use that one in and scrolling down you can make other changes you see when I scroll it stays put that is called fixed and so for attachment you can also choose to allow it to scroll and that way it will scroll when the webpage Scrolls as well like you see that but for this one I think we like it in a fixed setting so we'll put fixed so looking at the overlay you see we also have a black overlay when you're scrolling down and that's that black area we can change this here and you could change it to a different color if you want and so when they're scrolling then that would change that as well we can also choose to just have a color so I'm pretty happy with how that looks and we'll click Save and now you see kind of the differences hey I'm going to scroll all the way down because there's a button down here that I want to work on this is the one I want to do so let's click on it once you click on it you have the style area that we can look at and now I want to look at the background color so I can change the background color to what looks better for the site mmm the blue is okay but we'll do something like a green that goes with the garden site that's not bad and if you look down here you can also do the structure of it you can cause it to do full width or you can do a custom length if you want but we'll just go with Auto and that just basically goes by the default and here again you can choose the rounded corners that you want I'm going to give it a tin to show you how it looks with a tin and it's still a little bit less let's do more like a 6 the next thing we want to do is let's go ahead and take a look at the link here's the section for the link and what you can do is you can either type in the URL or over here you can hit select and once you start typing in a page or a post that you have on your site like projects you can see that that pulls up and then it brings in our URL for our site for the page projects we can choose to open it in a new window or do nofollow so let's make sure we click Save Changes and now I like the style of this button so what want to do is come over here and duplicate it now I have a duplicate button so I'm going to drag it up to a different area on the site where I want it to go that's what I'm going to do I'm going to put it here and I'm going to remove this old read more area and then we'll make this one the new button what I need to do here is change the link for this and change the text of it so I'm going to change that to savory more and then I'm going to change the select for the link and we'll have it go to our blog great and then we'll change that and then we'll save it so now that looks pretty good there what you can also do actually that goes to our about page so I'll change that to our about page so all that looks pretty good scrolling up and you see I actually still want to change these buttons here you know these buttons need to be changed out so we can do the same thing grab this button and we will copy it I'll make a duplicate and then I can drag this up there at the top and drag it up above here so I can replace this button so now I just need to hover over that and remove this button and now I can do the same thing for these others as well so I need a duplicate it and move that over and then I'll just move it over here remove that button because I don't want it anymore and then I'll do it one more time and then I can change it over here and then get rid of that now I like the look of this but there's a little bit of space extra space that I don't really like here and let me show you how you can change the margins for that it's basically held by the margins so click on it let's go to advanced and you see the margins on the top of this are at 50 let's try something like 30 and I like the feel of that a little bit better so the margins is the space around the button so I can just do the same thing with the others and what I could have done is change the spacing on that one before I duplicated but this gives you a good idea of the power of how you can make all of these changes to get your site to look exactly how you want it to look once we're done with that we can save our changes the next thing I want to do is let's take a look at our menu area you see you see up here we have all of these services and all of these pages that we're showcasing and our blog is actually not in uppercase whereas all the others are so there's a little bit of work that we need to do with that and we can do that next so to work with menus we will go to the backend of our website from the dashboard you can go to appearance and you can go to menus you can also get to this from customize but I like this one and let me clear out this you see these are all of the pages that are on my menu and there's some that I don't want like projects my site is mostly going to be about blog so I'm going to actually remove projects and services and then I want to let's click and drag and rearrange some of these other pages and then finally you see that my blog is in lower case so to get it looking like the others I'm going to put it all in uppercase letters so I'm going to do that here and now it's a smaller menu section and it feels a lot better for what my site is about you could keep those if you were a small business that would work perfectly for you and if we go to manage locations this is where the main menu is you could also set up a footer menu and that would go at the bottom of the site just to show you some of the power that you have with this so that looks pretty good and we can go and visit our site and see what it looks like and it was a much cleaner setup now let's click on the contact us page because we have this form on here and I want to set it up and I want to clear up some of this other stuff to make it look better for my site so let me show you how you can set up a Contact Us page and this is using WP forms light that was installed when Astra installed its starter sites so to do that let's head back over to our WordPress dashboard we need to go to he forms and lets go to all forms from here you can see the form that it was already set up for us it's called contact us so we can edit this to make it look exactly how we want it to look so this is the WP forms area and this is the form and these are all the fields that we have we can remove them by just clicking on the little trash button and you see here we can click on the your name area and you can either make it first and last or you can make it simple I prefer simple so we'll keep it like that basically it's a very simple form you see in parentheses that's required but we can actually click on the required button to make sure that they don't fill this out without filling out this information now I'm going to do that for all of these fields you see here we can actually enable email confirmation and that just means they need to fill out their email twice to make sure that they fill it out correctly so we can set that up and then finally we will make the your message required as well okay that looks pretty good now we need to go over to settings because we need to make sure that the notifications are set up properly first under general we can change the form name if we want and that's just for our internal information you could also change what the send button says here and what it says when it is in the process of sending you can change all of that there I would recommend keeping the anti-spam honeypot and that just keeps spammers from spamming your site now going over to notifications this is the notification that you'll get and it's pulling in the email address from your website admin email you can keep that here or you can heart code your own email here as well when you get your email this is what it will say so if you want you can change it and maybe add the website name here as well and then these fields will come from the actual form so we want to keep those like that is you could add a notification something that is perfect for if you have a business website you could add multiple notifications so that like the sales team will get it and IT will get it or something like that if you wanted to let's go to confirmation this is what the user will see when they submit the email and it's a simple message that will pop up on the screen if you want you could also change it and maybe send them to a different URL or say a Thank You page you could set up a Thank You page here if you wanted for this setup I will simply keep it as a message page and I'll just send them this message and that all looks good so let's go ahead and save this and now we need to need to get out of this and we need to head over to our contact page to change that up a little bit and since we're using beaver builder we want to launch the beaver builder plug-in and see when I click on that that's the shortcode that the WP forms comes over as but I don't really want this stuff over here because I'm not a business if you are a business then this would work perfectly for you so we can remove some of these items so now once I've removed everything and I basically have just one big column and then I'll also remove this map area down here since I don't want to showcase my location so that's a much cleaner contact page and you could add a little bit more up here talking about the blog change this out to something that's more pertinent to our website and then this kind of feels really long and I kind of want to make this a little bit better for the user to fill this out so not make it so big so I'm going to change the margins of this so you can do that with the margins and I'll just fill out the left and right margins now you can just clean it up a little bit more see how it all looks that looks pretty good and we'll be done with this so let's click done and publish okay the next thing we want to look at is the blog page basically I want all of my posts to come on to this blog post and we need to set this up to do that we'll go to customize and there's an area that we need to fix so once we go to customize we want to scroll all the way down to homepage settings and we have the home page as the home page and now we need to select the page where all the posts go so I'll hit blog and so once I have posts all of those will show up here and we're good with that the other thing we want to do is we want to work with the widgets the blog page has sidebar and these are all the widgets that are currently on the sidebar there's some that I don't want so I'm going to expand these widget areas and I'll just remove the ones that I don't want here and now we're set with those three and I'm okay with that so now we can click publish and that should look good to go now I'll just show you real quickly I'm going to go out and create a couple of blog posts so that you can see what this blog page will look like now and I'll speed that up so you can see it okay this is what it looks like with blog posts on the page and I like the look of that over on the right you also see the widgets that are there you've got my search categories and my recent posts and then I can click on the actual post here and this looks okay but you see up here in the web address I have my web address set up and this is the permalinks and it's currently set up to show the month day and year so I don't like that and I'm going to go in and change that to do that let's go over to our dashboard we need to go down to settings and we're looking for permalinks and you see it's currently set up for a day and name and what I like to do is make it much simpler and I usually just do the post name and that's just going to be the title of the article or the title of the blog post to show and that's how I like to set them up it's much simpler and it's easier for Google and it shorter URLs are a little bit better for SEO so let's click Save Changes and now you when I go to a blog post you see it's a much simpler URL structure and I like that much better the next thing I want to look at is let's go ahead and take a look at our logo I'll go into the customize area and if you remember we could click on this little pencil area to take a look at the logo okay here is your logo and if you want to change other logo you can click on it and you see when you just click change logo you can either choose an image that's already on your site and you see the suggested dimensions here but I want to show you how you can create a logo pretty quickly just by using a free tool there are several free logo maker services and sites out there I'm going to show you how you can do it with something called canva canva is a real easy way to create images for your site and also create a lot of images for things like Facebook and Pinterest Instagram it works for all of that so let's head over to canva you'll want to create a an account for that but it is free once you log in you can scroll down and choose the logos area and then you can see all of these logos designs or logo templates that you can choose from just go through and pick one that you like the look of and then you can customize it from there you can click on them to see what they look like over on the right if there's a certain type of logo like I put in garden you can see something like this here so I'm going to use this one as my starter point and I'm going to make some changes here and change the fonts there are a ton of fonts to choose from as you see up here just change the fonts and then you can just find one that's best for your brand will also change the name to go with my garden blog you can see I can change the style I can change the size of it that's a pretty good size I like that and I can even change the color here and choose from default colors here or you could also click on the plus area to use a specific color here that looks pretty good and I'm not really happy with this font so I'm going to change it to lotto bold that looks better and then this icon up here that came with this template logo but we can get rid of that and if you want you can go to elements and from here there are a ton of icons that you can choose from there are several that are free and then there are also that are some that are premium and then you can also just search for an icon that you're looking for and you see here or some to work with I'm gonna pick something simple like that and that's a little too big so we're gonna bring it down and then I just want to decide how I want it do I want it below do I want it on top I think I kind of want it that would be a little bit too big I think I kind of want to move my name over and make it to the left and just keep playing with it until it looks reasonable that's not bad now I want to Center this whole thing to do that easily what you can do is select the whole thing so I'm just left click and dragging to select both items on here and then we can go up and group them and then that way when I move them around they are grouped together and then you see I can move them around so it's centered yeah that's not bad for a real quick and easy way to do that so we can go over here and click download PNG is suggest that you also would want to do transparent a transparent background means that it would take on the color whatever color you have you would have to do the pro version to do that so we'll just download it and do the PNG version and then we'll just have a white background with this so I want to download this to my desktop and we want to give it a decent name and that was a real quick way to do a logo so now we just need to go to our customize area change the logo and we'll go to upload file and you can just drag that photo up there we can select that from here we could do a little bit of cropping and that's what we did and we can remove this different logo for a Retina device and now that's my new logo and we can choose the width of it and make it just perfect for what we want and now since I have the name in my logo I'm going to remove the title but I'm going to go ahead and keep the tagline and then from here you can kind of play with it to see how it looks I don't really like how the tagline looks underneath it so it looks like I didn't crop enough when I first uploaded it and that's okay I'm just going to quickly make a change on this when I select the logo and hit select then I can crop it again so I'm going to actually go in and crop it a lot more bring the top down bring the bottoms down I'm going to bring in the right and left as well so make it much more compact yeah and I like that a little bit better so that's pretty good I mean that's a super fast way to get a really quick logo on your site no problem so we're going to go ahead and publish that and now I'm gonna look at it on our site you see there's a little bit more issues with the tagline but that's okay if you wanted to you could play with that a little bit more to get it exactly how you want that but that looks really good if you've been following along throughout our make money series then you're kind of building up a whole business with your website we started from creating your website to adding content and ads it's also adding affiliate content to your website so you can start making money pretty quickly and then we moved on to creating a membership site and now that you've had members on your site they should have been telling you kind of what they're wanting to learn more from you and now you're ready to create a course so let me walk you through how you can create a course on your website using learn - the reason why we love this is because it allows you to keep everything on your site so take a look at learn - and see which package is best for you once you create an account and download the plug-in then let's head back over to our dashboard so that we can get everything started okay from the wordpress dashboard let's head down to plugins add new and we'll need to upload the learn - plugin that we just downloaded from our member area on learn - website I'll click upload choose the file and you'll want to install it once you install hang around to make sure that you also click activate ok once you've gone through and installed and activated learn - we'll have an area up here that we can add our information the first thing you want to do is go to settings and go over to LMS license so you can enter your data here so that you will make sure that you're getting updates okay once we set up our LMS licenses let's go ahead and go to PayPal settings so we can set up our payments so add in your PayPal information you want to enter the cancel URL where you'll send people back the return this is all information that you'll need to fill out for PayPal and then if you're wanting to just test things out then you'll want to turn on the test box here and then once you're done with all that you can click Save Settings learn - also has add-ons for stripe as well as to check out if you want to set those up as well now we can create our first course so we can go over to courses and from here we want to add a new course so let's click on the add your first course and from here we can give it all the information that we need this is my garden blog that I've been working on so we'll add in all the information here then under builder we can choose how many steps are in this course no steps in it but we want to create a new lesson so each course is broken down into each individual lessons they and these are almost like sections so in multiple sections or multiple lessons we'll build up into a full-blown course so we need to set up these sections that will be for this particular course now to find the right soil let's do another new lesson of get the right container find the right plants or seeds so build all of this out and then if you want to add quizzes to test their abilities then you can create a quiz here under settings you can choose the look and feel of the course and the optional settings that you want to do or under course material if you just click on here or show they listened display all the supporting materials so if they need to download a checklist that you have then you can add this here if they need to get materials for the course than they can if this is a certificate course or if there's a certificate that goes along with this course then you can choose that here you would have to make it first and then upload it and then it would be there you can choose how to make the course content visible so if it's just invisible to the raw release then you'll want to do that and this is just for the table so a lot of times marketers will do always available regardless and then that way they can see what they're getting into and then later on only the enrollees will be able to actually take the information or take the course and then if it's a really long course then you can paginate it or make multiple pages like more next and then under here you can customize how you want the lessons to look under access mode you can choose whether you want this to be a free open course if you want it to be recurring or if it's simply a one-time purchase so something like buy now would be a one-time purchase if this is kind of a recurring fee then you can do the course pricing and how many days is the billing cycle so for this we'll just set up one time or $29.99 if there are any prerequisites or any other courses that you're doing then you could set that up here as well as points access expiration is this a yearly thing a lot of courses are going through a process of they're only allowing that 100 and 365 days because they typically have to update it and once they update it it's somewhat a completely new course so they'll do that under course progression you can showcase how they are progressing throughout the course linear is once you finish one then you can go to the next on the next you wanted to you could allow them to move freely it just means if somebody doesn't want to look at my life on the right soil but they want to jump to getting the right plants and they can otherwise they're not allowed to move to finding the right plants unless and until they complete the other two so that's what linear versus freeform means freeform gives you a little bit more gives the students a little bit more access to all of the information so they can learn however it's best for them so that looks pretty good I think we can also look under groups groups is somewhat like if you're doing a cohort or if you're doing like open enrollment or you open up a course and you have multiple come through then you can set them all up in the group or you can just leave it open like this which is what I'll do simply or make keeping this easy so this is our first one we'll go ahead and click publish and then that is your first course that you can start making money with and then you see right here is taking on the sights font and CSS and the color scheme here and then you can go through and look at the different lessons and once I'm finished with each lesson then you'll see that the statuses will be filled in so obviously I'll have to go in and actually fill in the lessons but by and large this is a full on course that you've just created for your website so now when we go to courses you can see that the first one is this one the access part that is being filled out by member press so don't worry about that you could combine learn - with member press and make it an even more robust membership site along with courses and then when you go to lessons you'll see the lessons that we just created for that particular course okay so now I want to show you what it looks like when somebody comes to sign up for your course first thing I want to do because I don't want to add any payment information I'm going to turn this to free sender settings instead of it costing money we're going to make it free and I'm going to click update then I want to then I want to copy the address and I want to open it up into an incognito window where I'm not logged in so I'm gonna paste that here and then you'll see what it looks like so when I say I want to take this course then it's going to take me to a login screen and this looks okay but it's not really telling them what our site is or anything like that so we can actually change that and learn - as well this would also show up when you do pay I just didn't want to set up the payment so heading back over to our dashboard we go to LMS settings and under general the design and content elements it's set to legacy by default but let's go ahead and change this to learn - 3.0 they just changed this out and here's where we can change some of the accent colors I'll do wpbeginner or orange I'm going to do the progress color of green and notifications or warnings we're going to set to red and for focus mode let's do distraction free experience and then here's where we can do the login and registration so we'll customise the login and registration here is where we can select an image for our logo I'm gonna choose my garden image logo okay so now let's go and see about signing up for this course you see it's changed a little bit and it looks a lot nicer we can choose to login to enroll and now we have a different login feature here which looks a lot better now you definitely want to change the color scheme to match your site and everything but but you get the idea I also notice that when we changed it to the learn - 3.0 has changed a lot better look and feel of the course itself as well okay once we have a few courses that we can do you can put them on a page so that people can see them to do that let's go to short codes there are different short codes that you can add to a page to show off the courses so you see here is the short code for showing a list of all the courses I'm going to grab this short code because I'll use that in a page now I want to add a page for this so let's go to add new under pages we'll add new and we'll type in courses so people will know what they are and we will you LD underscore course underscore list and then let's click publish and now when you click publish we can view the page and then these are the two courses that we could do that's a little bland and so there's a way that you can add a little bit of a grid system for it so we'll do that next so let's hit back and we'll go to the learn - area we want to go down to add-ons and from the add-ons these are all of the added functionality that you can add to your course and the one that we're looking for is the learn - course grid so click install now once you install it you also want to make sure that you activate it and what this course grid does is it just makes the courses look much better on our site go back to courses and we want to edit this in the new Gutenberg feature if you just go in and click on the little plus icon you can type in learn - and then you'll see all of the LMS blocks that you can do and the one that we want to do is the learn - course list and what you'll see is it'll bring it in into like this grid style where you can adjust it but that looks a lot better already so now you can showcase the courses a little bit better but now we also want to make sure that these courses are available on our menu so to do that let's go ahead and add that to our menu section by going to appearance menus and on the main menu we want to add courses to the menu and this pricing is for membership that we in the last video series and now for courses I want this all to be an upper case I'll do that and we need to make sure that we save our menu and now when we go to visit our site we will see the courses that are available up here and when I click on it I can see the courses available and I'm logged in so I automatically as an admin have access to these but if you're not but if you're not logged in I'll show you what it looks like go to incognito and go to courses and then if you're not logged in then you'll click on that so that you can see the price and you can log in to enroll same thing with the Master Gardener to log in to enroll see once you click take this course and I'll take you through the process of going to PayPal where they can pay for the information once they pay for it and it'll take them back and then they will be logged in so that they can take the course like this and so now our little site that started in this series has really started to grow and added more and more features that are more and more income streams for us and we're starting to grow our little empire in the next video of this series I'm going to walk you through how to set up an e-commerce site so that you can start selling items as well and we'll do that so make sure that you hit the subscribe button go ahead and click on the notification bell if you want to be notified when the new video comes out and thank you for watching
Info
Channel: WPBeginner - WordPress Tutorials
Views: 38,766
Rating: undefined out of 5
Keywords: how to create an online course with wordpress, how to create an online course, how to make an online course website, learndash plugin, how to create an online course wordpress, wordpress, creating online courses a step by step guide, how to create an ecourse with wordpress, create an online course website, create online courses, wordpress lms, how to build an online course, wordpress lms plugin
Id: VXlNS9uXbHI
Channel Id: undefined
Length: 56min 26sec (3386 seconds)
Published: Mon Jul 01 2019
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.