In this extended video tutorial I’m going
to teach you step-by-step how to build an online course website in this is what the
websites gonna look like right here but hey ladies don’t feel left out because we have
a more female version of this website with more feminine looking colors of course in
the video are to be building this one but we were just all-inclusive here in this video
now I don’t want to spend or need to spend any time selling you on this concept of building
an online course in an online course base website it’s one of the hottest topics right
now and it has been for the past few years in fact I somewhat of a expert in building
online courses and online course websites is matter fact here is my [email protected]
I have an assortment of video training courses and I have over 7000 students in my training
courses right here on all types of various topics so when I say I kinda know what I’m
doing and I kinda know what I’m talking about I actually do and you could see it through
my example there on my website by the way my name is Adam from WPCrafter.com where I
make WordPress tutorial videos for non-techies and if you’re new here I’d like you to consider
clicking on the unsubscribe button and to not miss anything go ahead and click on the
well okay this is going to be an extended video I’m in a show you everything that you’re
going to learn in this video right now when you show you everything that were going to
create but I want to take one minute to give you a little bit of background I make a video
series on creating online courses I made one in 2006 I made one in 2007 and this is the
2008 version of how to do it and I’ve learned each year how to make this process easier
and more accessible in just a enjoyable process I’ve learned a lot and I am no doubt that
this year you are going to be successful watching this video implementing everything that I
show you you are going to be able to build a beautiful online course websites let’s take
a look at what we can be building together in this video so like I said there’s a more
masculine version and here’s a more feminine feminine version to me going through the masculine
version but it’s really just a difference in colors so this video is for everybody okay
here is what the course cell speech is going to look like and this is always been a weakness
in this actually the biggest weakness with all e-learning platforms like teachable course
Sarah I mean let’s just go through the laundry list of these platforms their pages where
you actually buy the course the rigid there there ugly and they don’t do a great job of
actually telling the story of your course and selling your course for you we’ve solved
that in this video I’m going to show you how this problem is solved and you’re going to
be able to sell your course in a beautiful format and this is what working to build in
this this video tutorial this beautiful selves pager we have a video we have this area here
where you can display some of the benefits of your course we got a buy button we have
info on you we’ve got it beautiful design section here for student reviews we have a
beautiful area here for frequently asked questions and then this a final call to action to sign
up for the course during the B of the Butte build beautiful sales pages for your courses
like this now if you have looked at any of the other hosted platforms that cost $100-$500
per month they don’t have anything on this they are ugly when it comes to actually signing
up for the course in your to get this all in this video here is what the sales page
looks like and also with those other platforms the place where he actually pay it looks pretty
ugly and if you will look at this you you would agree this looks very elegant and very
beautiful okay right here we have with the page where one sums are actually enrolled
in the course this is what they’re going to see now you don’t have to have this big image
I put it there and we got this course syllabus written me making this a little course in
this video I have a broken up into two sections and several videos and then right here’s a
progress bar so people can see how they are progressing in the course and then it right
here is what the lesson will look like now I usually use a video and all my lessons you
can have any type of content in your lessons so I have this I got a nice and big video
area here’s a box they can mark the video complete or right here they can go to the
next lesson or the previous lesson this year I went after elegance and simplicity and I
think I nailed it so this is what the pages can look like when someone wants to log into
your website there and have the option to login or register and there’s some really
cool features are to get like being able to issue voucher codes I love this and then this
is what the members dashboard is actually going to look like it’s gonna show them all
of their enrolled courses right here and then everything skin to be organized nice in neatly
right there this is what we are building everything were using is freeware using WordPress which
is free or using a free WordPress theme or using a free learning management system now
there are some things in this video that if you purchase this here or there it can add
a little feature here or there but none of that is actually necessary to make a beautiful
online course website and working to do that in this video I just want you to know that
I believe in you I have no doubt that you can complete this I know that you probably
have this idea in your head but you’re maybe being held back by the technology and that’s
why I made this video so I can hold your hand through the process walk you through the technology
step-by-step I’m going to help you through that so you can focus on your content and
making your course the very best it can be so Hank let’s just go ahead and get started
right so let’s go over everything that you can expect to learn in this tutorial no first
off obviously if you look at the links that this tutorial is your notice it’s kind of
a longer tutorial video now I tend to speak at a methodical easy to understand pace however
one of the nice things about YouTube is their video player allows you to increase the playback
speed so if you find that made him talking a little slow for your taste you can increase
that playback speed in fact I watch my own videos back when I have to double check it
at a faster speed I tend to like watching it at the 1.25 speed but many people watch
these videos at a 2.0 speed so essentially you can get through the video twice as fast
now the reason why the video is the length that it is is because I’m not cutting any
corners with you and I’m not taking any shortcuts my goal is not to just teach you how to make
the website I just showed you but I want to teach you how to make any website that you
want so that you will be fully equipped to be able to make the design fit your exact
needs and exactly what you want in a website and I’m not to cut any corners with you so
I hope you can appreciate that I’m taken all the time to make sure that you have everything
you need in this single video so here’s how this videos going to go down for some minute
show you how to order a domain name and choose web hosting and get that all linked up then
I show you how to install an SSL certificate and this is where some videos people cut corners
I will not cut a corner with you you have to have an SSL certificate it’s going to be
easy here and learn how to do it in this video you need that in order to accept payments
on your website and actually you just need it. These days for various reasons then I’m
in a show you how to get a logo created choose a color palette and also choose a font paren
these are to be the cornerstones of making your website yours to have your personality
in your brand and it then you’re gonna learn how to use WordPress and the page builder
that we use for this website called Elementor in the Elementor section of this video and
that’s where you’re going to have unlocked for you the true potential of creating anything
that you want with your website then want to learn how to use the LifterLMS which is
the learning management system this is what’s going to keep all your courses organized it’s
can allow you to sell your courses is going to slide a self course bundles it’s going
to allow you to facilitate having students enroll in go through your courses in an orderly
process working to go through that you’re gonna learn everything there is to learn about
LifterLMS and then if we have enough time at the end of the video you’re gonna learn
the basics of search engine optimization that’s SCO you’re going how to back up your website
and you’re also going to learn how to secure your website so let’s go ahead and jump right
on into it so it is part of the tutorial working to talk
about website hosting now even if you’re familiar with website hosting if you already have a
website or you had a website in the past I don’t want you to fast-forward through this
section because it’s going to be worth your time to listen to this part of it to the tutorial
about WordPress web hosting and because most importantly it’s the most important decision
for any website if you choose the wrong Webhost you are in for a world of hurt and that’s
why it’s so important to make the right decision with the web hosting company that you choose
and primarily you’re going to want to avoid certain companies and you basically want to
avoid E IG and Go Daddy companies EIG stands for endurance International group and they
own their a web hosting conglomerate some of the web hosting companies on the list them
out here just they to name a few that they own they are really bad web hosts and the
scary part is you actually hear a lot of people suggesting these web hosts and it’s probably
because they don’t realize it or they’re being paid a lot of money to suggest these Webhost
and it actually saddens me because I know people that go there have bad experiences
and the people that have use the services and said they had a great experience then
I asked the next question what are you monitoring the uptime are you checking the speed of your
Webhost and if you’re not monitoring up time and if you’re not checking the speed of your
website you really don’t know if your host is any good so some of these companies are
Hostgator I’m sure you’ve heard of Hostgator Bluehost and host monster and there’s a whole
list of these CIG owned companies and you really want to avoid them if at all possible
they’re known for gobbling up web hosting companies laying off the support staff and
then consolidating everything and then it all goes downhill from there and also go daddy
you you I know a lot of people get their domain names at Go Daddy and they’re fine for that
I personally prefer a different company however their web hosting is bad it is extremely extremely
bad in their servers are overloaded and what that means is they have so many customers
on a single Web server that it makes all of the websites is slower so that is what happens
with Go Daddy now if you have used either of these and you feel like you had a good
experience I’m happy for you but I would question if you are monitoring the uptime of the websites
and if you’re checking the website speed so these are just the and you know just kind
of the ones you want to avoid now one of the biggest criteria in the web hosting company
that you choose is they must support WordPress now when I say that I’m not saying that you
are allowed to use WordPress or it says WordPress someplace on their websites what I’m referring
to is if you are in a situation with your WordPress website and you need help that you
can go to their support and they’re not going to say sorry that your your deal that’s not
us you’re going to have to figure that out on your own that is what I mean by they must
support WordPress their support staff must know how to support and be willing to support
you with your WordPress-based websites you’d be surprised most hosts are not going to help
support your WordPress based website now a web hosting company is not liable for things
that you do to massively break things so for example if you set your WordPress password
to the word password and then someone hacked into your account destroys your website that’s
not going to be their responsibility that will be your responsibility but if you need
help save your having some kind of a problem with the plug-in that you installed you should
be able to go to your web hosting company and they’ll manually go in there and remove
that plug in or you’re having some kind of line of code that pops up and you don’t know
what that is or you’re having trouble installing something in you can go to them that’s what
I’m talking about is they must support WordPress and this is why I don’t recommend going with
tiny little mom-and-pop neighborhood web hosting companies and that’s because they don’t have
the support staff to be able to invest the time in giving you proper support and they
typically don’t have a proper infrastructure to keep your website secure to keep your websites
optimized and next requirement is they must offer free SSL certificates I said in the
tutorial overview your and learn how to do and install in SSL certificate on your website
and here’s the thing if your web hosting company does not provide them for free you’re probably
get a pay anywhere between 30 and $100 per year per website for an SSL certificate that’s
just you know money that you don’t have to spend if you choose the right web hosting
company so that kind of piggybacks back to avoid DIG and Go Daddy companies while those
companies yearning to be paying for SSL certificates and is going to get really expensive really
quick so it’s better to choose a web hosting company that is going to give you a free SSL
certificate because you have to have SSL certificate you just have to these days if you don’t have
an SSL certificate on your website and someone uses the Google Chrome web browser and they
visit your website it will say in the top bar you put the website address it will specifically
Satan not secure and you don’t want someone visiting your website using that browser which
is the most popular web browser and have it say not secure that’s just stuff that you
don’t need next thing I want to talk about is shared hosting versus managed hosting versus
a VPS now these are phrases that just get thrown out there and there’s a whole bunch
of other phrases cloud hosting managed hosting optimize hosting all these different phrases
now I wish there was like some standardization with it however Juergen have web hosts that
throw out all kinds of fancy phrases so sometimes it might be hard to know what your purchasing
so let me just try to sum it up in a nutshell your shared hosting is your hosting account
to be on a server with other people who have their web hosting accounts on the server and
you guys all share resources that’s why it’s called shared hosting now good Webhost don’t
pack as many customers on a single server because if they do that it’s going to affect
everyone so that your shared hosting so you are vulnerable if some other web hosting account
on the same server starts to have problems it can cause problems for other people however
a good Webhost will be monitoring everything on the server and they will stop problems
before they happen then you have this next level called managed hosting and this is a
different hosting environment that is more optimized for WordPress and sometimes they’ll
also bundle in additional services like backups staging servers things like that automatic
updates of your plug-ins and WordPress and that’s gonna be your managed web hosting it’s
gonna cost more money but for a lot of people the performance gain will probably would be
worth it and also the managed environment of making sure everything’s updated that might
be worth it as well next is a VPS which stands for virtual private server you don’t hear
it referred to is that these days you more herein referred to as a cloud hosting or something
along those lines now some web hosting providers use that cloud word the wrong way but it’s
cloud web hosting a lot of times your cloud web hosting it’s going to be completely unmanaged
you’re completely on your own you need to have a PhD in something called Lennix in order
to be able to make everything happen it’s not that it’s impossible is not that there’s
not tools out there to make it easier to manage your going to have higher performance but
if you are new to web hosts you do not want a VPS right now that will be something when
your website starts to get a ton of traffic and you need dedicated resources you need
ultrahigh performance and you have someone there to take care of it for you now I have
a special website set up called order new hosting.com and I want you to visit ordered
new hosting.com and that is where I put together a list of Webhost that meet this criteria
and are also very reputable companies and almost universally regarded as the best web
hosting companies that there are there going to provide support for WordPress users are
to provide free SSL certificates are not can overload their servers and lasts which import
which is important you can start out at the shared level of hosting you’re just getting
started out as less expensive and there’s an upgrade path you can go from shared to
manage to VPS as your needs change so here’s what order new hosting looks like I’ve got
these recommendations right here my top recommendation is InMotion hosting now what’s nice about
what I’ve set up on this page for you is I have a series of training courses now these
are paid training courses here some on various page builders here some on some of the common
things are and want to do with your website and here’s my higher end courses right here
I have a special package is where if you order from the host that I recommend and then send
me a copy of your receipt I’ll actually give you free access to these courses so that you
have all the tools that you need in order to be successful with your WordPress-based
website so with InMotion hosting you can see right here is the biggest offer you’re going
to get a page builder course in these three other courses all in all it’s worth almost
$500 I’m also recommending A2Hosting and Siteground and they’re all going to be on this page and
over time I’ll probably expand on these recommended hosts as time goes on so this page might look
a little different when you come to it so let’s take a look at these web hosting companies
in order a web hosting account the first one was working look at right now is a Siteground
so on Siteground’s website we can scroll down and you can see right here they have web hosting
and I’m a go ahead and click on where it says learn more and let’s take a look at their
plans right now so they have to replant startup grow big go geek in they all have different
prices and they all have different things included now Siteground is an excellent Webhost
it also is the only one that I recommend that has metered hosting and what metered hosting
means is it’s going to be limited to the amount of visitors per month depending on the plan
that you go with so that this plan right here for 395 per month is going to only be good
for 10,000 visits monthly so for me I would definitely need this plan right here which
is for 100,000 visits per month she would be able to come here and decide which one
would fit for you but you have to keep in mind that it’s metered web hosting that isn’t
so bad depending on how much traffic you anticipate getting on your website and that’s how they
can make sure that their service is high-performance but it is definitely something to consider
next we have A2Hosting right here and they have several different plans for you to choose
from now the higher priced plans you’re typically going to want those types of plans for e-commerce
websites or maybe a learning management website not your just basic brochure website but your
site that you’re going to expect multiple people to be on and doing different things
and staying on your website other than just reading so you can choose one of these packages
right here what is nice about the turbo package is right here it says the turbo package is
going to be faster and a lot of that is because it includes a login for WordPress that’s going
to make it run faster and then right here you can see they also have a managed web hosting
plan right here and this is going there to give you a little bit more service with your
website for you next is a web hosting company that work and actually set up in this tutorial
video and that is InMotion hosting I have lined up a 50% to 57% discount on these web
hosting plans down here and this is also the web hosting company where I’m going to be
giving you the biggest or largest bonus right here of free courses so here we are and they
have these three plans and you could see that the lowest you get this launch plan for his
295 know when you hover over the order button it reveals how much it costs and so forth
what if you only wanted to get service for one year it’s going to be $4.49 times 12 if
you wanted it for two years or three years you can just as easily do the math you would
just select the one that you wanted so the launch plan is going to be good for one website
actually here let me scroll down okay see I get some information wrong sometimes okay
so right here it says on the launch plan you can host two websites on the power plant six
websites and on the pro plan you can host on limited websites okay so these are the
three plans that you can choose from now they also do some really nice things if you have
a website someplace else though migrated for you they also have all US-based support which
is very nice they also have something very interesting so if you’re on this page and
you go to web hosting you can click reappearances WordPress hosting now this is something that
they just launched I want to see me like middle of 2017 so these are fairly new offerings
for them so this is WordPress optimize the specific hosting your WordPress-based website
is going to run faster on this WordPress optimize hosting and you can see the various plans
that they have available here these plans also are metered however it says suitable
it’s not a hard Requirement so they’re knocking to be tracking how much traffic you get and
telling you you have to upgrade and so each of these plans you could see some of the differences
they’re not what I like about InMotion hosting and all of these hosts is you can start small
and work your way up so for this video this tutorial I’m in a go ahead and start small
because I know I can work myself work my way up as soon as I start getting traction so
I can start on the launch plan and then work my way up to the power plan and then the pro
plan or just go straight for the man is WordPress hosting everybody’s different so if you’re
not price-sensitive you might want to start out with some of the manage WordPress hosting
options right here if you’re not price-sensitive but if you want to just start someplace you
can go ahead and start with the launch plan I will say if you get this Pro plan it does
come with additional resources for your web hosting account but for this tutorial working
to choose the launch plan some to go here to order now and I’m in a go ahead and choose
the three year option that’s can get me the largest discount let’s go ahead and click
on that and then it’s going to open up in the new tab and it’s gonna take me straight
to their shopping cart okay and through this checkout process there might be some options
or encouragement to upgrade to one of the other plans you can choose that if you want
or just click on no thanks so let’s go through the order process really quick so first thing
is working to choose a data center so if you are in Europe or Asia you probably want to
choose Washington and if you’re in the United States or Central or South America you might
want to choose Los Angeles honestly it doesn’t really matter as much as it would have maybe
10 years ago however if you’re really concerned about this and some people are you might want
to check out A2Hosting which is the second hose that I was talking about however you’re
going to most likely be perfectly fine with Washington or Los Angeles right here mine
is currently in the Los Angeles data center next you have the option of paying for a dedicated
IP address this isn’t so needed these days you can get it if you want if you’re going
to have a website where you want a high and paid SSL certificate that there are certain
certificates like for example you can see right now with InMotion hosting on their website
you see right where the URL is it says InMotion hosting like that that’s usually an indication
of a more premium SSL certificate that usually over $100 usually around $300 per year it’s
called an EV certificate and you would need a dedicated IP address for that so if you’re
not a bank then you probably don’t need a dedicated IP address so will leave that at
no thank you and then right here words as content management system auto installer let’s
go ahead and choose WordPress and so what this means is after you order it’s automatically
going to install WordPress for you it’s just one less step that you’re going to have to
do let’s go ahead and click on continue now is where you would either order a new domain
name or you would connect in a domain name that you already have someplace else so if
you’ve already registered a domain name someplace else like maybe a Go Daddy or another popular
one is called name cheap you would just go ahead and click right here were it says I
already own this domain and you would enter your domain name and then click on continue
what ends up happening is you order the hosting account and then there is some instructions
on how to point your domain name from wherever it is to your new web hosting account or you
can just check right here and purchase a new domain now with InMotion hosting these are
the only extensions that they support.com.net.org.biz.info .us so if you’re in the UK and you want in.edu
or you want one that’s not on this list I recommend going to name Chiba.com to register
your domain name that being said I recommend if at all possible to go with a.com domain
name I I I I know nowadays there’s.IL-1.co and all these things and I think nothing will
ever be as good is a.com domain name go ahead and enter a domain name now now after you
enter it it’s good to see if it’s available and if it is it will let you proceed if it’s
not available it will let you know that so that you can choose a different domain name
so I’ve gone ahead and enter to show the demo one I know that that’s available and the actual
domain name I’m going to use for this tutorial is to show the demo so then I want to go ahead
and click on search and it’s going to check the availability and this is when it lets
me know that it’s available and then all I have to do is click on add to cart right here
and you could see right here it added the domain name and the domain name is actually
going to be free of charge it’s normally $15 per year but it’s going to give it to you
for free but it also added domain privacy and it’s up to you whether you want domain
name privacy or not so essentially whenever you register a domain name you have to have
a valid name address and email address contact information tied to that domain name and its
public anyone can go and see that information or you can get domain privacy and it’s kind
of like your info is just unlisted and there’s this domain privacy companies information
there instead now you’re totally you not totally private I mean it’s it’s private from public
eyes however if there’s a legal situation or anything like that it is very easy and
possible to send some important documents to the domain privacy company and they will
immediately give up your information so it’s more just to protect you from the casual person
so if you do want that you can just click on continue if you don’t you can just click
on the X right here in it will remove that and take your balance down to whatever it
is now let’s click on continue and in this step because I removed the domain privacy
it’s just asking me one more time that’s okay persistence is actually a good thing I’ll
go ahead and click on continue and now it’s going to take me to the billing section and
so what you want to do is enter in your email address here so I’ve gone ahead and entered
an email address I’m in a click on continue and it will take me off to the next step okay
so this is the step where Juergen enter in all your billing information now there’s one
important part to this and that’s right here where it says referred by and it’s is optional
I’m asking you if you would enter WP now typically when you order you it will automatically know
that you came through from my websites and when you do get your receipt you can send
it to me and I’ll get you those access to those courses that I promised you however
sometimes it’s just safer to put WP in here as well that way they’ll be written information
there so they know that you came from my website you’ll just go ahead and fill this out and
scroll down now right here is the option to choose your payment method and you can put
in a credit card or a debit card now there’s one glaring thing missing and that is that
they don’t have a PayPal option so if your only way to pay for this web hosting account
is via PayPal it’s actually okay you can pick up the phone and call them or you can contact
their life support so they have live chat on the website you can say hey I want to order
new web hosting account but I can only pay through PayPal and they will set you up now
when you do it on the phone or you do it that way just let them know that they have to put
the order with WP and you’ll be fine so then once you enter all your information click
on review my order then you can complete the order and you’re going to get two emails from
InMotion hosting and let me go through those now okay so the first email you’re going to
get is your receipt and this is what it looks like I blurted out my information I hope you
don’t mind now this is what I need you to look forward to me offers at WP I need you
to forward this to me if you would like access to that bonus package of courses just go ahead
and send this off to me than what I do is I take it I verify that you did purchase it
through the link on my website and then I’ll be able to go ahead and send you access to
the courses so this is the first email that you’re going to get and then you’re going
to also get a second email here is that second email right here now I will tell you that
sometimes when you order a new web hosting accounts the web hosting provider will want
to call you before they create the account and verify that you actually did place this
order that happens and so that might happen when you order a new hosting account if not
you’re gonna get that receipt that I just showed you and you’re going to get this welcome
email right here now this welcome email has some important information in it first it’s
going to give you your login ID which is really just the email address you used when you set
up your account but then you need to click this button that says to get started set your
password here you need to click on that and what it’s going to do is it’s gonna take you
over to InMotion hosting’s website and it’s can allow you to create a password then once
you’ve created the password now you have your login and your password and you’re going to
be able to login so I’m in a go ahead and log into my account right now and here I am
logged in now don’t get rid of that email that you just got from InMotion that had the
link to create your password because when you scroll down on that email it’s can actually
have your WordPress login information okay so now that you are logged in to your web
hosting account let me just let you know if you’re using a different Webhost a lot of
times they’re going to kind of look similar and I’ll get into that in a moments you could
still follow along now first thing we want to do when we first log in as we wanted go
ahead and write off the bad turn on that SSL certificate so I need you to click on manage
free basic SSL certificate you click on this right here and then what were going to do
we just have to wait a sec which is analyzing your web hosting account to take a look at
all the domain names on it and then after a moment it’s gonna show your screens and
look like this here on the right you see it lists out the domain name I’m just gonna read
this one important bit right here it’s as if your new domain is less than four hours
old or you have not pointed your existing domains DNS to the account we can’t issue
a free certificate so just keep in mind if it’s a brand-new domain name you might need
four hours to wait before this can be issued all we need to do to turn on SSL is to click
right here it’s is off and I’m to do that and it’s going to turn on and that’s all there
is to it now an SSL certificate for free will be issued to you and you’ll be able to use
that to start using your website in a secure environment okay so let me go back to him
and to go back to bed here now that we did that in that was actually so easy it’s more
complicated with other web hosts now what I want to do show you where the main meat
and potatoes of this control panel is going to be and it’s good to be right here and it’s
gonna say cPanel now this is an industry standard thing cPanel or Control Panel so even though
this is what InMotion’s looks like you’re going to have the same thing with Siteground
the same thing with A2Hosting the same thing with most of these shared web hosting providers
they’re all using the cPanel with InMotion if you chose the managed hosting it’s the
same thing it’s going to be in this thing called cPanel now there’s a couple things
I want to do before we log into WordPress for the first time in the first thing I want
to do is modify the WordPress site so that it knows we only want to use a HTTP SVS a
cell certificate for the website some to scroll down here and click right there where it says
WordPress and it’s gonna pull this up right here now when you scroll down your you see
a list of all the WordPress installations that you have here is the one that was automatically
created when we signed up for our web hosting account if you look at the URL right there
it shows a HTTP not HTTPS and we just want to change that and it’s actually really easy
to do all we need do is click on this little edit details icon right here so let’s do that
now and then it’s gonna pull up this screen right here and the second option is URL and
we can actually change this so I can click here and put an S like this and oops not essay
you wanted to be corrected so now it’s HT’s and this is exactly what we wanted so now
we can scroll down to the bottom of this page and save our details just click on the Big
Blue button save installation details like this and now it says the installation details
were edited successfully that’s perfect so now let’s click back your word says cPanel
and networking to do two more things in cPanel first I want you to just double check now
if you’re not using emotion and you using a different hosting count you’re going to
want to do this as well I want you to scroll down to where it says PHP configuration and
click on this now with InMotion hosting they started by default which is a good thing putting
you on this thing called PHP seven now if you have an old web hosting account someplace
chances are you’re on an older PHP version and what you’re gonna want to do is change
this drop down to PHP seven and as time goes by you might want to put it at PHP 7.1 or
7.2 but it’s safe to leave and on PHP seven essentially this setting is going to make
your website run a whole heck of a lot faster however a lot of old web hosting companies
they put you on this old 5.6 version and the reason they do that is for greater compatibility
and less headaches for them if you run into a problem however that is a very old version
and if you just switch it to version 7 your websites cannot load a lot quicker okay so
now that we verified that were on PHP version 7 let’s go ahead and click on home and that’s
gonna take us to the home of the cPanel now if you’re looking for something in cPanel
you can just go ahead and enter it right here and it will pull it right up and this is pretty
universal so what we want to do now is want to create an email account that were going
to use later on the website so let’s go ahead and click on email accounts now this control
panel like I said cPanel is industry-standard if there is ever something that you wanted
to learn how to do you can do a search for for example how to create an email address
in cPanel and if you entered in that search you will find instructions on how to do it
so just know that cPanel is what you have it’s what most web hosting accounts are based
on and there’s lots of resources out there available to you so now were to go ahead and
create an email address and this is good to be an email address that working to configure
inside of WordPress so when WordPress is sending out any important emails this is the account
that it’s going to use so on my website I just use [email protected] so you can make
your this email address is whatever you want you can as many email addresses as you want
to actually some to go ahead and enter is to start filling this out okay so I’ve gone
ahead and I’m going to create the email address [email protected] I popped in a password
and here’s a quote or you can make it unlimited or leave it at that it’s not going to be really
something where I’m leaving a lot of email addresses there to go ahead and click on the
create account right here and it is going to what letter you made my email address so
here you can see a list of my email addresses and it’s just this one right here and what
we can do if we want these settings for configuring this email account in an email program or
maybe something on your smart phone or or maybe a program you might have on your computer
just click right here it’s a set up mail client like this and then we just choose which program
were going to use or what I prefers I just like to scroll down here and just grab the
settings right here in working to use these settings later on so I suggest you just make
a note of it so you already know the username it’s gonna be your email address you created
the password and then here is the incoming server in any kind of port information in
the outgoing server and the port information for that working to take this information
later working to plug this into our website so uses this email address when it sends outbound
emails now we can just scroll up and click back on to cPanel and this is really where
you’re gonna configure everything related to your web hosting account is here in cPanel
you’re mostly never to use it though you just maybe create a new email account or something
like that there’s really not a time that you’re going to do in here so now let’s log in to
WordPress for the first time now remember I said to hold onto that email that you were
sent by InMotion to create your password I want you to pull it up right now and I’m in
a pull mine up so now I’ve just scroll down a little bit and what this does is it says
right here login to the administrative dashboard and this is actually for your WordPress website
you can go ahead and click on the link that is there with his admin using your domain
and it lists your email username and password you can use your email and this auto generated
password this is your WordPress login don’t worry about your password I know it looks
crazy work minutes change that password here in a moment but this is going to be your login
information so I’m in a go ahead and open up this domain name right here and start the
login process know what you’re going to do is you’re going to copy it into your clipboard
and then you’re going to go ahead and paste it in right here now the only difference is
you see how it says HTTP will we want to change that and make it a HTTP so just go ahead and
enter and S are right there and then hit on enter and it’s going to take you straight
to the login page so now you can enter in your email address that you used to create
your hosting account and working to paste in that crazy password okay there’s minds
all just go ahead and click on log in and it will take me right on and so now I am logged
into WordPress for the first time I just wanted to just stop for a moment and congratulate
you you are doing fantastic so far you’ve accomplished so much you made a wise web hosting
decision you set up hosting the domain name and you set up an SSL certificate not something
that a lot of people have a trouble with but you’ve already gone ahead and done that and
you have installed the WordPress and you are ready for action great job
so now let’s take a deeper look at what WordPress is so that when you’re going into WordPress
want to go in a moment during to feel more confident your to feel more comfortable in
this new tool that you’re using so first of all I guess what most people describe WordPress
is is a content management system so essentially just means it’s a program that gets run on
a server in the cloud that allows you to add content to it that you can then display on
a website address is a content management system and with WordPress working to be creating
pages these are standard pages of content like a contact page of services page that’s
kind of content that stays the same and then we also can create something called posts
or better known as blog posts and this would be more information that is aligned with the
dates so for a business this could be may be news or updates or some new information
like that but WordPress is not limited to that you can also have other types of content
so in an e-commerce scenario you would have products if you’re using WordPress for a learning
management system you might have courses and lessons so even though out-of-the-box WordPress
supports pages and posts you can create any type of content in WordPress it is extremely
extremely powerful now the structure of a WordPress-based website and any website at
the very top of the webpage you have what’s called a header and at the very bottom you
have a footer in these two areas are typically identical on every single page or post or
type of content that you’re on or pager on on a particular website the header stays the
same the footer stays the same what’s in between is all the only thing that’s different from
page to page so what is the anatomy of a header you might have a logo and you might have a
menu and so in a word press we create menus and we can add a logo to the header we create
these headers and the same goes for footer of the footer that’s the bottom of your webpage
you can put all different types of information in there may be a mini contact form or a list
of popular pieces of content on your website however you want to use it next on the anatomy
of a WordPress-based website as you have a content area and that’s everything pretty
much either below the header and above the footer just kind of like a sandwich it’s kind
of the meat right there in the middle but then on some pages or post on your website
you might want to have a sidebar that might have additional information may be other links
may be another menu and that might stay the same typically for a page the entire content
area of the entire area underneath the header and above the footer is just to be for your
content edge to edge top to bottom typically on a blog post you’ll see a sidebar but you
can have the sidebar on all types of different content in WordPress now what people talk
most about with regards to WordPress or WordPress themes and WordPress plug-ins so essentially
a WordPress theme is can it kinda be the framework of how your website will look on the front
end of it so not the back and were your creating stuff but on the front and it’s going to have
all the styles and the layout and stuff like that in it that’s your theme and there’s thousands
of themes to choose from there some you want there some you definitely don’t want in the
same goes for plug-ins what that is is it’s a little thing you can add in this can add
some kind of feature functionality perfect example is by default WordPress doesn’t do
e-commerce by default WordPress doesn’t do an online course or learning management system
so what you do is you install a plug-in to add those features so for e-commerce you you
add WooCommerce for a learning management system you can add learn ’96 or LifterLMS
and there is an entire ecosystem of of companies building themes that you can buy and P in
companies of building plug-ins that you can buy if you want to create a landing page there’s
a plug in for that if you want to turn your website into a membership website there’s
a plug-in for that if you want to add online booking to your website there is a plug-in
for that and that is why WordPress is so powerful is because of this plug in system where you
can easily add new features to your website so let’s go ahead and jump into a fresh installation
or this fresh installation of WordPress that we have right here now this is fresh and untouched
and there’s a list of things I like to do when I first install WordPress but right when
you login to WordPress for the first time it takes you straight to the dashboard, to
show you something real neat here that actually a lot of experienced users and WordPress don’t
even know in the first thing is where it says screen options right here so on the dashboard
we see all these bits of information here and you might not care about any of this information
you might want to disappear well on all these different menu options here on the left that
take you to different parts of WordPress you have this screen options here to show you
real quick what options it’s given us for the dashboard when I click on screen options
it reveals this panel and I can enable or disable any of these if I don’t want to see
them again so for example this big welcome or about this at a glance so I can go right
here to where it says at a glance I can click on the checkbox bam it disappeared I want
to back I can click on that now the screen options are all throughout WordPress and it’s
one of those things that you might want to be aware of so here’s all of our menu options
and this is going to kinda tie into the presentation that I just gave I talked about a content
management system so right here is for creating those blog posts right here is for your media
if you want to upload an image or something like that it’s going to be right here it says
media and here’s where I can create a new page now also with posts you can allow people
to leave comments are called blog comments and they’re all going to be right here and
then this tab right here that’s his appearance this is where were going to be able to choose
a theme and they were going to be able to kind of start putting the pieces together
of creating a menu adding what’s called widgets widgets are if you wanted that thing I was
talking about a sidebar you had these things called widgets to the sidebar and also to
your footer and then here’s our menus customize and that’s were we to go in and customize
our theme and then we have our plug-ins which I talked about you can install of see a list
of installed plug-ins add a new plug-in right from within the interface now to use the backend
of WordPress you have a user account in working to go inherent set up our password and things
like that you can also have multiple users and there’s different types of roles that
you can assign to these users that limit what they can do when they log into WordPress next
we have some general tools you’re really knocking to be in here that much is is just for importing
data or exporting data and then we have the settings panel right here in this we are going
to go through right now we have general settings writing reading discussion media and permit
links so we actually need to go and tweak some of the settings that I like to tweak
when I first log into WordPress now what happens is when you add plug-ins to your website these
plug-ins may add menu items here so these menu items will be on every WordPress-based
websites but some of them Juergen to see additional listings here are additional menu items and
that’s because when you add a plug-in it adds a new feature in it might add a menu item
here so with the e-commerce example it will add a products menu item for the learning
management system example I will add maybe something that’s his courses or lessons or
the name of the plug-in so this is going to look at different depending on what you have
on your website now let me last explain what these red dots are so you have a red dot here
next the plug-ins and it has a one right here next to updates and then even up here in these
are indicators that there’s something on your website that needs an update and you’re going
to get three types of updates with WordPress and it’s very important that you stay on top
of your WordPress base website and make sure that these things are always up-to-date you’re
going to have WordPress itself have updates you’re going to have your theme have an update
and you’re going to have plug-ins have an update now in this case you can visually tell
we have an update it says one here it says one here but we can see right here it’s an
update to use this plug in in this are just some default things that are installed when
you first install WordPress let me show you how to do an update in the organist are cleaning
out WordPress and were going to reset the password so you can click here or here to
get to the same place it’s gonna take you to the update so I’m just gonna go ahead and
click on updates and this is gonna list all of your plug-ins or themes that need updates
so right here in a list a with there’s a WordPress update right here in the list are your plug-in
updates and right here your theme updates so I can click on this checkbox and then I
can click on update plug-ins that’s one way to do it the other way is the click into plug-ins
directly and you can see a list of all your plug-ins and this will let you know this needs
to be updated and there’s an easy button right here I can click on I just did and it’s going
to go ahead and update that plug in for me is very important to stay on top of updates
they can either add new features and functionality to your website or they can also be adding
security patches and updates to your website so it’s very important to stay up-to-date
so now let’s go through the steps I like to follow when I first install WordPress and
a first when you click on posts and pages right when you install WordPress it’s going
to have some information in there that you may not want so I don’t want this default
post I can hover over it click on trash and what that’s gonna do is it’s going to put
it in something called the trashcan and you can see right here trash has one so then I
click on trash and then I click this button here that’s his empty trash and it’s as simple
as that the same thing for pages on the click on pages it’s going to have this sample page
of the click on trash and then I’m in a click right here it says trash and then a minute
click on empty trash a click on comments but there isn’t going to be any and that’s because
comments are linked to posts there was a comment in there but since I deleted the post it also
deleted the comments the next thing I like to do is go to settings and then click on
general and this is where working to set some general settings for our website the first
thing I like to set is my site title so by default typically when you do a fresh installation
of WordPress adjusting to see my blog and this is where you want to maybe say something
about what the website is about and maybe slip in some keyword phrases that someone
might search into Google in order to find your website you might want to put that information
right there for the tagline I usually actually take that out but you can have it if you want
but what’s really important is for the email address that this is a current email address
that you’re going to receive the emails this is the email address that WordPress is going
to use to notify you of updates and and any administrative purpose next I need you to
go where it says time zone and we want to put your proper time zone in here and that’s
because of WordPress emails you and there’s a timestamp you want that timestamp to actually
makes sense because it’s your time zone so when you click on this you can set it based
off UTC or if you scroll up your to start seeing a list of city names broken up by country
so I would choose Los Angeles and here’s Alan I don’t see Los Angeles that’s because I’m
not in America the section for America so I need to just keep scrolling up until I find
Los Angeles and there is Los Angeles you only have to do this once and then I’m to scroll
down here and click on save changes the next thing I like to do in this is incredibly important
click on where it says permit links this is a very very important this is how the links
to the various pages on your website are going to look you get to choose how they’re going
to look and there is a way of doing it that everyone just needs to do and that is the
click right here where it says post name so this is what your link is going to look like
it’s going to be the name of your website and the title of whatever piece of content
this is a much better link to give out to reference to have shown in Google than something
like you know your domain name a bunch of numbers tied to a date and then a piece of
information like the title of your content so just leave that on post name scroll down
go ahead and click on save changes now let’s take a look at your user account so hover
over to users you can go straight to your account by clicking on your profile or you
can click on all users and you can see a list of users so here is the user that was automatically
created when I installed this WordPress based website so I’m in a go ahead and click on
that now I want to scroll down and show you some information right here this is where
you’re going to change your password change your email address and also change or configure
how your username will be shown on the front end so there’s different pieces of content
where it might show the author that would be like if you’re writing a blog post and
it shows the author so by default it’s set to show this and I probably don’t wanted to
show this so this is where output what I want to show this is typically what I enter Adam
at WP next to Wertz’s display name publicly asked this is where you and I want to change
it to what you just entered in and it also doesn’t hurt to put your first name and last
name in there next the scroll all the way down and then right here is where you can
change your password so what you’ll do is click on generate password now WordPress by
default wants you to be very secure in that is an insane looking password you don’t have
to use that you can enter in a different password right now and then click on update profile
so I’m going to do that because I don’t like the auto generated password I wanted to be
password that I’ll know hey word of caution do not use an easy to guess password it is
a bad idea so to go ahead and enter my password okay so I’ve gone ahead and updated my password
now some other things you can do if you wanted to change the color scheme back here I like
leaving it the way that it is so all my websites look the same but if you wanted at your website
you can go ahead and choose a different color scheme if that’s something that interested
you now your username is not something that WordPress in the user interface here lets
you change if you want to change your username you can do that there is a plug-in that allows
you to do it called username changer in this part of the tutorial you’re going to see how
to install plug-ins so that would be something you would just search for an ad if you wanted
to change your username or you can just be like me and use your email address as your
username when you’re logging in you typically don’t want certain easy to guess username
is to be user names like admin or administrator or the domain name or something like that
you want to avoid that so now let’s take a look at the themes so I’ll go to appearance
and I’ll click on themes and this shows you a list of themes now these are the three themes
that are installed by default depending on your Webhost it might not have all three let
me show you how to delete a theme you obviously only need the theme that you are using so
first let me show you how to delete a theme you can just click on where it says theme
details click on delete and essentially then click on okay essentially this is less files
that are going to be on your web hosting account so like once again click on delete confirm
and it will be gone now let me show you how to add a new theme so what you can do is click
this button here that says add new and it’s immediately going to take you over to the
WordPress theme repository but I like to just call the WordPress theme directory now these
aren’t all the only themes available for WordPress these are all free themes that you can download
directly in WordPress but you can also go and purchase WordPress themes anywhere on
the Internet and they usually give you a file now in those situations you would just click
on upload theme then choose that file and that’s how you would install your theme now
let me tell you that there are tens of thousands of WordPress themes there are a large amount
of outdated themes and there’s a lot of just crummy WordPress themes also there is this
sort up your popular latest and and favorites so I click on popular that usually will your
where you’re going to start now just because a theme is here in the popular and might be
on the top 10 or something like that that does not necessarily mean it’s a great theme
either that can mean that they have a great marketing team that’s out there spending tens
of thousands of dollars per month so that people will know about the theme and install
it it does not is just because you’re in this popular list it’s not an indicator that the
team is actually any good and if you wanted to install a theme all you would have to do
is click on what you can hover over it and click on install and then it will go ahead
and install that WordPress theme for you and now when I click back on themes you can see
I just installed this WordPress theme the same is pretty much for plug-ins if I click
on plug-ins organ to see a list of my plug-ins now these are installed by default some host
do some host don’t this is how you delete plug-ins I can click on delete and then confirm
it and now that plug-in is gone I can activate a plug and just click on activate and then
you can see the color of it’s going to change to that blue and that’s how you know this
is an activated plug-in but then if I don’t want it I can click on deactivates and then
I can click on delete and confirm and now that plug-in is gone now if I want to add
a new plug-in I can click on add new and it’s the same thing that went with themes there
are free plug-ins that are listed right here but there’s also ones outside of here that
you could purchase and then upload and the same goes what I described with themes that
just because you’re in this feature list that doesn’t mean it’s any good just because it’s
in the popular list that does not mean it’s any good typically with plug-ins you’re going
to do searches here and click right here and you’re going to do a search for your plug-ins
or categories typically you’re gonna want to get recommended plug-ins and I recommend
I have a whole series of plug-ins that I recommend for all different things that you would need
but one thing to point out is what you see right here is not necessarily the best so
the same goes with themes if I see a plug and I like I can click on install now it’s
going to download that instant that plug into my WordPress website I can click on activate
if I want I don’t want to I can click back to install plug-ins and then I can delete
that plug-in if I want to in this case I definitely do nonetheless thing I want to talk about
is most of the appearance side of your website that is going to be dependent upon your theme
is going to be in this item here called the customizer it’s a different interface in WordPress
that you’re going to be using in order to access all of the options that your theme
may give you so if I click on customize like this it’s gonna take me into this thing called
the customizer so you’re going to hear me reference the customizer often and here’s
all the styles settings that are related to your theme your colors your fonts putting
in the logo all the various options of how things look and what’s also nice is you have
these controls right here to see how your website looks on a tablet and to see how your
website looks on a mobile device and it just shrinks it like that and this is how it looks
on a tablet and back to the desktop like this this is also an alternative location where
you can create menus if you wanted to and then when you’ve made any changes you can
click on the publish button and that makes your changes now live so to get out of the
customizer you would just click on this exit right here you’re back into WordPress one
thing that’s interesting with WordPress’s there’s always more than one way to do the
same thing so you saw you could create a menu in the customizer but you can also create
a menu right here underneath the parents click on menus and here’s our interface to create
a new menu in this right here is the default menu that is created with when I installed
the WordPress user menu items here’s a list of the various menus it’s real simple you
create a menu you put your items in the menu and then you sign the menu to a location she
can assign it to the top the header area into a footer it all depends on the options that
your theme gives you you can rearrange things just like this you can stack one menu item
underneath another menu item I can see what I wanted to add if I wanted to add this homepage
I can click that click on add to menu and now I’ve added that I can reorder it it’s
really flexible this menu structure and the last important thing to take a look at is
this thing called widgets and what widgets are is when I was explaining WordPress has
these things called sidebars well this is where you would you would add content to those
sidebars and also when I said WordPress has footers this is where you can add content
to those footers you’re going to do it through these things called widgets so here are the
widget areas so we have the sidebar we have the footer and lawn in front foot or to know
these are different based upon your theme so this is your entire footer is split into
two sections for the one in foot or two and these are widgets these are all just there
by default and what you can do is you can click on any widget like this and you can
delete it if you want by clicking that and now my widget is gone I want to add a new
widget here’s my widget options right here if I wanted to add a navigation menu I can
just drag and drop that right there and then choose my menu and then click on save and
I’ve added content to the footer and the same goes for all of these widgets plug-ins will
add widget options and also themes will add additional widget options in widget locations
so just think of widgets is how you add content to other areas that the theme controls in
the header may be the sidebar or the footer it just depends on your theme so the last
thing to do is to go right here and click on visit site and working to be able to see
what this WordPress based website looks like right now this is just running the default
theme and it set up the default way just like this now I’m not a big fan of this theme so
that is basically what WordPress is it’s a content management system where you create
pages posts and other types of content you have the header the footer and menus that
your Dean controls and those usually stay the same on every page the of the content
area which changes from page to page and you have a sidebar and what dictates the style
is your WordPress theme and there’s free ones and paid ones and to add features to your
website you would add plug-ins so now is where the fun begins working to go ahead and install
a theme and working to install the plug-ins that were going to use some to go ahead and
click on appearance him to choose themes and then right here I’m in a click on add new
and then I’m going to click on my actually we don’t need to click on popular’85 Do a
search for it enter Astra AST RA and it’s going to pull it up right here don’t worry
if the thumbnail image looks different when you’re doing it it’s because they updated
from time to time to go ahead and click on install and then after that I’m in a go ahead
and click on the activate option here it is click on activates and now we have our first
theme installed and activated tough that’s actually interesting that the thumbnail already
changed that’s hilarious now we it’s a good idea to always keep a separate theme so you’ll
have another one in case your troubleshooting a problem you can always switch to it so we
don’t need three themes here to go ahead and delete this 2016 theme and I showed you how
to do that in the prior portion of this video so now that is done let’s go ahead and click
on plug-ins and we should have the list of plug-ins all deleted the default ones that
came with this let’s go ahead and click on add new now these are in no particular order
so first let’s type in Astra Sites here it is let’s go ahead and click on install now
and is just gonna take a moment to download and on this one were going to go ahead and
actually activated right now not to do that for all of the plug-ins we install Sonoma
to go to add new again and this time I’m going to put in a plug-in named really simple SSL
now what this plug-in does and you can see it’s on a ton of websites with this plug-in
does is it will make sure when someone goes to our website that they are pushed to the
SSL version of it so though go to if they enter in a HTTP and then the website this
will make sure they actually get redirected to the HTTP the secure version of your website
someone go ahead and click on install now I’m not going to activate that one just yet
now the next plug in that I want to install is named iThemes Security here it is this
is a plug and that’s going to keep your website safe from any kind of hacker that might try
to break into it is going to protect the login form it’s gonna do all kinds of great security
related things so my click on install now and this is another one were not going to
activate it just yet next were going to add up drafts and that CUP DRA FTS and this is
going to be our backup plug-in and what this does it’s so awesome when it makes a backup
you can have it send it to dropbox or someone off site location and that’s what I love about
it I use it with dropbox you get a free dropbox account and when it makes its backup it’ll
be right there in your dropbox and then you have the extra added protection if your dropbox
pushes files to your computer now you have a backup of your website and all these different
locations so I’m in a go ahead and click on install now and this is another one that were
going to go through setting up later in the tutorial okay now working to install a plug-in
named Yoast well I think it’s actually called WordPress SCO but he used to be named Yoast
and if you enter in Yoast it’ll pull right up why OAS T now this is an SCO search engine
optimization plug-in it’s really one of those essential plug-ins that have on your website
and it makes it your website fully optimized for search engine ranking obviously after
going to do a bunch of things but this allows you to actually do it work in a touch on that
towards the end of this tutorial go ahead and click on install now next were going to
put in that email sending plug-in so do a search for SMTP so when you enter in SMTP
working to go with this one right here WP email SMTP my WP form so go ahead and click
on install now for this one and now let’s go ahead and take a look at our list of installed
plug-ins and you can see everything that we’ve done so far so we have asked for starter sites
and that’s active we want that working to do the security later the backup later the
SMTP for sending emails later and will do Yoast our SCO plug-in later what I want you
do now though is click on activate for really simple SSL were to go ahead and activate this
and what this is going to do is fully enable your website to force everyone onto the SSL
certificate for encryption this is essential for any kind of e-commerce or just any kind
of website you have to be on a SSL certificate these days or like I said earlier you see
were to secure if you don’t have an SSL certificate Google’s going to say not secure in that’s
not what you want with your website so go ahead and click right here where it says go
ahead to activate SSL will give it a moment to do its thing now when you do that the next
thing you click on you’re going to have to re-login so if I click on dashboard it’s going
to make me or force me to re-login which is okay it’s only the first time you activate
that plug-in and pretty much once it’s activated on your website you’re not to touch it again
so right now why not you log back in to your website okay him to go ahead and click on
login it’s going to put me right back inside and I am all good you should see this message
that says SSL activated and that’s can let you know that you are good to go and get rid
of this message you don’t have to see it anymore by clicking on the X right here off to the
right and you are all set so now is where all the fun begins we are going to get this
site all set up so if you remember just prior in the video we installed a plug-in called
Astra Sites and of course we also installed the Astra Theme so let’s go to the options
for Astra Sites it’s gonna be found under appearance in the and you’ll see it right
here Astra Sites now just a disclaimer here from time to time Astra might change something
here or there and I’m sure you’ll still be able to find it by the time you’re watching
this video if they did happen to make any changes to anything but maybe they’ll move
in underneath Astra here I think they’ll probably stick to just Astra Sites right here though
alright so first thing is we need to choose the page builder that were going to be using
and for this tutorial and for most of the tutorials on my channel these days were using
a tool called Elementor and that’s the one I want you to select now so we selected it’s
good to show us all of these website designs that can be set up on this website with just
a few mouse clicks in just a few minutes time so here on the top happen to be three that
are ideal for creating an online course website however any of these website designs that
you see will work perfectly fine with the learning management system they’re all set
up for it now there are some of the sites that say agency) and these sites are only
available to those who have purchased the*agency package for their website so for free you
can restore any of the ones that don’t have the agency badge on it and these are the two
were looking at right here let’s just go ahead and look at some of the differences so here
is the one that you would normally pay for so many click on details and preview and you
can see it looks pretty darn amazing and it’s all fully set up now that’s a great and all
but for this tutorial video working actually choose this one now everything you’re going
to learn in this video can apply to any of them so if you’re scrolling down and you think
to yourself, I really like the style that is right here or in this one or in this one
or in this one I meant to give you an independent knowledge of the page building tool Elementor
and an independent knowledge of the learning management system and you can use what you
learn on any of these so these two are actually very similar this one has a color palette
more designed for women let’s take a look at this really quick this is not the one were
to go through but it’s pretty much the same exact design the only thing different is the
colors and you’ll see there’s a full menu and separate pages everything’s going to be
put together for us but this is the one were to choose someone click on details and preview
in the skin to pull up the website right here and it’s a full site I can click on all these
different pages now all we need to do is a first click this button here that says install
plug-ins and it’s just gonna do everything for us it’s going to install this contact
form plug-in and then it’s going to install the page builder that were going to be using
in this tutorial it’s called Elementor so now that that’s done all we have to do is
click on this button that says import this site it’s can import all of the image is and
the page templates and it’s gonna set everything up for us the menu everything someone go ahead
and click on that right now it gives us this initial warning you in really just want to
do this on a fresh WordPress installation so if you try to do this on an existing site
it may cause some problems so we don’t have that problem here someone to go ahead and
click on okay and let it do its thing okay for me that literally took less than 30 seconds
which is very very good so I might go ahead and click on the X and that’s gonna close
that and now I’m going to open up the website here in a new tab summary click on view site
and check this out you have a beautiful website already and here it is this is the homepage
right here and then we have this about page right here and then we have a e-books page
if you wanted to if you want to sell e-books on your website we have this separate page
for that right here and we have a spot here for courses and then we have this beautiful
blog section right here working me changing the style of this in a moment and then we
have this contact page with this contact form right here so before I go through showing
you how to totally change everything and have full control over all the aspects of this
site I want to first spend a little bit of time on teaching you how to create or get
a logo created choose a color palette and then also choose a font pair and with those
we will take that and we will start customizing this website right so first were going to
figure out what colors that you want for your website now typically you’re gonna want to
or three colors so your first color you’re going to want identify is going to be your
primary color and this is the color that’s going to be predominantly used on your website
and this would probably be used maybe 60% of the time or 70% of the time on your website
and the second color is going to be your accent color so sometimes you might want the the
color of a headline to be a different color and so this could be your accent color and
there’s various times you might want to use an accent color and it would be just different
than your primary color and then as an option you could also choose 1/3 color which I like
to call your pop color and this would be the color that is going to be different than your
primary and your accent and it’s good to be a color that would would attract someone’s
eyes to and you would probably use this on where you want their eyes to go so typically
like a button right so you would make your button this color because you want people’s
eyes to gravitate over to that button so they know where they need to go next so here is
a website called colors and that spelled COO L ORS.co and you can go here and they’ve got
a lot of great color pallets so if I click on explore it will show you a variety of color
pallets now the way colors are interpreted in WordPress or pretty much anything that
is design oriented is with the hex code so every single color has a unique hex code and
this is the code you would copy in your in a pasted in certain locations in WordPress
and that’s how it’s gonna know the exact color that you want to use is it with these of various
hex codes while look at this like every color seems I have that that yellow on it that’s
interesting look at that I wonder what’s going on there so for example I can go ahead and
click on save this color palette right here and I would go ahead I would click on view
and you would see the colors right now, go ahead and click on okay this is new let me
get rid of that okay here we go so here is the colors in that color palette you see how
you have this #and then in these six characters that is going to be your hex code and it’s
can be numbers and letters and so if I use this code right here in WordPress in certain
locations it’s going to show this exact color and so what we need to do is get these various
hex codes actually like this color combination this right here with this but if you use this
color as your primary color this as maybe your accent color and then this is your pop
color and be really interesting color palette so what you would do then is you just copy
these hex codes into your clipboard and will be using those momentarily now there are more
websites than just colors in order to find color pallets you can go to Google and do
a search for color pallets and you can definitely see the many different websites for that another
tool that I use I’m using Google Chrome and I recommend using Google Chrome if you’re
doing any kind of website stuff because there’s a couple needed tools and in the first one
I want to introduce you to is a right here it is called color Zillah now if you go to
Google and do a search for color Zillah the first result will be this right here and what
chrome does is it allows you to add these things called extensions that allows your
browser to do more stuff so you would go ahead and click the button right here and it will
add this to your web browser and this is what you’ll see it’s right here it’s kinda hard
to to maybe see if I hover over to Cisco or zealous when I click on it and it allows me
to identify any color on a particular page so for example let me go back to that color
palette right here so obviously I know the color pallets are but say you’re on a website
you really like a particular color or shade of a color and you thought maybe I want to
use a very similar color so you would take color Zillah you would click right there choose
pick color from page and now you have this black box that showed up and you can the hover
over different colors on that page and you’ll see in that black box it will identify what
the hex code is and so all you’d have to do so say like this little blue right here I
can hover over it there I have the blue if I click on my mouse now it copies the hex
code in to the clipboard of your computer and you can paste that into a notepad so this
is how you can go to a website that you like and you might like the color scheme that they’ve
chosen and you can use a similar color scheme or test out a similar color scheme so I want
you to go ahead and pick out a primary color and an accent color and gives in consideration
of the pop color that you may want to use now since you’re new to web building you might
want to just stick with the default colors that we restored you might want to just use
black or something like that and then later on is your thinking about doing more with
your website then you can start playing around with these of various colors but it’s the
process of choosing different colors is what will really make your website unique to you
and your brand next we need to look for fonts and so here’s a great website I like it’s
called font peridot CO I love this site so essentially with your WordPress-based website
you’re going to be able to customize the fonts now the way this works is you’ll typically
have a two or three it’s kind of similar to the colors right you’re typically in 1/2 two
or three different fonts so you can have one font that will usually be for your headline
and you might also want use that same font for your menu and then you’re going to have
a body font so that’s the body of the website you can have a different font for that you
have the same font to the same font family that’s fine but you typically have the the
opportunity to have two different fonts there and then sometimes you might want I actually
don’t have it I’m going to cool phrase for it yet but that said third Fontan lead times
when you’re on a website and you see a certain section of it where it might be cursive or
something that would be a starkly different font and I can be your third font I guess
I I coined the term pop color maybe that’s your pop font has well so what I like about
this website is it shows you all these different font combinations that work well together
that are immediately to be available in your WordPress site and it’s just a matter of choosing
it from a drop down so when I scroll down this is what each one will typically say don’t
say the name of one font and the name of another font so the headline here is cabin and the
body text right here is old standard TT so you’ll just want to find a font combo that
you like and then remember the name or maybe write it down in a notepad because will be
configuring WordPress with that so here’s another fun combo and you can just scroll
down this is a really classic one Joseph and Sands that’s the headline now you don’t have
to go with how they are pairing it you can feel like one headline in one body font that
aren’t necessarily paired here that’s fine this just gives you an opportunity to see
what they look like Montserrat this used to be very popular but it’s lost its popularity
right now it’s really popular it will Meriwether is a very popular and that’s for the text
right here that actually looks good I might change my font my website to that another
very popular one is this Playfair display let me show you if I can find that here as
a headline let’s see I’m just scrolling down so you get the point you can come here and
see what you like and the different things with the different fonts how they look together
I’m not seeing Playfair maybe if I just did a search on the page but you get the point
want to come to a site like this and go ahead and pick out a pair of fonts that you really
like now let me show you another way of identifying fonts that you like and that is that it’s
similar with the colors there is another Google Chrome extension called what font ice to say
what the font I don’t know why I was say that but it’s just called what font and you can
go to Google and search for what font and it will take you here and you can add this
to chrome and it adds this little font option right here so if I go back to this page I
can click on that and what it does is now when I move my mouse cursor over any font
it tells me what it is so it says right here this is Montserrat and when you click on it
it shows you the name of the font if it’s bolder normal and then it’s going to tell
you the size I don’t know why it’s not showing me the size right there so let’s scroll down
this one showing the size so I can click right here and I can see it’s the average font that’s
the name of the font and I can see the size and this is helpful when you’re on the various
websites and you think man I really like that font or that font combination or you can use
this web browser extension what font and Cohen NC with the names of these fonts are so that
you can test them out on your website so you definitely gonna want to choose a font I think
choosing a color combination and a fun combination that’s unique to you and your brand are the
two biggest things you can do to really make your website your own and really make it stand
out so your assignment right now so go pick out some colors into go pick out some fun
pears now the best thing is none of these are set in stone so when you’re setting them
up on your website if you change your mind later it’s going to be super easy to change
later as well I know for me I’m in the process of changing some of the fonts on my websites
but it’s pretty fun and it’s very powerful to be able to very easily change these fonts
and I’ll be showing you that here in a moment okay now it’s time to talk about getting a
logo for your website now a logo is not a requirement but it’s certainly something that
is going to make your website and your brand more memorable now I went to Google and I
did a search for free logo and I spent some time going through some of these websites
and actually a lot of them are really bad there either not really free or their very
low quality now I did find one that is interesting and I do want to talk about it in its canvas.com
you probably already heard of camber some go ahead and open this in a new tab in but
before I go into cans I’m going to go ahead and show you some paid options for getting
a logo now one of the places that a lot of people go to I actually don’t like the service
personally but I do know a lot of people that have have gone there for logo designs is 99
designs in the way this works is you’re not hiring a designer to design your logo directly
you’re actually starting something called a logo design competition where you say here’s
the requirements of my logo arms clicking on pricing right now here’s their requirements
of my logo and if you are interested in making this logo go ahead and make a design submit
your design and out of everyone that comes up with the design I’m gonna choose a winner
and I’m gonna pay that winter 299 for this plan for 99 for this plan so essentially the
higher you guarantee you’re going to pay the more people that are going to be interested
in taking a risk of their time in coming up with the design and submitting it and you
work back and forth with them to get it perfect for you so they essentially have these three
packages here you have the 299 and they’re saying you can expect to get 30 designs and
each planet goes back like that they do have this money back guarantee I would read up
on it before if you’re interested in this I don’t really think it’s quite so simple
to get your money back from one of the services I haven’t personally used 99 designs and I’ve
seen people get seen plenty people had come up some really does this lousy web designs
using 99 designs but it’s so worth a shot that interests you another marketplace for
design work is a fiver now fiber is also very risky there’s things you could do to minimize
your risk essentially if you’re not familiar with fiber it started out as a website where
people could say I will do this for five dollars now it’s grown way past that since then for
sure and it’s a marketplace for now people can charge what they want to charge even though
it still called the fiber so when you go to fiber and that’s with two ours F IV ERM and
a link to it in the video description box into a search here for logo design think I
scroll down the it should give me an option up here it is a logo design so or you could
just search for logo design actually like this they recently added this where you can
thinking try to find the right designers that you might be interested in so it’s kind of
reduced logo design into three different choices so first you would choose one of these so
if you wanted a cut of a flat design you’d click on here then you choose what you want
to pay or what your budget is the 5 to 25 to 3200 or greater and so this is going to
this is going to filter out the designers that don’t offer design work in that price
range and you can start seeing some of the designers here so let’s choose the $3200 and
then the last one is the speed at which you wanted so if you need it fast in up to three
days go ahead and click on here and so it’s gonna show you all these logo designers that
are in meeting these requirements that you just set up so you can click on any one of
these I’ll just go ahead and click on this one I’m not endorsing this person I’ve never
seen it before I’m given the pop up to join I don’t want to join let me get away okay
there you go so typically right here the logo designers can show you some of their work
now you have to be careful when you’re looking at someone’s work because there’s no proof
that it’s someone’s work right they could be putting any logos here and you wouldn’t
even know now once you start getting here you see how this pop-up came it’s like someone’s
review and how long off how long ago it was reviewed six days ago this is when you actually
get to see their real work so if I scrolled across and I saw what they’re actually creating
for people then you can decide if this is a designer that you want so far I’m not really
impressed with this designer now let’s scroll down so typically all of these fiber sellers
are going to have multiple packages and they tell you what you get in each package and
each package is going to have a different price and all have a break down a lot of times
it involves the source file you’re gonna want this thing called the source file and so with
most designers the first and cheapest package will not get you that source file but the
middle or the most expensive package will typically the difference between the middle
and the most expensive package people are typically going to have this social media
kit which I don’t think is really that necessary these days and especially a stationary design
that’s not really that necessary here’s another big differentiator in people’s different packages
is how many design concepts give you 12 and four and here is the delivery time you want
to pay attention to that and what you want to do is you want to go with a designer that
is going to say something like this hundred percent satisfaction guarantee so essentially
what there that means is one of two things either one they’re going to stick with you
in with all the back-and-forth communication in order to make sure they make the design
for you that you want or it could mean that if you’re just not happy though go ahead and
kick you out a refund so I do like it when people have some kind of a satisfaction guarantee
that they’ll offer you a refund if they are not who they say they are now here is the
biggest problem that I have experienced with fiver yet you can get some some designs kicked
out but what these people are not is there not like branding people so they’re not sitting
there because they’re just grinding through these designs right there not sitting there
thinking okay let me get an understanding of the brand let me get an understanding of
the business let me get an understanding of who they are and what they are doing this
is something that that you don’t usually get in one of these fiber gigs are just taking
a word in the name or word and what you say the description of the business is in there
just trying to crank out a design as fast as possible that’s not to say you can get
some really nice design work done on fiber I’m just saying that that has been my personal
experience and lastly for designer you can see right here how many orders they have in
their cubes so this designer right here has 17 orders ahead of you so this just gives
you an idea of their workload and how long you can expect to wait for your work to be
done but for me I’ll tell you you can probably get some good results just make sure you know
the package you’re getting and go with people that have good ratings a lot of ratings have
recent work that you kind of like their design style people that will stand by their work
and offer you a refund if you’re not happy and also communication is pretty important
as well you want someone that will understand you and understand your business so that is
fiver let me go back to canvas now Kent is a web based service for making different graphics
and designs and I was actually surprised when I went to canvas and I saw that they also
have logos there and I thought well it’s been a great way to get an inexpensive logo now
there’s pros and cons with it so for free you can use any of these logo designs let
me see if I can scroll down if this is the page that actually had him so look at some
of these logo designs and use these as a starting point and I’m like man this a lot of these
are nicer than what is just saw on fiber right timing these are great news would be kind
of like starting points and they’ve got a lot of them these are just a few of them they’ve
got tons and tons of these logos that are starting points the only thing is it when
you want to export that logo if you’re not on a paid can for plan you don’t get the high
resolution logo that you may want and you also more importantly don’t get a transparent
version they want you to get this thing called Canon of a pro which actually is kind of worth
it it’s I think like 10 bucks per month let me see if there’s a link down here for X I’m
not seeing it I think it’s $10 per month and they will let you have the first month of
for free so technically you can go in and start designing the logo if you like it and
then maybe sign up for the Pro and then you can cancel it before you have to pay for it
that’s a thought so let me just log in here with my account it’s free to create an account
let me log in with my account and go ahead and show you this logo thing okay so I’m logged
into my account you can see I was already playing around with some of these logos here
so when I first login I see this year it’s is created design and these are the different
things that you can design and I’m a go ahead and click on the logo right here and it’s
can open me up in a new tab just doing this to show you some of the designs so you can
see right off the bat that some of these designs here there are actually very nice I mean you
can get something that works just perfectly for what you’re trying to do and it’s very
inexpensive it’s free or if you wanted that transparent version you can go ahead and pay
your sign-up will soothe the cost is here in a moment so I’m in a scroll down and let’s
just choose is something real quick you can also do a search so I’m just going to do a
scroll like this and see what I can see to see something that fits the space now it’s
also important to note with logos if it’s going to be a wide logo you you typically
don’t want really tall logos you want a more wide logo something like this right here it’s
can usually fit better in a website header then something really tall like this let’s
add another thing you definitely want to keep an eye out for alright so so far I haven’t
seen something I like Texas right here is pretty cool we probably would want to change
that image right there this is actually really cool right here as well I like the topography
this is nice it’s the go ahead and choose one here and get started with it so okay,
choose a basic one and it’s this one right here I go ahead and click on it and then what
it does is it places it right in here and then you can literally change this to whatever
you wanted so I can click right here on the letter let me highlight it and change it to
his see their ego and then right here I can highlight this and type crafter just like
that so if I want him to do that I could and then for this I can go click on it and then
off to the right I can kinda tighten that in a little bit or let’s see maybe I need
to just move it over there you go it’s moved and then I can change this text to whatever
tagline I may want and then for the color I think I can just go ahead and click this
box and you can see here’s the color and if I click on that I can choose a different color
and then that’s kind of like my green and you can see I almost already have a really
nice looking the logo here so probably one of things I should do is come out with some
kind of a longer tutorial video on using canvas up now we have this design you can see how
quick it was to make them get rid of this Realty group I’m in a highlighted and let’s
see Dominic click on it and then here’s a little trashcan on the top right and there
ago I got a nice looking logo I’m happy with it so now what you would do is you go ahead
and click on download and when you change this is the option you want this transparent
background and you you can get it and this is what I was saying that you need the paid
version in order to get that some to go ahead and click on this and learn more and see okay
so here it is it says right here you would need to sign up for the Pro version of Campo
but look at this you get a 30 day free trial so you could literally come in here make a
beautiful logo and then you know decide to keep it or not keep it you don’t end up paying
anything summit click on that okay so here you go this is the pricing that I wanted to
see so I guess you need a credit card but you’ll have to remember to cancel it but I
bet you don’t have to call you can cancel it in the web-based interface she could literally
go here sign up for the monthly 1295 and then Meno cancel it if you don’t see yourself continuing
using it you could still have your logo with the transparent background and it even says
right here that they will remind you three days before your trial ends so this is something
to think about if you want logo and you definitely need a transparent background for it would
be to go here some skin to go ahead and download it right now it pops this up but there are
so many beautiful logo templates in here I think the logos templates and here are better
than the actual logos that we saw moment ago on fiber and what it does is all your designs
it saves them all and you can at any time go and change them or reuse them or do whatever
you want okay it downloaded I’m closing this but you can do this just be fun and I like
looking in your just for logo inspiration I mean you can get excellent logo for a restaurant
for any kind of a local business for religious organization and you can come in here and
they probably got a template that’s almost a perfect starting point for just about anything
I mean these are really nice designs and they’ve really nailed it and so that’s why when I
went here and I searched for free logo and I came across can file which I’ve used before
I was really impressed that they do logos now on probably most people are unaware of
that so anyways take some time and figure out what you can do with the logo whether
you have a designer you already have a logo where they’re going to go the inexpensive
route and use canvas or just hire someone on five or you definitely gonna want to go
ahead and have a logo created and a lot of times the color scheme that you your designer
comes up within the logo would be the colors you use on your website or vice versa if you’re
using canvas on your own and you have already choosing some colors for your color palette
you might want to use those in your logo so this is all I have for you on creating a logo
okay so now were at the part of the tutorial where we are going to start customizing the
theme and remember the theme controls your header and your menus in your footer and those
little widget deals there in the footer and that controls some of your font styles in
your overall colors and that’s also where working to put our logo in so much as go ahead
and jump on into this so with pretty much any WordPress theme all these settings are
to go into something called the customizer and there’s lots of different ways to get
into the customizer the most traditional way is just to go underneath the parents and then
choose customize but if you’re already on the front end of your website this right here
is your admin bar many times on a page and they’ll be a customize option right there
so you can get to it that way as well some and go to appearance and then customize it’s
going to just open up in a new frame where we have your website on the rights and we
have a series of said setting panels here on the left now this is one of the things
I like the most about the Astra Theme is they’ve organize all these various options in a very
logical easy to navigate way first let’s take a look at site identity and this is where
you put your logo and so there’s two different formats for your logo there is the normal
size and then there’s double size and double sizes known as the retina version of your
logo so essentially what that means is people that are using high resolution monitors or
mobile devices it’s going to use this higher resolution version of your logo certainly
want to format your and what the normal size and then you want one that’s double the size
and you’re gonna put it right here now you don’t have to worry if your logo size is a
little too large because there is this option right here where you can control the width
of your logo and you can also change this based upon whether someone’s viewing your
website on a desktop or a mobile device so with this we can just start going like here
you can see what’s gonna happen is the logo starting to get smaller and this is how you’re
going to control or be able to set the size of your logo after you’ve already uploaded
it if it’s too big a lot of times what I’ve noticed is people tend to upload logos that
are too large and this is a real simple easy way to make sure it looks exactly how you
wanted on your website so actually, like it a little tighter like that so right here’s
a reset so I can click on that and it’s good to show me how it looks normally but we can
tighten that up a little bit I think I like that may be at just a little tighter maybe
a 200 like that you can also just go here and enter the number or move this up or down,
like it a little tighter like that but it’s totally up to you how you set yours up so
to actually put your logo and you go ahead and click on remove and then right here you
click on select logo and then you just drag and drop your logo right on in there so I
just drag and drop this C logo that I use on my website know when you get to this spot
right here you’re gonna want to click on the skip cropping so by default WordPress wants
you to change the size it’s just some old feature of WordPress that means they go away
working to click on skip cropping and then bam there is my logo now remember I just showed
you how you have control over the width and this is a perfect example of using that feature
like here see there we go it’s a lot tighter like that you see how perfect that looks now
because you have this easy control now what is really needs about the Astra Theme is if
you don’t have your logo like this with the image and then your text that’s okay Astor
has you covered because right here I can check on this box and I can have it show my site
title in fact I can make the site title look however I wanted to look now you could say
that doesn’t look right I don’t really want my site title underneath the logo will that’s
when you would check right here it says in-line logo site title watch what happens when I
check this box I go like that and there it is now the text is off to the right of your
logo and it’s as simple as that and in the font settings you’ll be able to change that
some as well to get that to look how you would want to look and also if you wanted to have
one of those there called Favor cons was those little icons that your web browser will pull
so if someone has your website and a bunch of websites open in different tabs a little
little icon deal you can set that right here you just click on select ImageShack I can
choose the same image if I wanted to click on select and do a skip cropping and now my
favorite condensate and is showing you how this will look in someone’s web browser someone
to go ahead and remove it and let’s go ahead and reset that logo right here so I’m going
to undo what I did just like that I’m going to remove amended to change set logo right
here and scroll down to where that logo was and I believe it’s right here actually looks
like this is it right there okay click on select logo do a skip crop and we are going
to be back to how it was let me go like this and we are back to where we were and that’s
how easy just to make this logo look exactly how you wanted to look and also get that Favor
con in there is manifest let me let me put that Favor come in there that little blue
circle bit and it’s right here that’s can be perfect, to do a skip crop didn’t even
bother me and there it is see how good it looks right there so it’s can look very professional
alright so let’s go ahead and click on the back and so that your site identity next were
to look at the layout options now there’s gonna be layout options for the container
were actually gonna tweak that setting later in the video let’s look at some of the settings
options for the container up here the header area so when I click on that we by default
have these three different header options so this is your traditional one with the logo
on the left in your menu on the right but if you wanted it where the logo was on the
top of the menu was underneath that you could do that as well it was just one mouse click
if you live in a country where you traditionally have your website from right to left wall
here is right to left the logos on the right and you have the menu there on the Left some
to go back to this format your traditional format just like that now we also have some
options of what to put off to the right of this menu insist custom menu item so we can
click here and select on search and watch what happens there’s can be a new little search
option right here the soul icons covering it but it’s right there and you can also put
a bit of text if you want or a widget and will look at some of those options more later
on my website I have the search enabled I like that a lot right now me to go ahead and
choose none and down here is the option for on a mobile device to have a label for the
menu so if I click on this icon right here it’s gonna show me how the website looks on
a mobile device and it has this hamburger icon right here I can go ahead and enter a
label right here if I wanted and I can also change how the header looks on a mobile device
so this is the default it’s called in-line and here is the other option which is stack
and that’s just gonna put the menu icon underneath the logo on a mobile device someone go back
to in-line enema click on this desktop here to get back to the desktop view this right
here is just the tablet view all right in that is our header options right there in
order to set these blog options later in the video now we also have’s the footer options
right here so when I scroll all the way down you see this website is not using a footer
this right here is referred to as the footer bar and then there is a footer area we could
add here we can put different columns and different things in it so I clicked on footer
widgets you can see right now we have a disabled if you wanted it you can click right here
and now you have these different widget areas here and you can put menus and there you could
put a contact form and there you can put a links to certain pages that you would go to
a lot or you’d want to make sure all your visitors are aware of some go back to disable
I just wanted you to know that that was there as an option for you lastly we have the footer
bar here at the bottom and this is where you going to change the copyright credit so right
now it said to say copyright is said to show the current year and the site title that’s
all commences my blog so you can go ahead and you can set that to something specific
if you wanted or just leave it pulling in the site title and then here’s an option to
show some credits right here if you wanted to we can actually just go ahead like that
and take that out and it’s just going to say copyright my blog now here off to the right
it’s showing custom text as well but we can go ahead and choose a menu if we wanted this
is a good location to have some disclosures and various things like that so I know on
my website that’s how I use this footer area I have a copyright on the left and then I
have a menu here on the right and you can just choose footer menu and then choose the
menu that you want we accept this sign a menu to this location and it will show it all right
there some the switch this back to custom text like that and we are going to move on
but that somewhere you deftly want to put a footer menu with some disclosures on your
website okay so that’s can it be our layout options right here the next thing is colors
and background let me go ahead and scroll on up to the top first a sick a look at base
colors so if you notice in this website right here it’s predominantly using this in blue
and this what you can easily change the color by clicking on select color and just pasting
in your hex code remember when we just prior talked about using the color palette and we
talked about hex codes will this is where you could pop your hex code in to fully and
completely change the color and the feel of this website now what I like about the Astra
Theme is what you put here carries over into all aspects of your website so these are automatically
in a pool on in and get pushed into your learning management system as well so I can go ahead
and fully change everything by just maybe going like that letting go obviously this
isn’t the color palette I would choose and you can see the colors change up here in the
menu and probably in the footer we have some things changing as well so this is the primary
color right here let me go back to the default one and also you can set your text color right
here in your link hover color and your background color direction to change that background
color when were setting up the learning management system okay and then we can also change the
colors of the footer bar so we can change our text color there in our link color there
and all of that that’s this area right here if you wanted to change that so these are
the color options that we have topography options and these are in BR fonts and we covered
selecting a font pair so we can click on base topography and right here you can set the
font family to whatever you want based upon the options that you chose in the choosing
a font bear and right here you can also choose the overall font the size you can increase
it or decrease it it’s completely up to you now write down here’s where you’re gonna put
your heading font in so that your font pair writes the body content and then your headings
in this is where you put your heading font right here and then the font weight which
is the thickness and that’s how you’re in a load in your topography and that’s what
I like about aster again the simplicity you just put your body font you put your headline
font and Astro will take care of the rest for you okay let’s look at some content options
right here in these are to be the sizes of the headings so this is a heading right here
and you can choose the size that you want to know whenever you see an option in the
customizer that has this little icon that means there’s gonna be a separate setting
option based upon the mobile devices so when you click it you can choose to have a different
size of for your heading so this make sure that your website looks beautiful on every
single device and so that’s gonna be the fonts for your headings then here are some funds
for blog posts and it’s the sizes as well and also this is that these are for your post
and page titles and you have full control over this as well so you get plenty of font
options but the options are very simple and easy to plug in and put together this is really
cool this is buttons and so you have this overall button styling so you’d also want
to put your primary colors in here or whatever colors that you wanted for your buttons and
your hover color so you pretty much with every button you always have four colors so you
have the normal color of the text and then when you’re hovering over that color of text
and then you have your background color and when you are not hovered over and then the
hover background color this is really neat right here you can add a rounded corners to
your buttons and these are really going to come into play when we are looking at the
learning management system in a moment tweaking this out but I usually like to set the radius
of my buttons to a five it kinda rounds out the corners a little bit we might touch this
a moment when we are looking at the learning management system okay so that your buttons
right here and then in the customizer this is where you set up your menus so this is
automatically created for us as a main menu so when I click on it right here you can see
all of our menu items if you want to add a new menu item you could click right here just
like this and add a new menu item for maybe a page or post that you may have created and
let me uncheck that any can also easily rearrange items so I wanted courses to be this second
item watch what happens when I let go it automatically moved on the front end of the site it’s that
easy and then if I wanted to say move one item underneath another like this I can just
do that and watch see what happens e-books is now under courses and is perfectly styled
with this nice arrow right there and everything just looks perfect that’s not what I want
though some to go ahead and put that back and I want to put that back but you see how
easy it is to work with WordPress and to create these menus there’s nothing to be afraid of
now here as well is where you can set that footer menu so you’d most likely want to create
a new menu and then assign it to the footer if you wanted a footer menu down here for
disclosures and different pages like that’s what I usually do is I set up all my disclosure
pages my terms of service page all the various disclosures any FTC disclosures all of it
and I also like to put a link to a site map all down here in the footer so you go ahead
and create a footer menu and assign it just like that and then we have widgets this is
going to be more for the sidebar will probably look at this actually here let me show you
what that is right now so if I go to the blog this right here are your sidebar widgets so
if I click on widgets and then I click on main sidebar these are what is right here
so if I wanted to get rid of something I could just go like this and click on remove and
it just disappeared although there’s a better way to work with widgets that I’ll show you
later on when we are setting up the learning management system okay so let me go back just
like that and then right here’s where you tell WordPress which pages your homepage that
you created which pages can be your list of blog posts and then lastly is additional CSS
this is where you put little snippets of code were in need to put that in in a moment but
this is where you put these little snippets of code that are going to modify the way your
website looks or do various things like that and I definitely have some in this video tutorial
or the learning management system so once you’re done with everything I have to do is
click on that publish button and all of your changes will go live I’m not going to do that
let me get out of here and I’m a click on okay it’s gonna kick me out of the customizer
now I was telling you about there’s a better place for widgets what we have that right
here and when you click on it we have our various widget areas that once I installed
the learning management system Adobe additional widget areas that appear that were going to
go through and here’s also an alternative way to get to menus as well to set up menus
and also to assign a menu to the footer location so that’s all there is really to customizing
the Astra Theme you saw it’s very easy to go in there and set your logo in your colors
in your topography and your menus and it’s really easy to work with WordPress menus and
control the exact order of all the links in your menus on the front end of your website
so these are all the options that come with the free version of Astra you can see it’s
very powerful for a theme that is being offered for free it is extremely simple to use now
they also have a professional version that working to take a look at right now so now
let’s take a quick look at the Astor Pro option and what it can do for you with your learning
management website so to get to the Astor website visit WPCrafter.com/Astra now that
links actually to take you over to my website and I’m going to tell you some free training
courses that you would normally have to pay for but if you did want to purchase the Astra
Theme I’m in a give those to you as a bonus you get all that [email protected]/Astra
and so here is their website so I’m go to a specific spot on their website that talks
about the LifterLMS the learning management system integration and then will look at all
the other various features of the Astra Theme okay so here is some in their document so
they actually have really good documentation for the websites underneath support in the
documentation and here’s the documentation for the paid version of Asher and what it’s
going to do for the learning management some to scroll down here and just it’s a good reference
to go through all of the main features so the first thing it’s going to do right here
is give you options with your grid so if you are good have more than one course by default
it’s going to show these three courses in a row but you’ll get options right here to
control it so you can also’s control how it’s going to look on a mobile device and you can
do the same thing for memberships if you’re going to have those you see how this now has
four columns so by default it’s gonna be three but you can have control with Astra sites
any feature is not the big thing though yet so let’s keep scrolling down here’s one very
big thing I think in this is distraction free check out so what this does is it creates
a different checkout experience that removes and eliminates distractions so people can
just stay focused on checking out and this is essentially eliminating and removing any
kind of menu options or footer options and just showing you the check out and the checkout
only okay now here’s a really cool one and I use this on my website you get this option
to have for the membership dashboard to have your options displayed vertically instead
of horizontally so in this letter in this tutorial were going to create the members
dashboard and it’s going to be vertically I’m sorry it’s going to be horizontal another
nice thing is it allows you to have these icons but I think that’s actually in the free
version the icons is just this gives you this cleaner interface of having everything vertical
like this okay now here is this is can make more sense for going through the LifterLMS
portion of this tutorial but it’s good to give you visibility options for everything
so when you set up your wool courses in your lessons there’s all these different data pieces
in there and this gives you easy checkboxes to have certain pieces that you don’t want
visible to be disappeared and you can set things for the student view or the visitor
view a good example of this is when you go on my website and you look at the course page
it it’s hiding certain things unless you’re enrolled in the course and some of those things
it’s hiding is the course syllabus that’s a list of all of the lessons in the course
there’s no reason for someone to be able to see that unless or actually enrolled in the
course and so that’s one of the things that this plug-in will allow you to do and that’s
one practical example of how you use it and hear some more more options as well right
here so as I scroll down she is showing you more of those different data points as I scroll
down here that it gives you the options to just one click and it would be disappearing
okay so here is where it gets kind of fun remember a moment ago where I showed you the
header options and I showed you the three different header styles and I said there’s
that area off to the right where I usually have the search icon well when you have pastor
Pro you can choose to show the avatar image of the student that is actually logged into
your site really like this feature really gives it that custom Pro field to me to have
someone’s avatar actually show there I really like that a lot now as I scroll down here
is another feature right here at consistent really showing it right here okay so this
right here is called distraction free learning so what this means is we you can set it so
when someone’s in the learning experience meaning there inside of your lessons that
it makes a distraction free as well it will hide that menu for you so all the person seizes
the lesson content and then their avatar image in the top right and when they click on that
little avatar image you will just take them back to the members dashboard where he went
through the button settings this is in the free version so this isn’t specific to the
paid version so those are some of the specific features that come with aster Pro that are
just specific to the learning management system but there’s a whole lot more that comes with
the professional version of Astra so let’s first take a look at the price here so were
in this tutorial video were been using the free version at the end of the video up with
the Pro version on the show you the difference of how it looks and here is how much Astra
Pro cost such as $59 and you can have that now if you wanted those different templates
that I showed you member I showed you a different one that would be in the agency bundle right
here okay and it’s this is gonna come with a ton of features on the click on see all
features is going to scroll me down so here are the features that come with the Pro version
and the best thing about the Pro version is just you are supporting the developer they
have poured so much into the free version of this theme and they’re fine and they’re
happy if you could use that to make something awesome for yourself however when you go ahead
and purchase the theme it’s showing support financial support to the developers so they
can use that in those resources to make it even better and it also get you paid support
and also get you all of these great things so I’m just gonna run through a really quick
to get transparent headers you get sticky headers that’s where the header sticks when
someone scrolls down the page I actually don’t like sticky headers and I don’t use the key
headers but a lot of people like sticky headers and that’s fine okay page headers this is
actually a really neat feature I think I might demonstrate this towards the end of the video
this feature right here but allows you to take the title of the page and show it in
a really nice elegant way underneath the header where the menu is and all that more color
control so you saw the color controls just a moment ago but you get more color options
with the paid version of Astra you get more topography options custom layouts is an amazing
amazing at all and I need to make a specific video on this I’m not going to have time to
touch on it in this video but it allows you to do some really neat things with your website
essentially there’s all these little spots on your website where you can just kind of
inject things that you create a perfect example you go to website and then they have their
header in the very top there is a banner and it says we have a sale going on and there’s
a countdown timer you can do that kind of stuff with this custom layout you can do so
much more that’s just one example of what you can do you have more footer widget options
you can have that scroll to top a little icon on the bottom right hovering on your websites
you have more ahead or locations you can have more dynamic header options this is actually
kind of interesting if you want to unlock some various header options you can white
label it I never really see the value in this but if you’re making websites for someone
else you might want a white label it so they don’t think oh this guy just went and bought
this Astra thing and I can do the same thing and you know what I pay him $3000 for so this
allows you to actually white label it so they will never see your client will never see
who actually makes what they’re using okay additional blog layouts additional site layouts
and this is more for that content container this is actually pretty neat in of the lesson
context so you’re to be able to make some different lesson layouts with this extension
right here WooCommerce this is good to be an option for selling your courses in any
kind of merchant that you might have marches that trendy word for you know merchandise
so you can sell that with WooCommerce is the Astra Theme has the best WooCommerce integration
that I have seen I even made a full video on it’s okay more header design spacing control
this just came out this is actually so helpful and I’m in actually show you how to use the
space in control so essentially every aspect of the website where their spacing around
elements your to have these options to modify the spacing and I’ll show you what I mean
when I install the Pro version of Astro that’s can be after we set everything else up and
here’s so actually this is coming soon but it actually has already come and then the
mega menu that is coming soon as well that’s when you hover over a menu item and then kind
of a panel will reveal and you can have additional bits of information in their soap that’s Astra
just visit WPCrafter.com/Astra now I like I said I’m going to install the Pro version
at the end of this video and just enable some of the features so that you can see what is
possible now I’m not saying you have to go out and get the Pro version of Astra today
I’m not pushing that on your are saying that it does help the developer but see the beauty
of this entire tutorial is you can start where ever you are so some people they can start
you know right with Astra Pro or maybe Elementor Pro and they can start with those professional
tools but if you don’t have the ability to do that jerking to still be able to start
with the free version of Asher and the free version of Elementor and you’re going to have
everything that I showed you in the beginning of this video and you there’s nothing to be
lacking so these are just upgrade paths that are available to you if that is something
that you want to move forward with and maybe you don’t have the resources now maybe you
start selling some courses and start making some money with your online course website
and then you can start maybe making these tiny little investments to make your website
even better but I want you to know I love Astra I use Astra on my website it was their
very first user a lot of the ideas that I have for a theme for WordPress have actually
gone into this Astra Theme is rocksolid and it’s just a fantastic deal
all right now it is time to learn how to use Elementor and working to start off from scratch
and at the end of this section of the two oriole you’re going to have a vast understanding
of what a page builder is and how to use it to build what you want to build so first let’s
just figure out and talk about what Elementor is so technically it’s a page builder for
WordPress page builder means it’s a tool that’s can allow you to easily through an interface
build out the page of your website for each individual page and the reason we use Elementor’s
because there’s really no easier way to build webpages because there is no coding required
now prior to tools like Elementor if you wanted to build a website you had to know how to
write all different types of code and that just was a unique skill set that only certain
people had so you would have to go out and hire someone to build a website for you with
a tool like Elementor you don’t have to know any code there is no coding required to build
a webpage now there are some best practices near learn all that in this video and some
concepts you can learn all of that but the point is you don’t need to have an education
in coding you don’t have to have any experience in coding you don’t even really have to be
a technical person in order to build a website that you’re going to be thrilled to have so
there’s this transition from manually coding out websites to using tools like Elementor
on top of WordPress to build amazing websites people don’t really and code anymore there
now using tools like Elementor now Elementor is going to be used to create the content
that’s going to be below the header of your website and above the footer of your website
that is called your container area of a any webpage and you’re going to use Elementor
for that part of your website let’s talk about something called the page structure so right
here you see an image of what my website looks like in working to go through in this tutorial
how this is done and the page structure that goes into building something like this so
let’s talk about what Elementor does essentially is going to allow you to create separate containers
on a page now just think of it like a container that might be in your house you have this
container and you can put things in that container and you can have different container styles
you can actually put some items in a container and then take that container and then put
it in a another container so when were looking at your page and the page structure it’s is
simply just a series of containers now the phrase that you can hear me say over and over
again in the terminology that Elementor uses they’re called sections so you have these
section containers now your section container can have a unique background to it may be
an image or video or maybe an image in kind of a color that kinda blends over it called
the gradient maybe just a solid color these are called backgrounds that you can add to
this section container and then this is section containers can I have different spacing called
margins in padding and urinate hear me talk about that a lot margin is the space outside
of the container padding is the space inside of the container it’s very simple if you just
think of it on those terms margin is the outside space padding is the inside space a big part
of web design is spacing everything that you have on your webpage margin and padding you’re
going to come to understand that very good now your section can have columns in it and
so it can be one call number to call number three columns you can to have any number of
columns inside the section container however column is kind of a container in its own and
it can have its own unique background and it can have its own unique margins and padding’s
so if you had a section container and it had a solid black background and then you had
to call them containers in there and that column one you wanted it to be a green background
in the second column you wanted it to be a purple background columns can have their own
backgrounds margin and padding the spacing then there’s the items that you put into these
containers in those I referred to as modules or elements or widgets you’re gonna really
hear those three terms used interchangeably so if I say you’re to put this module enter
this element in or this widget in your inherent those three phrases that are typically referring
to these things called modules so there’s like at a headline module there is a text
box module there’s an image module there is a video module there’s all these different
things there modules elements widgets use all those words interchangeably when were
looking at Elementor so now let’s go back and look at my website that my webpage again
that I showed you a moment ago let’s take a look at it again but keeping this concept
in mind of containers sections columns modules and all of that so here is the first part
of my website and this right here is what it’s the header now Elementor right now is
not used to create headers of course in the future if there can open up that functionality
but today your header is best created with your theme remember how I said earlier in
this part of the tutorial that Elementor you use it for the container and that’s all the
content underneath your header and above your foot or so this right here is my header and
it’s done with my theme let’s look at the next part this is a container it’s its own
separate container and you can see the the sum of the properties of this section container
are it has a white background it’s a kind of a basic container now when you look at
this container how many columns does it look like it has in it it has to right on the right
side you see a picture of me on the left side you see some text and some icons those are
separate column containers now let’s figure out what modules are actually in these column
containers on the right you have an image and it’s just an image of me on the left you
have some text and some icons so you can start to look at this page of mine and start identifying
the separate sections and what is going into building this page so let’s take a look at
the next one and this is a separate section and it has a green background and the element
that I have in here remember I say modules elements widgets on menus all three phrases
they all mean the same thing all I have is a headline in there let’s look at the next
one this is a separate section in this one actually has a contains my social media icons
one container the section one column and it has the social media icons in it and the last
part from the screenshot is this section as well and it has three columns here and you
can see some differences each column part of it is an image some text and it has a white
background you see that there there is this white background and so this is another section
on my website so let’s take these concepts for a moment will get out of the presentation
and will actually start working with Elementor right now and I think all of this is just
gonna start coming together and make complete and total sense so here I have just a demo
website that already has some Elementor pages built with it so when you first install Elementor
it’s going to and activated its can add some options right here in option panel so this
is the back and the setting options for Elementor and obviously when were inside of the page
there’s different settings there so these are more administrative some of the go ahead
and click right here and you have these options you have a library so I’m in a show you in
a moment how you are able to save these section containers and you can save them here our
entire pages that you built you can save them into this library and it will make it very
easy to reuse it on other parts of your website you can also export and import section templates
or full-page templates but this will go ahead here and take a look at the settings panel
now right here is the options of the areas of WordPress were were able to have Elementor
work in that is by default pages and posts right here the more you at your website and
it creates different content types there might be additional options here now here are some
restrictions on user roles this goes into the WordPress and the user account system
if you just have one login to your website then you don’t need to bother with this setting
right here but if you have a website with multiple different user types logging in you
have some control over who can use Elementor on your website next right here is to disable
default colors and fonts so if you enable this colors will be pulled from your WordPress
theme and if you disabled this the cut the fonts will be pulled from your WordPress theme
now you can do that some people really prefer to do that and there are some reasons why
that is actually helpful thing it makes it easier if you want to change colors in the
future or if you want to change fonts in the future I will say though that even on my website
that I’m extensively using Elementor on I don’t have these checked but this are some
people’s preferences okay so then we have these tabs appear still in the settings option
let’s go ahead and click on style and see some of the style options so here we can set
our generic font I never use that option right there here is the content with and it said
to 1200 so this was going to be how wide the content area is on your website this would
go in line with your team in your themes setting this is interesting I would recommend leaving
this and this is going to be the spacing between widgets so we talked about containers and
they have these widgets elements modules in it this is how much spacing will be between
them you could set this to zero if you wanted to manually enter that in or just leave it
here at 20 now the next two options really have to do with your theme in integrating
this with your theme most people will not need to change anything here but if you’re
using a theme with Elementor that doesn’t support Elementor you might need to set these
so that you can get it to work properly and here you have an option if you’re going to
use certain images where you want someone to click on it and have that image pop up
you can see that in a portfolio type of page or some kind of a photo collage or photo showcase
where you might want images were you click on it for to open up in a pop up let’s take
a look at some of our advanced settings right here now or you’re pretty much not can ever
need to go to these settings but right here working on leave the CSS print med method
to external file now this is something that’s good to know it’s a switch editor loader method
some web hosts may have trouble loading Elementor in that case you can come in here and enable
this option right here I haven’t been in a situation where I have needed to enable it
but this option is here for a reason and it’s good just to know that it is there if you’re
having trouble getting into the Elementor editor so now let’s go ahead and click on
tools and working to see some tools here that it’s good to be aware of so first this one
right here regenerate files this is if you’re looking at the front end of your website you
just created a page with Elementor in your something’s just not looking right you can
come in here and just as a troubleshooting magic measure click right here it says generate
regenerate of files now Elementor has a template library and it will automatically sync but
there’s also this manual option to click on this button to initiate a sink so what happens
is they will release new templates for free and also in the Pro version in this library
and you might want to or maybe you’re in a situation where something new is not showing
and you can force it to sink Nexus click on replace URL this is very useful if you are
building a website and at some point you need to migrated to a different domain name or
if you started using your website without using an SSL certificate and then you wanted
to switch to using an SSL certificate this will update the URL for you just put the old
one put the new one and then click on replace URL whatever you do make sure you have a backup
before you do it because it’s not so easy to switch back if there’s a problem next is
a version control now what happens with WordPress plug-ins like Elementor is from time to time
well with Elementor it’s pretty regularly they release updates and so though push out
a new version if you happen to have any problems with a new version that is released you can
come here click this button and it will just revert you back to the prior version and this
is good to know if you’re ever in a pinch and you’re wondering if an update caused the
problem for you right here and I probably wouldn’t recommend this depending on your
skill level but you this might be good if you have a testing set up but this will enable
beta releases to be is delivered to you as an update so you can leave it on disabled
now for me I like it enabled because I want to test future versions obviously for what
I do it’s a good idea for me but it might not be a good idea for you next is one of
my favorite features of Elementor I surprise they kinda bury it in here this maintenance
mode right here now this is really cool so if you’re building a website you want to have
a under construction or a maintenance mode type of notification up and people won’t be
able to see your website while Elementor makes it super easy to do this so right here you
can choose where you wanted to be coming soon maintenance and then you can choose who can
access it so if it’s logged then that means you can access it when you actually log into
your website and then right here you can choose a template and so that would be in the my
library so essentially you could go to the library create a new page save it and then
it would appear in this list here this is how you can put your website in maintenance
mode so no one can see what you’re doing that all they’ll see is that page that you create
or you select right here and also there is some Elementor templates for a coming soon
page I really love this feature right here it’s one of my favorite things with Elementor
and it’s very unique so it last is the system info right here and this is just some stats
from your web hosting environment so if you’re having a problem element and you reach out
to Elementor for support they might ask you for this system info in here it is right there
so here’s a version of this report that is very easy to copy and paste and send to them
so these are the back end settings for Elementor let’s go ahead and now take a look at the
Elementor interface so what we can do me click on pages first so here are some existing pages
on this website I put this together just because I thought it would be perfect for kind of
getting an idea of how Elementor works and this is a perfect website page to do that
with so here are some existing pages but if you wanted to start fresh you would just click
on add new you would give your page and name and then click on publish and then right here
you’ll be able to click on edit with Elementor and it will take you right on into the page
building experience but what were going to do is working a look at an existing page and
just cannot deconstruct how it was built and start applying these concepts of containers
called sections and they have unique properties like background colors videos and in and what
you can place inside of them someone to click on this page right here and since it’s already
been set up with Elementor announces edit with Elementor a minute click on this and
it’s can open up the loader and just in the second or two it’s going to take me right
on in okay so right here is the header and remember the header is not built with your
page bowlers not built with Elementor it’s actually from your theme so I can actually
edit anything in the header but everything underneath the header which is starts right
here and everything above the footer so when I scroll down this is the footer I can’t edit
anything in here but I can edit from here on so that is the container area of the website
where we can have sections and columns and can drag and drop these elements now before
I deconstruct everything here on the right let’s take a look at some of the settings
and options we have available to us in the editing experience so right here were looking
at a list of the elements that we can drag and drop in here and you can scroll down now
if you have any at Elementor add-on packages it may add additional elements of you have
Elementor Pro X can add some additional elements and settings you can always get to this part
of the interface by clicking on this keypad dial looking thing right here this box it’ll
always take you back here and to make it easy to find different widgets that you want you
can just enter it in in the search box here because you’re gonna find that there’s certain
ones that you just tend to use all the time now this global tab right here when I click
on it this is a feature that is in Elementor Pro word allows you to save something say
for example this I can just save this and use it on other parts of the website let me
go back to elements so now let’s click on the hamburger icon this is called the hamburger
icon go ahead and click on that and this is gonna take us to the Elementor settings that
we have when were in the editing experience so the first three options are really convenience
features so let’s first click on default colors this is going to allow you to choose a default
colors that are going to be used by default when you drag in a module or element in here
so there certain ones where it might have a headline and it’s automatically going to
pull this primary color in or secondary any texts it’ll pull this color and your accent
color so you can actually set these to your color palette quite easily so if I clicked
right here where the blue is I can go ahead and paste in a color code and then save it
and now what will happen is anything sent to the primary color will be all linked to
this color and you can change it at a later point to this is actually very useful to come
in here and set your color palette up someone said they recommend or suggest but you’re
probably just going to want to use your color palette I’ll show you what I mean with that
actually right now so let me go ahead and click on the dial pad right here and I’m in
a drag-and-drop heading in let’s say right there and what color is it using that primary
color right there in the same thing goes for other widgets that we have here I know for
example the icon box I believe is the same thing a put that underneath my heading and
you see it has that primary color so if I go back I’ll click on the hamburger icon click
back on default colors now I’m clicking on my primary color and say I wanted to make
that white you see how that works and this is your primary color summary just clear that
out let me go back to the default one like that here’s a reset option she’ll want to
go ahead and set those and then click on the apply button right here Sonoma to go back
by clicking on the hamburger icon and the same applies the fonts so when we click on
here we can set our primary headline secondary headline body text font and are accent text
so on any of these you can click on it and it will reveal the options and you can choose
your font through this long list right here and you can choose the thickness or better
known as the weight and you can do that for all of these four fonts and it’s the same
concept this is the heading font right here if I changed this right here it would change
right there this is smart because if you have everything linked to these default settings
here if you ever change your mind you can easily go here and change color or you can
go here and change of font that’s what’s very nice about this so want to go back to my click
on the hamburger icon now the color picker is similar so any element that has a color
to it you get to choose your color and there’s some default color options that are shown
and these are those default colors so for example here’s this green let me click on
it and I’m in a choose just change it to some kind of goal like that okay so now it was
green and now it is purple now let me show you how that’s use them to click on apply
and now I’m going to click on this headline right here and the color option for this is
underneath this style option right here some click on that here’s the text color and so
here’s a color picture watch what happens when I click on it we have the color palette
and you see that last color there it is it was that purple that I selected so let me
get back to that, click on the hamburger icon click on color panel and color picker and
there it is so you can have your colors in here and it’s just gonna make it so much more
convenient when you’re changing colors on your website so when I go back you see these
are to be your default colors but these are to be the colors that are available in the
color picker now here we have just some settings specific to this page now here we have some
settings that we already saw when we were in the back end of Elementor but they’re also
available here so right here on global settings remember the style the font the spacing the
widget space and all of that and right here is another option that we saw for the image
of lightbox we can choose different colors for that let me go back there and then this
and you concede with this icon this when you actually click it it will take you back into
the back end of WordPress into those Elementor settings and of course here is the option
to exit altogether from the page building interface okay so let’s click on the number
pad here and were back to our elements and let’s look at these options that we have down
here so right here we can go and see the settings that are specific to just this page so let’s
go ahead and click on that and right here is the title of the page and right here I
is the is the template now there something that Elementor has for creating landing pages
is called Elementor canvas and when you put a page in Elementor canvas mode it completely
removes all of the theme generated elements such as your header and footer so you see
I have the header and down below I have the footer if I click on Elementor canvasser to
see them completely vanished and all I’m left with is my page when I scroll down you can
see that footer is no longer there so that is Elementor canvas it’s actually fantastic
for creating landing pages where you want to eliminate all any distracting elements
like a nap and menu navigation so that’s where that comes in handy and also you can have
the status or access to the status of this page or post and this one is published but
I can put it in draft mode if I wanted private and I don’t wanted to be available publicly
yet and then we have this delete button here I’m glad that it lights up and read because
if I was the click on this it’s going to delete all the content on this page so it’s sort
of a reset button okay so click on the number okay so click on the dial pad here get back
to my elements next we have the responsive mode options this is gotta be one of my favorite
features with Elementor this is obviously what it’s gonna look like on a desktop but
if I click right here I can see what it will look like on a tablet and I can start changing
things so if I wanted to make this font smaller I can click on it and I can change it just
for people that are viewing it on this device and there’s lots of controls throughout Elementor
like this so we see right here we have this alignment option this is mobile specific so
I can make it have a different alignment for tablet or for a mobile device so now let’s
see with the mobile preview looks like and there it is so there’s things member is talking
about spacing there’s margin and padding margin is the space outside of your container padding
is the space inside the container or you’re going to be able to tweak those based upon
the device so that you can make sure you get pixel perfect website designs for all device
types, to go back into my desktop view now and let’s shrink that next we have our history
in this is a fabulous feature with Elementor is it retains a history of several things
so every time you click on this update button it’s going to save that as a revision and
also when you’re making changes alive in a page it’s gonna save each one of those and
it’s going to allow you to just do a quick undo or a quick rollback from just what you
change so let’s go ahead and click on that and take a look so we have the actions and
the revisions remember the revision is each time you click on the update button now when
I go here you can see I have two different revisions right here I can actually click
on a different revision and it will go back to how this looked at that time and then you
can jump forward you can also delete revisions there is an exit there to delete revisions
let’s go back to actions so these are actions that have happened since I last saved so I
can go back on these as well and you saw what I added was this icon box and I added this
headline but if I wanted to go back say to when I just added the headline I can click
right here and what happened was is a got rid of the icon box and I can go back even
more now was really nice about Elementor is there are keyboard shortcuts just like when
you’re in your word processor or email program or anywhere on your computer Elementor also
has keyboard shortcuts so you don’t have to go into here each time so I can even go back
to when my editing started by clicking right here and now I am all back to normal now the
next icon here is the I and this is really just the preview button another’s two ways
to preview it you can click on this it’s gonna get you completely out of the Elementor interface
and open it in a new tab when we do that now so it opened up a new tab and it’s going to
show me this page in preview mode and I’m completely out of the Elementor editor however
there’s another way that you can do it and that’s with clicking right here this little
tab when I click on it it makes the Elementor interface disappear and I’m in it and the
previews type of mode as well I guess the pre-purest way of previewing it would be to
click on the eye however you be in there’s also a keyboard shortcut to make this show
or hide as well that is available in Elementor I hope you’re seeing how amazing Elementor
is and full-featured this page builder is and it’s amazing that it is free and then
lastly we have this update button here and this is going to save all the changes that
you’ve made when it’s green like this that means there are changes that are available
that haven’t been saved but when I click on it Juergen to see that it’s not green anymore
and that’s because I now have an up-to-date save which is really just backing up on these
various actions that I did in this part of the video okay someone click on the dial pad
again so now let’s start talking about and kinda deconstructing this page here so when
I start hovering over items like this you can see everything kind of light up in different
boxes so when you see this blue right here this means that you’re at the section container
level now if I click right here watch what happens it pulls up the section settings right
here now get to these in a moment let’s look at these other icons and what they do this
option will duplicate an entire section this right here will give you the option of adding
a section a above this section right here I can save a section to the Elementor library
to use it over again and then right here I can remove a section entirely so what I want
to do is click on the plus right here and add a section and there it just reveals, click
right here where it says add new section the first thing it asks me is what is the structure
and so this would be just one column or two column three columns and so on and so forth
now you can adjust the amount of space that each column is so if you wanted to if you
started was say this kind of a layout you wanted maybe the middle you change your mind
wanted the middle column to be larger to go to this it’s really easy to manually do that
now show you how so what I’ll do is actually yeah here I’ll just go ahead and start with
a two column layout and so now we have this section right here we have a column right
here and we have a column right here now before I get into making this section how we might
want it I want to show you what happens I want to show you how to access the column
settings you know when I’m hovering over this column we have this little option panel right
here and when I click on that it’s now going to be in the column settings you see how it’s
his edit column we have a similar layout style and advance options there so I’m in the column
settings but if I click right here on the blue I’m in the section settings so columns
and sections have separate settings and we have this menu option right here so right
here I can click on this to duplicate a column I can click on this to add a column and I
can click on this to remove a column let’s just see how easy that is so how want to duplicate
a call my click here and now we have three columns if I want to delete a column I can
just click on the X and now I’m back to two columns let’s do that one more time there
is now I have three now I can also resize my column CC that I can just click on the
edge and adjust the size others a more precise way in the column settings I just wanted to
show you the column container itself in case’85 Go ahead and get rid of that I’ll click on
X now what I want to do before we look at the settings for sections and columns I’m
just drag-and-drop a headline in here so minute click on the dial pad here’s my heading, drag
and drop it right there and there it is and so we have nothing here and we have the heading
here so let’s take a look at the settings for a section so remember your section column
settings are to be very similar I just click here announces edit section so first thing
is our layout options and then we’ll have our style options that’s going to be the color
of the background or an image or video in the advanced options that’s can be where these
this margin and padding options are going to be in some other options so we have first
some options here of the placement of the content so essentially what this option means
is the contents not going to be from edge to edge that means the module the background
will be edge to edge but the actual content won’t be edge to edge it will stay within
the same frame as your webpage okay next we have the columns gap so right now that’s the
gap between these two columns I can get rid of it or go through any of these settings
if I wanted to automatically add a gap between these columns I considered default height
for the section so right now it’s just this the default is the amount of space it needs
to hold its contents but I can do a fit the screen so that means this section will take
up the height of the entire screen or I can go to a minimum heights and then I have this
slider right here so if I wanted it to be a minimum of this height I can do that if
I want to exit let’s do something like that in this it has a mobile option as well so
on different devices I can have it be a different minimum height then we have the content position
this is where the content will be positioned in the entire section so right now it is set
to middle but I can go to bottom and you can see the content went to the bottom I could
go to the top like that or I can leave it in the middle and that’s how you would space
your content loops that was actually the column position I’m sorry the same concept flows
into content position as well okay and you can change your structure if you wanted to
after the fact that we have our style options right here and so we have our background this
is the first thing we can choose we can add a border we can have a shape divider which
is really cool and we could set some default topography options for this section so if
I wanted everything in this section to have the font to be white I can set it here in
one location so let’s go ahead and add a background so right here I can choose from classic this
is just get a big color here is a gradient so this is a blending of colors and I can
choose a background video and now when you see these hover options like this you can
see this in various locations this would change the settings beneath it when the mouse cursor
is hovering over that area it’s a very neat feature so it’s go ahead and put a color in
I can show you how that works in a click right here and then here’s a color picker I can
click right here and I can just choose the color of my choice you see that was the same
color as the font let’s put something different there we go and I have a color in there and
that’s simple so I can also put an image in so if I clicked on that I click on media library
these are just some existing pictures that are on this website right here how about this
dog right here let’s see click on insert media and there is our image now what happens with
images if you haven’t made it the size you want there is this position option so I think
I’m in a go center bottom to get the dog in there there we go how about center rights
actually know about middle center there we go now we have the dog and there she was have
to just pay attention to the size of the images that you upload and how it may fit now we
have other options for how a an image will display in the background we can try playing
around with the size to see if we can get that looking any better so here’s the defaults
here’s the auto setting is not making a change here’s the cover setting and that actually
makes a really big change and it looks a lot more like the image here in the picture I
actually come like the way that looks now a lot of times when you use an image or video
and you try to put text on top it’s a little hard to see the text that’s what you might
want to put a background overlay this would be overlaying a color or gradient over the
image so many click on that and I’m in a choose a color overlay so I can click right here
and let me go ahead and choose a dark color and you see how it’s starting to make it easier
to read the text when I do that and I can adjust this to adjust the transparency or
how strong that color comes across and that’s making it a lot easier to read the text and
this is pretty much the same settings you’re going to get for a column that’s probably
not gonna look good in this section I’m creating right now but we also have these shaped dividers
and you can put them on the top of the section or on the bottom of the section and it will
add a shape so let’s try to add a shape to the top why not so here is a list of them
and I’ll just show you one or two and you’ll get the point I’ve made videos on this before
there is a shape divider right there and you have all these controls to change how it looks
and you can change the height of it if you just wanted it to be subtle you can do all
sorts of things with this you can flip it you can change this color right there there’s
so much control you have over this typically you see people use it on the bottom and it
looks good when the section on the bottom has a solid color so here’s mountains on the
bottom like that you can play around with it but you can see how this is a very powerful
design tool when you come into the settings here and less I said about the topography
this is your fonts you can set it so you can have a setting that will be applied to all
the text that might be in a particular section so for example heading colors so if I wanted
to change all the headings colors I can just go in here and set it for the entire section
and click right here and in this case I might go with a white font and there it is so you
can see that you can set topography options for an entire container section if that is
what you’d like and that is our style options and you can have a lot of these style options
are most of them in the column setting so now to go ahead and click on advanced and
this is where we have margin and padding so margin is your space outside of the container
so if I increase it on the top it’s gonna push the container down because it’s space
on the outside now patting his space on the inside so will stretch the inside let me give
you an example of this actually let me get rid of the sheet divider really quick so that
was down here under shaped dividers it was the bottom shaped divider I’ll switch that
to none and then I will go back in here all right so for margin and padding you can click
on click or leave this click this will link the same values together so for padding if
I start increasing it like this you notice how they all increase okay that’s when they’re
all locked together and you can unlock it if you wanted to just by clicking right here
so I’m in a go ahead and I’ll leave the margin locked okay and see what happens when I increase
it you can see what’s happening it’s the space outside of your container so when I increase
that it add space above and below that is margin padding is different so with padding
it is the space inside so as I increase this it’s adding space right here and if I increase
this it’s can add space on the bottom and that is what padding is and you can also control
left and right padding if I wanted to increase it actually this would be the left padding
watch what happens when I do this it pushes that text inside like that so spacing is a
big part of web design and it’s important to understand how to use margin in padding
margin is the space outside padding is the space inside and for these two controls there
is a mobile Options right here so you can set it on a per device basis and you’re definitely
going to want to do that so me lock this back up and then delete it out here some entrance
animation options some technical I options here with CSS responsive options this is really
really neat so you have visibility options so what this means is if I only wanted this
container to show on a desktop and not on a tablet or mobile I can just click here and
click here and now this will only show on a desktop I use this a lot I’ll create a section
just for my desktop and then I’ll create one just for mobile devices and so that’s how
you would go ahead and do that and then this right here is just an advanced feature in
Elementor Pro’s actually very good feature I happen to use it a lot cane that’s add custom
CSS here’s a little on the technical side so that is the section container and here
is the same thing I just quickly jumped through the same thing for columns now columns right
here you can set the column with remember I was here adjusting it you see how that numbers
going up and down when I do that you have full control over that number just by manually
entering something in here is our same styling options right here and here’s our same spacing
of margins and padding’s and that’s the same options we found inside of the section so
we’ve covered a ton already we talked about sections in columns and elements and here
are elements and you just literally drag and drop them in each element is going to have
its own setting panel as well so right here this is the heading elements and when I click
on it right here there are options for the content that’s in it the style and advanced
so you’re already familiar with style in advance now these options are to change based upon
the module that you’re working with now there’s also some stuff I wanted to show you here
when you’re hovering over a module you see that blue pencil in the top right when I hover
over that this gives me options to delete this module or widget right here I can also
duplicate it and right here I can edit which really just brings up the settings so if I
wanted to duplicate this I can just click like that and then I can just drag and drop
actually let him go like this drag and drop that right there was a very easy to do now
one of the nice things about Elementor is it has something called in the line editing
so what that means is for the vast majority of text you have two options of modifying
the text so right here when I click on this you can see right here I can edit the text
I can go right here and edit it and it add it at and it gets added here in real time
but you also have in-line editing so I can click right here and I can start typing directly
here and when I click like that I have I can highlight something I have options I can bold
I can underline and I can italicize so if I wanted to bold that out I can go like that
and now that is bold and you can see it changes what is here this is known as in-line editing
and it’s one of the great features of Elementor so you have two ways of doing it so this headline
has these options I can make it a hyperlink if I wanted I could just pop something in
there I can change the size of the text right here I can set the alignment so if I wanted
to write a line I can do that and you have mobile options for that and then in the style
tab we can have unique topography options here we can have unique color and if I click
right here it’s is topography have options and another thing right here is tech shadow
which is really advanced and really cool we can actually place a shadow underneath it
so it’s easier to read and just by actually clicking on that it actually added a shadow
and there’s a subtle difference between the two you can do some really neat things with
this text shadow option what’s nice is you know in here and play around with the settings
and everything and you can if you don’t like and you change your mind you can just click
this right here and it puts it back to default also with elements we have the style of our
spacing or margin and padding just before it’s in those same options here so some of
the most commonly used elements are going to be image so you could just drag and drop
that there and then right here you can click on delete and then click here again and choose
an image click on insert media and there we put a picture in that was very easy and you
have your alignment and all of that another commonly used elements going to be the text
editor this is just going to be normal paragraphs of text you can see that right there so for
this we have the same in-line editing we have our content box here and we have a style tab
right here and I can change the text color to what I want to if I wanted to make it white
there’s my text color and you’re already familiar with a lot of these options already and then
let’s go back here we have an option to add a video a very common element you’re going
to use is to add a button here let me clean this up a little bit and will take a look
at the button this is probably one of the most powerful modules that you have so this
is how your button starts and you can choose different styles right here you can change
your text I think this also has in-line editing yes so I can start changing the text right
there popular Lincoln you can set your alignment you can set a default size so if you wanted
it large now we can adjust what’s it called what’s this called hears it margin or padding
it is going to be patting sorting to change that in a moment you can also toss an icon
in there if you wanted so let’s just throw something in knowledge jump into style and
guess what we see here padding so it’s all locked right now so if I start increasing
get it just removed all of the padding and now there’s just one little pixel of padding
so you can go here and maybe set it to 10 and then unlock it and then maybe add some
more to the right and the left of the button to make it just gonna look a little better
so let’s try to make it 2525 so there you go I usually like my buns to be a little wider
maybe like that you see how it’s adding some additional padding to the side there it is
okay let’s make these the same and you can totally have control of the button you can
control the topography right there button is something where you’re going to maybe want
something different for the hover so you can have control over the text in the background
on the normal state and then the hover state so for hover I’m going to make the text why
it’s and then I’m going to make the background something like this purple so now watch what
happens I hover and the button changes just like that there’s also some animations if
you wanted it to do something when someone hovers there it is you see how that changed
so you have full control here it’s just getting comfortable with these style options here’s
our border radius I told you I usually like to have five there is some there by default
so here it is let me go to five I think it might’ve been five by default there it is
and we can also do some box shadow this puts a little shadow underneath the elements and
it can elicit off the page and so that is the button you’re going to use the button
a lot there’s dividers and spacers you can have Google maps your to use image boxes icon
boxes photo galleries lists counters progress bars I don’t really use progress bars that
much myself but that your progress bar right there here’s the counter I don’t usually use
counters that much either but there is a counter and you have full control over the style as
soon as you start getting comfortable with it we have tabs toggles there’s all these
options here’s just a matter of jumping in and getting comfortable with it here’s the
testimonial this is a fabulous element that is available to you and so let me just go
ahead and click right here the X and get rid of it so you can see we just have a big section
here with the headline right here we have a section in and has this color in the back
by click here this is just the heading this right here is just the text editor this right
here is just the button there are three columns in here this is just a column with an image
and here’s a column with an image that’s all that there is and here’s another section and
this time there’s an image in the background and there’s a headline and here is a another
section it’s one big section and then this part right here has these three columns in
it to kind of showcase the services but if I click right here this right here is just
the image module in this right here is just the title and that’s all there is image and
title and is just repeating like that and so that’s why wanted to show off this element
was because it’s I mean this pages because it’s very nice and simple and you can see
easily how this is created so anyways this is the Elementor interface you can just go
ahead and click on updates and then you can click the hamburger icon and then you can
click on exit to the dashboard now it’s important to note that Elementor is growing and they
make changes from time to time so you might jump in there when you’re watching the video
and maybe a button moves or an option moved but it’s usually pretty easy to go ahead and
figure it out just in the situation if that does happen to you so now let’s talk about
something else okay now there’s Elementor but there’s also Elementor Pro Elementor Pro
is $50 for a single site license $99 for a three site license and its hundred and $99
for an unlimited license I have an unlimited license I actually bought it the first day
it was available for sale and what it is is an add-on package for Elementor so it doesn’t
replace Elementor it just works hand in hand with Elementor if you’re interested in checking
that out just visit WPCrafter.com/Elementor and I’ll have a link down below but let’s
take a look at why you might want to consider Elementor Pro and just for disclosure purposes
I use Elementor Pro on my website WPCrafter.com.com so your 1st’b0 to get some professional module
some Pro modules and there’s a whole list of them on the Elementor website when you
visit WPCrafter.com/Elementor but some of the highlights are this amazing forms of modules
you can create beautiful forms opt in forms forms with lots of questions it’s extremely
powerful and integrates with different autoresponder services it’s pretty pretty impressive when
you take a look at it it’s very impressive you have this post grid module that’s actually
what I was using on my homepage where you see the list of different blog posts in pieces
the content that’s the post grid so it’s a beautiful way of displaying all the blog posts
that you might have on your website another popular module is the slider module slider
is what you’d sit can see sometimes on various websites you go to write on the homepage right
underneath the header and they’ll be some content and then it will slide away in some
more content will show that’s a slider another very popular module and I think is one of
the most powerful that they offer is a pricing table option and you can create some beautiful
pricing tables with the Elementor Pro module so there’s obviously a lot more to Elementor
Pro there’s a ton of extra modules that are extremely powerful now the reason I pointed
out these these fours because these four are typically separate things you would have to
pay maybe 50 bucks each for I know there’s many forms plug-ins that are hundred dollars
or $200 a year there’s PostScript plug-in slider plug-ins pricing table plug-ins and
you get this all with Elementor Pro and that’s just some of what you get another thing that’s
really neat is you get to have global sections and elements and so what this means is if
you want to create a section and have it show on say all across your website there’s two
ways you can do that you can save it and manually restore it on all those pages but the problem
is what happens if you want to change something you have to manually jump to all those places
where you put it and change it now if you have a global section you could have one that
is applied across your website so when you want to make a change you just have to change
it in one location I extensively use this global section and global element feature
of Elementor Pro it’s very powerful next you have this spot to put in custom CSS this is
a little on the technical side I can tell you I use this all the time and I do have
a video out on adding custom CSS to Elementor who and I actually forgot to show you this
was their template system, and I have to jump back in there actually one when I do that
right now because this is actually important when we jump back into Elementor here gosh
I can’t believe I forgot to show you templates okay so here when you first create a page
and jump into Elementor you can have this ad template option so when you click on it
it’s gonna show you their template library any of these templates that have this Pro
badge on it are only available in the professional version of Elementor so there’s plenty of
templates here that are available that are in the free version as well so all you have
to do is click on it and then click on insert and it literally downloaded from the cloud
and puts it right inside of your website you can see some of these pro templates that are
very beautifully designed their perfect source for inspiration and they also serve as a great
learning tool on using Elementor this is really neat with the shape dividers I always like
how they do that so you can literally restore one of these templates and see how they did
it and that’s a good way of learning that when I scroll up there’s also filtering options
here so you can mark your favorites and you can also see what’s most popular and what’s
trending and you can see what’s new and I will say they are consistently adding new
templates to this template library so that is the templates and see you get those Pro
templates with Elementor Pro and next is some features that are just about to come out and
that is Elementor being able to create the header and the footer of your website so you
wouldn’t have to be limited to whatever your theme offered you you be able to do it in
Elementor Pro and you will also be able to make stylish blog posts or content layouts
with it that is a little on the technical side as soon as they launch this on and have
a ton of content out on it it should be out in the first 1:45 thousand 18 now if you did
want to get Elementor Pro you can easily add it later on at any point but I have a training
course called Elementor essentials it takes you much deeper in training on how to get
the most out of Elementor and design beautiful websites with it I normally sell this course
for hundred and $99 however when you visit that link WPCrafter.com/Elementor to take
you to a page on my website where I’m to show you how if you were interested in purchasing
Elementor and you did it through the link on that page how you can get this course for
free so instead of paying $199 for access to this training course I will actually enroll
you for free you can follow all the instructions that you see [email protected]/Elementor
so that is it for this Elementor tutorial right so now what were going to do is take
everything you just learned about Elementor and apply it to the template that we have
already set up on the website now remember when I was saying when we were choosing the
web design that you could take the knowledge you’re going to gain of Elementor and this
amazing page building tool and you’re going to be able to apply it to anything that you
want to create and and I just I’m just excited for what you are to be able to create your
future but what we have to do now is customize this site to make it look how you want and
so now everything is going to start making sense to you is working to go ahead and click
right here where it says edit with Elementor and that’s can elude the Elementor interface
and working to be able to start changing this design to be whatever we wanted to be so right
here we have this largest section right here and there’s this background image so it’s
good just go ahead and take a look at those background settings by clicking right here
and that’s good to be the style settings and here’s that image and it just right there
so you can easily change this to an image that you want now this is the image but you
notice how it looks a little on the blue side here and that’s because this image has a background
overlay over it so when we click on background overlay here we see that blue so I could click
right here and if you wanted to change that to a different color or different shade you
can easily do that and obviously with your image in the background whatever you wanted
back there and you can easily do it just like that and you can change the angle of this
ingredient so it’s a gradient going on and you can go ahead and change the location like
this and it starts to change a little bit and you can set that to however you want or
if you don’t even want this you can remove it as well it’s completely up to you you can
have whatever you want and so right here’s our first headline you can just go ahead and
click on that headline and just start changing text if you want or you can change the text
right here now if you want to play around with the size of the Fontan the font itself
that’s super easy all you have to do is click on style and here’s our topography option
you can click on the little pencil right here and this is where we can change the size to
something bigger or smaller whatever we wanted it to be you can change the weight of your
font if you wanted to be thicker you can also have some transformation options if you want
everything in U can do that it’s all in uppercase obviously I’m just butchering a website right
now and that’s why I love with Elementor we have this little reset icon right there and
when I click on it it goes all back to normal males also have some text shadow options right
here same goes for here it’s our text editor and we’ve got our bits of text right there
whoops even though it just disappeared but if I click out it will come back then right
here we have some more text here we have two buttons side-by-side and it’s so easy to tweak
these buttons you can just click on it and you can start editing the text if you want
on the button right here or you can change the text right there and then drop your link
ends if you wanted this to go straight to your course page and he had the link for that
you can just paste your link in right there you also have all these styling options here
for the button if you wanted to round those corners off you could just change this to
five that’s how I like to have mindset now if you do have a button style like that you
would want to apply to all your buttons so if I click on this one I’ll probably want
to go to the style and go ahead and increase that to five as well and you can see now when
I click on this you can see it’s just a little rounded I really like that for some reason
I tend to use that a lot that’s the same thing you can go ahead and set your link in the
style you can change the background color of the text color to whatever you want know
the same thing goes for all of this now personally I don’t think this section right here fits
really well so what I would do is just delete the whole section about when you click on
this just like this it’s just an image gallery showing these various logos so we I mean if
you are a personal brand and maybe your mentioned in various publications you might want to
put icons or images or logos to those various publications that you may be featured in or
you can just click on the X and get rid of the whole section altogether the same goes
for here this is a section with three columns just like that we’ve got this blue color in
the background of each of these columns if I click right here and then go to style you
can see there’s that blue color she can change that color to whatever color that you want
same goes for all of this I hope you’re starting to see how really easy this is to work with
this right here is just an image I can click on it and actually looks like the images in
the background of the column so if I click right here and then go to style Yep that’s
where our images so if you’re clicking on something and you’re not seeing what you expect
that might be into the column so that’s where this image happens to be right there and then
we have this and this is just how basic and simple everything is in this template let’s
go ahead and get back out of here and then jump into some of the other pages so we go
back to the front end of the website we have this about page right here this is just some
simple text right here and then we have this headline area and then we have these different
testimonials here that’s pretty basic I don’t think there’s anything to show their right
here we do have these e-books you might actually just want to get rid of this entire section
altogether this menu item if you don’t have e-books formatted like this that you want
to share but I really love the style here how the e-books just lifted off the page a
little bit was some drop shadow right there might want to use this page or this design
for a different purpose the e-book one right here that we have courses here which were
going to actually completely replace in a moment and then let’s take a look at the contact
page right here I see some different types of elements that jump into Elementor for here
and take a look at that real quick so right here we have a three column layout and so
you know how to change text and we have the text here but we have some different here
we have these icons oops and I just messed those up thank goodness I can go right here
and I can just go back to where I started okay so there you go now I’m clicking on and
these are just the social icons module that we have inside of Elementor and if I didn’t
say use Google plus I can click right here and choose something other than Google plus
if I wanted to and you can have these icons and then you could set the links that would
take you there so this is where you’d have a link to your Facebook page or twitter page
and whatever links that you may want to have and were using the same thing here for the
icon list so this is the first item and were displaying the phone number and we have the
little icon of the phone in each one of these can have a different icon next we have this
contact form right here this is actually going to be set up in the contact form plug-in that
we’ve downloaded and installed and I’ll be touching on that later in the video so that
you can tweak this to be exactly how you wanted to be so okay let me get out of Elementor
and that’s pretty much all there is to it I hope you see how easy this is now the see
the logic and spending all that time going over all these aspects of Elementor now you’re
to be able to apply it right here on this web design to make it exactly how you want
change out sections change out text change out images it’s really simple if you just
follow that framework I presented where everything is broken down into sections in those sections
you have columns and in those columns you have those various elements so that’s it for
the Elementor portion of this tutorial next working to start finally getting on digging
on into the learning management system so let’s learn everything there is to learn
about LifterLMS as fast as possible so what is LifterLMS will first it is a mostly free
WordPress elements a plug-in element stands for learning management system I don’t know
who came up with that acronym I never liked it but it’s kind of this industry-standard
LMS icings when those acronyms where most people don’t know what the heck it means right
off the bat but it just answer learning management system LifterLMS is mostly free it’s actually
completely free however if you want to accept payments and have this automation where someone
pays you and they get access instantaneously then you need to purchase one of their payment
gateway extensions that are very affordable though and I may give you some strategies
towards the end of this video on what you can do if you don’t have one of those payment
gateways so it essentially can allow you to sell and deliver online courses to students
and you could also sell bundles of courses so this would be if you have three closely
related courses and you can sell that as a bundle you can totally do that with LifterLMS
and then it’s also going allow you to sell memberships with courses so you can create
different membership packages that include courses and you can also use LifterLMS to
secure content anywhere on your website it’s actually very unique in that regard and then
you can also have quizzes and give certificates for when people complete their courses it’s
pretty full-featured so let’s look at some of the highlights of the various LifterLMS
features now I just want you to know that LifterLMS is pretty much gonna do everything
you would want or expect so there’s all like a whole laundry list of features with the
learning management system I just wanted you to know that right off the bat so you’re some
of the big ones and then a Mexican to just jump over to the LifterLMS website so I can
hit all the points on their features page but your to get content drip this is something
I hear people’s ask all the time doesn’t allow you to drip content out this is a simple feature
where say someone roles and of course you don’t want to overwhelm them with all of the
lessons and sections of that course all at once so you’ll only make a certain amount
available the first week of their enrollment and then you’ll release another batch and
another batch that’s called content trip in your to be able to do that very easily with
LifterLMS you have this thing called progression control that’s basically you can’t see this
lesson until you’ve completed this other lesson so you have that fine-grained control over
how your students experience your course this are pretty neat engagements and achievements
of system engagements is reaching out sending emails and achievements is game with the occasion
that’s awarding badges and kind of these given vocational rewards or achievement badges when
people are when your students accomplish certain parts of your different courses get this notification
system that’s very good there’s fantastic reporting I think that is probably one of
their most underrated features is the reporting module right off the bat is really good and
I use it a lot myself so just to make sure I don’t miss any of these features him to
jump over to the LifterLMS website right now okay here it is here’s their features page
as a matter fact so yeah I see it’s good that I’m doing this you can have multimedia lessons
is different types of media for those lessons so can be video and audio of course text and
all of that you can have quizzes there’s a really cool course builder and this is something
that I think they are kind of like the pioneers and I think they have the market cornered
of having the very best course of building experience I like a lot that’s one of things
that attracted me to this platform dripping out content prerequisites and that’s what
I call progression you have course tracks I guess that’s a part of progression as well
you can have assignments a quiz timer student dashboard that’s actually very nice to have
that dashboard multi-instructor Naumann clarify just some stuff with multi-instructor course
can have more than one instructor assigned to it but but LifterLMS is not a course marketplace
so I’ll explain difference their lesson downloads course import to their import feature actually
could use some improvements and you’ll actually see in this video instructional design discussion
areas on the can actually cover that you can actually add a user form if you wanted to
that would involve adding another free plug-in course export forms integration that’s with
a paid extension right there graphics pack that’s a paid extension course reviews that’s
not a paid extension that is a part of it people to leave reviews here is some of the
features when you’re using one of their payment gateways and this is actually what I want
to talk about next and the actual presentation part but there’s all these options here but
the big ones are reoccurring payments and this is where you might be selling a membership
for a certain amount of money per month or some kind of a reoccurring payment you can
do that with their payment gateway and you can set up payment plans that’s where maybe
it’s $1000 course and you sell it $4000 or three payments of $400 so that would be a
payment plan option and unlimited pricing models means for a course or membership you
could have the pricing models be different I actually just give you perfect example of
that with the thousand or four payments of three payments of $400 subscriptions it has
a full XM get a little ahead of myself here that’s okay these features are kind of all
blended in here so LifterLMS has his own checkout system this is one of things I really like
about is you don’t have to use a third-party checkout system like WooCommerce or something
like that you could make courses for free and offer them for free you can of course
bundles private coaching up cells this is with a paid extension that they have coupons
this is fantastic and there’s also a voucher system that’s right here with the bulk sales
you can add an affiliate system to it if you wanted to native sales pages off-line sales
that said voucher system I believe okay e-commerce dashboard pre-selling Lala law while in there
so much more down here okay I’m not going to hit every single thing here I’ll actually
put a link to these features so I was just more hitting the more notable ones okay so
let’s go ahead and take a look at how do you actually sell courses and memberships in LifterLMS
while LifterLMS is going to require a payment extension for the automation of selling a
course in giving instant access so that’s why said in the very beginning LifterLMS is
mostly free and the only thing that it doesn’t happen the free version that you may want
and most likely are going to want this some kind of a payment extension and they have
several of them available will take a look at those in a moment now you can also use
for a show their shopping cart the LifterLMS shopping cart or you can use WooCommerce if
you wanted so one option if you didn’t have the financial resources to purchase one of
the payment extensions for LifterLMS one of mom’s you use WooCommerce which is free I
have a full tutorial just do a search for WooCommerce fast past I have a full WooCommerce
tutorial that will show you how to use it it’s free and you can accept payments with
PayPal they can accept payments with striped that’s a credit card directly on your website
you can do all of that with WooCommerce and then when you see the WooCommerce order you
can manually enroll the student into a course or you can send a voucher code now LifterLMS
also sells an extension to integrate with WooCommerce to add that automated automation
aspect but if you don’t have the finances to purchase a payment extension for LifterLMS
you can certainly sell with WooCommerce I personally preferred the shopping cart system
that comes already integrated with LifterLMS with their PayPal extension another way to
sell your courses is with coupons and vouchers so you can obviously give out hundred percent
off coupons but what’s really neat is you could send vouchers so you could literally
not use WooCommerce and just have kind of a go to PayPal and generate a payment of payment
option on PayPal and that’ll be a link and you could put that in a button someone can
click on it it’ll take them over to PayPal they can make the payment you’ll get notified
through PayPal and then you can email them a voucher code to enroll in that course now
if you’ve ever taken any of the courses on my website you’re probably already familiar
with the fact that I use that voucher system pretty heavily so if I say to you hey if you
order hosting them and I give you these courses what you do is you send me a copy of the receipt
and then I send you an email with a voucher code and the same thing goes with Elementor
or something like that a lot of times I give a paid training course away in the way I’m
doing that is with this really neat voucher system it’s one of the really unique selling
points of LifterLMS and I do have a little bit of good news for you before making this
video I reached out to LifterLMS and I said hey I’m going to make this a video and I want
to kind of reduce any obstacles for someone getting into the automation side of automating
these payments and giving access to their students can you can you give me some kind
of a discount code so that I can give this code out in the video and people can save
a little bit of money and they agreed and they gave me a coupon code that will save
you 15% off I’m in a go I then put this in the video description box down below will
see it near the table of contents so will see the code and you can just head on over
there and use that code and save a little bit of money some and head over to the LifterLMS
website right now to take a look at some of the payment gateway options that are available
to us so here I am and here’s all of their extensions and you can just click on the category
of extensions I’ve gone ahead and clicked on e-commerce so I’m a scroll down here so
we have the PayPal extension stripe stripe is that really sweet easy to configure payment
way to accept credit cards on your website it’s really fantastic authorize.net that’s
more of your traditional merchant accounts and you can also integrate it with WooCommerce
which has a ton of different payment gateways for it so if you’re in some countries where
you really have to use some kind of random payment gateway that isn’t supported is in
PayPal’s and stripe isn’t available through authorize.net you’re probably going to have
to go the WooCommerce route and WooCommerce probably has that payment gateway supported
okay and so these are the four different payment extensions let’s take a look at the pricing
so here’s the PayPal one this is just as good as any to take a look at you can see it’s
$99 so that 15% off is going to bring that down to what $85 or so so you really only
looking at that in order to get going with LifterLMS that $85 expense that’s been discounted
from $99’s and Ellis look at some of the pros and cons of using the LifterLMS so let’s first
look at the process so it has this built-in shopping cart that is awesome if you look
at other learning management systems I’m not going to make a comparison in this video but
if it is a good reference point they don’t have built-in shopping carts they all require
something else like WooCommerce or something along those lines LifterLMS is really the
only learning management system that is a complete solution from the shopping cart itches
the complete all-encompassing solution where other learning management systems there more
designed to integrate with some existing set up that you have where LifterLMS has a lot
of these modules so it’s going to have this shopping cart and I really like the shopping
cart checkout experience next it has a built in membership system other learning management
systems do not have that that something additional you have to buy install inner great learn
how to use and have a potential problem down the road they don’t have a built in membership
system this is what you’re getting with LifterLMS this free learning management system it also
has built in reporting the reporting is really good they put a lot of effort into really
good reporting and they really have delivered this is another thing that you might not get
with other learning management systems you have to pay extra for next they have a really
innovative course builder I really like their course builder they actually redid it about
maybe six months ago and released it sometime in 2017 maybe mid 2017 they released an all-new
course builder and if they really nail that they have like the best course of building
experience that I have experienced and they have this really cool voucher system this
happens to be one of my favorite features and this is something that you’re not getting
and other learning management systems there is one other very popular learning management
system just to add a voucher system you’re looking at about $200 just to have that one
feature and so look at each of these features that I’ve listed here these are things that
would cost a lot of money separately with other systems and these are definitely the
strong points of LifterLMS that I don’t think people realize when they’re looking at the
plug-in and they’re just looking at the surface they don’t realize that it really does all
of these things and it’s very simple to make it all work together seamlessly so let’s take
a look at some of the negatives or the cons in the first two are big ones the first one
is there’s a big cost misconception that on the surface this plug-in LifterLMS just looks
expensive so if you’re looking around to different learning management systems and shopping around
and then you see LifterLMS they have a lot of different add-ons and extensions that aren’t
necessary at all all that is really necessary as a payment gateway for me I’ve been using
LifterLMS for maybe three years now and I would guess that I have the largest amount
of students of probably any LifterLMS installation at 7000 students in my LifterLMS installation
and you know what the only extension that I use on my website is a payment gateway for
PayPal and it’s only $99 so what happens is here actually let me just let me just go to
their website so here I am on their website if you click on the pricing right here what
you see you see this list little box here that’s is $99 each and you’re like okay $99
and you see this next box it says $299 and then you think you know all my this is is
getting up there little bit and then you look right here and it says $999 and of course
is a little discount right here in your thinking oh my gosh what am I getting myself into this
thing costs of fortune and these prices are pretty high now what this story isn’t telling
you is that all of these things that come in these packages here you view your probably
aren’t really needing or you’re not meeting right now these are more for high-performance
coaching environments I mean like really tricked out stuff like that even me all I’m using
is a $99 add-on for the payment gateway and so people go here and then they see the other
maybe some other learning management system that’s 150 bucks and there’s not like all
these different packages and options and all that it just seems simpler and seems less
expensive but really would LifterLMS all you need is the payment gateway so this right
here is going to come with everything that they offer every e-commerce add on every marketing
ad on every app integration its own theme and and other things like that actually comes
with this really neat thing called office hours that’s actually probably good for some
people for sure in these advanced add-ons right here now these advanced app add-ons
are very cool but they’re not necessarily like deal breakers that you have to have it
so let me see if I can actually pull up some of those among good add-ons right here and
let’s see if I can pull up some of these advance so here’s the advanced option right here so
they all come in this infinity boat bundle right there so right now the two advanced
ones are actually three is private areas so you can set up so you have a learning system
where you’ve got courses but you have a higher priced premium one-on-one coaching program
well the way you would facilitate that through your website is this private areas extension
where you can engage one-on-one with people that have paid for that access to you this
actually probably good idea if you have a website you’re selling courses to have an
extra premium option there that people can take advantage of to get some direct access
to you and that’s this LifterLMS private areas I think aloneness plug-ins two or $300 so
when you start looking at that than this infinity bundle starts to make sense now this private
areas this is not something that you get and other learning management systems or if you
do your paying an extra two or $300 for it so were trying to get an apples to apples
comparison here the social learning this allows that it just adds more kind of a social aspect
to the learning environment I know I’m not doing it justice their advanced quizzes now
this is really for having some really advanced quizzing options so here let’s just read some
of them so you can have it see you can test comprehension create graded exams with manually
great graded question types essays short answer and much much more so that’s going to get
you more closer to like a traditional learning environment and just to be frank with you
that the features that you get in the advance quizzes other learning management systems
don’t to have these features so when you’re comparing the price of LifterLMS and you’re
like oh my gosh what was it a second ago was like $800 we are looking at that and you look
at the next tool from some other learning management plug-in and it’s $159 you’re going
to think LifterLMS is just expensive but I really believe that that’s just a misconception
you only need the payment gateway that’s it so next and this is a big problem and it’s
not just the LifterLMS problem this actually problem that you see with all of the learning
management systems and that’s they’re all ugly out of the box they are ugly beasts I
tell you they are hard to look at I mean these are made by talented coders and developers
but they have they don’t have and I’m intentionally being harsh here is maybe a wake-up call they
just have no design style I think they would actually benefit from going out and spending
a little bit of money on a designer and totally redoing their interface part of their plug-ins
so me being a forward thinker I noticed that this is a huge problem and that’s why I reached
out to the developers of the Astra Theme and I said hey you guys are excellent at design
and eat there these plug-ins that look ugly out-of-the-box is there something you could
do to add support out-of-the-box with Astra for the learning management system and they
said you know what we can do that and that’s how you get a beautiful looking LifterLMS
site right now is with this Astra integration and that’s working to be going over in a moment
here in this video now that’s not to say before Astra you couldn’t have a beautiful LifterLMS
site you could but it would require a lot of what’s called custom CSS and that would
be just all kinds of lines of code to change the way things look in there just really wasn’t
an easy way to get it beautiful out of the box now lastly a con for LifterLMS is it’s
not a course marketplace it’s not a plug-in where you can have other course creators,
and put there in a slot a you Demi right you Demi anyone can go there and put their course
on there and put a price on there and have their own students and it separate from the
other students and you know they can login and manage it all that’s not what LifterLMS
is it’s not a course marketplace so if that’s kind of what you’re wanting or expecting I
don’t think LifterLMS is going to meet your needs obviously it you there is a feature
you can have multiple instructors for course but that’s not a course marketplace so that’s
pretty much the cons as I see it with LifterLMS let’s go ahead and take a look at our next
steps in this video with LifterLMS so what were to do is working in a moment were to
go through the LifterLMS onboarding experience that’s when you install LifterLMS it has this
really great step-by-step onboarding experience to set everything up on your website it’s
super smooth and super easy to get up and running there were to go ahead and set up
our first course and then after that were going to set up a were working to create a
membership number and a set of payments and then after and probably in use for the payments
the PayPal will plug in and then we are going to set up vouchers which you will be able
to use as your alternative for purchasing one of the payment extensions if you’re not
able to do that you can actually sell these voucher codes outside of LifterLMS and issue
those out to people so enough of the presentation part of this let’s just go ahead and jump
in and start putting this all together okay so now were going to finally install LifterLMS
so this is how you do it it’s real simple medical new plug-ins and then I’m a go to
add new and then I’m in a do a search right here for LifterLMS and right here is the plug
in some to go ahead and click on install now it’s just gonna take a moment and then I’m
in a go ahead and activate the plug-in okay go ahead and click on activates and this should
take us into that onboarding experience that I just talked about in the next steps part
of the presentation okay so you could skip the set up but I think you should go through
it this is good because it’s essentially going to set everything up for you which kinda makes
things a little easier it has to create like a student dashboard in a checkout page and
all that kind of stuff and it’s gonna do that nice and easy for us someone to go ahead and
click on get started now were just going to go through the steps so here it saying it
wants to set up a course catalog this will be the page on your website that lists all
your courses a membership catalog a checkout page in a student dashboard now you actually
need all of these for a LifterLMS website even if you’re not using them so if you’re
knocking a memberships which is what we have to leave the page there but will just put
it in draft mode so it’s not public on the front end of your website summary go ahead
and click on save and continue and it’s going to go ahead and create all of that for me
then right here will set up some information for the payments so you can choose the country
that you’re in right here and since I’m in the United States I’ll leave that in my currency
is the US dollar and one of things I didn’t mention is you could actually have an off-line
payment option so if you have people that might mailing the payment or why are you a
payment or something like that you can definitely enable off-line payments actually I’ll go
ahead and enable it now okay so it’s go ahead and click on save and continuance can just
move us forward this is them saying do you want to allow your LifterLMS installation
to share information with them I we say no thanks because I always you know, private
type of guy so I’ll go ahead and choose no thanks right here but you can click on allowing
the city a coupon I think might be 10% off coupon or so I’m not sure exactly but I’ll
click on no thank you and here is the last step and it’s basically saying do you want
a sample course in stalled in you can kind of see how it is kind of all set up and this
is optional if you want to now in the past when I’ve made videos on LifterLMS I have
done that and certainly if you want to dig into LifterLMS and learn all kinds of different
things you could certainly consider doing that however I’m not good That in this video
I’m just going to click on start from scratch right here and it’s gonna take me right back
into LifterLMS and it’s good to give me this option to start creating my first course in
the nice outdoes that it was just like us real simple process there’s no question of
what I do next it just took you through all of the steps so what I’m going to do now some
to create my first course animal to give it a title and then right here’s some information
so you can put a description for your course and this is what you we what you put right
here is what enrolled students would see in right here is what non-enrolled students would
see okay and then there some other options here so here’s the general settings I could
set the length of the course I usually never set that myself you can set a course difficulty
this would just be info that will show on the front and I never use that either featured
video this is if you wanted to have a video integrated in the course listing page I never
do that either I’m in a show you something else that were going to do there so you wouldn’t
want that anyway here’s an option to display the video on a course title I would just leave
that off I tried that once I did like how that worked and then a featured audio sets
are general settings looks look at some restrictions so here’s how you can restrict some different
things with your course so you can have an enrollment. This should be for like maybe
a bigger course that you only open up maybe two or three times a year for enrollments
kind of to have that scarcity going on you have an option with that I don’t use that
myself enable course. So this is where you can set a start and end date for the course
here’s where you do that prerequisite so if you wanted them to complete a prior course
before they can start this course you can turn that on right here and then here you
can set a capacity of how many students you could take in the course I don’t usually set
that at all then on the review step we can just have reviews enabled or disabled if it’s
enabled that just means your students are to have the ability to add a review on the
course page it’s kind of a basic feature I don’t usually use it myself because you don’t
have full control over how those reviews are displayed so I prefer just not to use it in
the first place but then here’s how you would display or enable the displaying of those
reviews and here’s an option to prevent multiple reviews then right here working to set up
a course access plan this is how we want to sell the course and that’s pretty much all
that there is here I can add additional instructors if I want we don’t have any students but if
we did it would start showing here after we set all this up right here is an option to
launch the course builder that’s a really cool interface for building out this course
and that’s pretty much all there is to this well actually here’s a really important thing
I forgot you’re gonna want to set a featured image you definitely need a featured image
for every single course and that’s can make it so whenever your course is featured in
an grid it’s gonna look really good I personally like to do everything in what’s called the
16 x 9 format so for me that means the dimensions of my images are going to be 1280 pixels wide
by 720 pixels tall so 12 80 x 7 20 that said 16 x 9 format you don’t have to do that that’s
just what I use for my blog image is for my video thumbnails everything I use 16 x 9 format
okay some of the scroll up and I’m gonna start filling this out right now okay so I have
it all filled out now I named it create an online course websites you might want to have
a spicier title to your course and that right here I just split you are now enrolled in
the course usually what I like to do here is I like to go here and add that same featured
image so many click on add media like this and I just uploaded it’s it’s right here to
go ahead and click on that where to put that in there and actually I did that wrong let
me go and do that again add media click here I didn’t wanted this smaller size to go with
the full size like that inserted into the post just like that and then what I like to
do here I want to center that and I’m probably gonna want to go on bold just like that so
this is what someone’s gonna see when they are enrolled in the course and this is what
they’re going to see when they are not enrolled in the course okay last thing I forgot to
mention you might want to disable comments so by default that Schechter and one unchecked
that I usually uncheck that on all lessons all courses I don’t want comments and in the
lessons themselves okay alright so we have the saw Phil Donovan to go ahead and click
on publish and we can maybe go and see how this is looking so far it’s that I wouldn’t
expect much at this point where definitely have some more work ahead of us okay so this
is looking fine for me right now so many go back actually the color scheme would be nice
if I made it match maybe this would look better on that other template but that’s okay this
is just for this tutorial so okay now medical back and what were going to do now is working
to start adding some sections and some lessons to this course and the way were to do it is
really click right here it says launch course builder and this is gotta be one of my favorite
features of LifterLMS it just kind of puts this interface just sits it right on top of
WordPress and takes up the entire space so you could just focus on creating your course
so the way courses are structured is pretty simple you have lessons and you organize your
lessons into sections and really couldn’t be any more easier than that so we have some
buttons here and the first one says section so when I click on this it just added a new
section right there so I can hover over it like this and I can but this I can change
the name of the section to whatever I wants and then right here I can click on new lesson
and guess what it puts it right there and I can organize these and rearrange these super
easy so there is lesson one and if I click on new lesson there’s lesson two in lesson
three so now I can go right here and I can just rearrange my lessons just like that isn’t
that isn’t that nice know when I hover over the lesson are right underneath the lesson
should I say you have these little status indicators and so these are gonna let you
know if certain things are going on with the particular lesson so right here is enrolled
students only if there’s prerequisites are not there’s prerequisites of for the calendar
right here if there’s a quiz tied to the lesson and then right here it’s let me know there
is no content so as you start adding things like this to this particular lesson you’re
going to see these be highlighted and those are just little visual indicators and then
also when you hover over a lesson you have these options here off to the right so this
is edit lesson and this would be just to start putting some content in the lesson and then
right here is to add a quiz alright here’s to open the WordPress editor view lesson shift
down so this would be to move this down if you wanted to move up to a section move down
to the section right here is to detach it from the module itself and you can just trash
the lesson entirely so let me go ahead and add another section let me add three lessons
to that, go ahead and fill this out right now by just hovering over and changing the
names of each of these to make sense okay so I’ve gone ahead and set this all up right
here so I have this section I named it course marketing and I just threw whatever came into
my mind and whoops it looks like I didn’t do this one right okay so I’ve gone ahead
and set this all up I have these two sections and I have three lessons in each section Micah
said you can easily move this around so here’s course marketing if I wanted that to be the
second thing I can just move it up there and if I wanted to be the first I can move it
there in the same goes for these different sections so if I wanted this to be the first
section I can just left it up there like that and now becomes the first section just like
that if you wanted to say you had a really big course and sometimes you can probably
start to have big courses I can go ahead and click on collapse all so if I had say 10 different
sections I I could just easily move them around by collapsing the mall or expanding them all
Sonoma to go ahead and save this and then I’m going to exit the course builder and we
can go here to the front end and do a refresh and see how this is looking so now we start
to have this syllabus don’t worry work in a soup for supper to make this look even better
than it’s it’s actually looking not bad but we’ve got got big plans for this of this is
how were looking right now so now let’s take a look at the lessons for LifterLMS or for
this course so you can just jump right here to lessons if you wanted to let’s go ahead
and do that in your to see that list of lessons that I created now you can go into that course
builder and open up lessons in a new tab in your web browser that’s typically what I will
do or you can just come here to lessons and you can see if you have multiple courses you
can just filter these lessons by particular courses you can make this look however you
wanted to look let’s go ahead and look at the anatomy of a lesson right now let’s go
ahead and start with the first lesson which was course ideas so your course has a title
in here is the content area for your course now here is the different settings that LifterLMS
gives you for courses the first option here is to embed a video in this support something
called WordPress all in bed essentially with that means you can just put a link to the
video and it should work fine so that would include Wistia video YouTube there’s a whole
list of different video providers I actually don’t use this I just go ahead and I put my
video embed code right here into the content and the reason why is because this doesn’t
support the video player I use which is fine I use a video player called VooPlayer it’s
just some kind of oddball video hosting platform so instead of putting a link in here to that
I just go ahead and I put my embed code right in here so I just put a link to a YouTube
video in my clipboard and I can just go ahead and paste it right there and that’s what that
all embed service does or feature of WordPress you just put a link in and then bam it does
everything for you and then you can go underneath it and you can start putting some course content
right here this is all just standard WordPress content at this point she can go ahead and
pop that in so that’s gonna be video and audio I don’t use it if you wanted to make this
lesson free you can do that you can just toggle this right here here’s where you would set
prerequisites I’m not gonna do that I never usually do that but you may want to set prerequisites
right here so you have your drip settings so this is very easy to enable you to do it
on a specific date you can do it a specific time period after enrollment or after a course
start date so here are your options with dripping and if you want to attach a quiz to this lesson
all you have to do is go ahead and turn it on right here now there is something interesting
and that’s called the excerpt so I can put a little bit of info right here and on the
course syllabus it will appear underneath the lesson title so for videos I like to put
video length and then put that out the length of the video there so a student will have
an idea how long these various videos are some go ahead and enter that now okay so you
can put less in length or video length probably video length makes more sense I think that’s
the exact terminology I tend to use but for here I just put less in length and I put four
hours and 30 minutes because that’s this crazy video is that long can you believe it now
the rest of these options you’re pretty much not to need we have comments turned off on
the lesson here and right here is execute any you can jump back into the course builder
if you wanted to from any lesson and right here you can see where this lesson fits in
the course that it’s in in the module that it’s in our this section that it’s and I really
like out has all that info there so go ahead and click on updates and then I’m gonna look
at the front end of the websites and then I went to do a quick refresh and we can see
how that’s looking to see how here’s my title and then now it’s is less in length I like
having that little spot there that little extra bit of information I wanted to make
sure you new how to actually put that in there okay not but if I clicked on it let’s see
what happens when I click on it here is how the lesson looks right now working to change
all of this it in a moment but this is how it looks now there’s my nice big video and
then here’s my navigation to go to the next lesson or the previous lesson right so that
is lessons for LifterLMS like everything to be symmetrical here’s a link to actually take
me back to the course index page like everything to be symmetrical so I would actually put
less in length on every single lesson so everything every lesson kinda takes up the same amount
of space and it just kind of all looks perfect and even so so far we’ve gotten through a
lot we have created our first course we created two modules and we created three lessons for
each module we learned how to use the course builder and we learned all the settings for
a course minus the payment part that’s going to be coming up and we learn the course builder
and and all the various settings for lessons we saw where you can enable drip content prerequisites
quizzes all of that we’ve already gotten through a whole lot now let’s take a look at what’s
involved in setting up a membership so I should’ve backed up a little bit when you first install
and activate LifterLMS obviously kicked us into that walk-through on boarding process
but which you might not have noticed it added five different menu items I wish it didn’t
had five it’s a lot but you know that’s all right so LifterLMS is as you could be your
main settings panel in your reporting right here if you’re importing or exporting status
add-ons hears for courses and that’s can also contain lessons categories all that kind of
stuff reviews it’s all to be organized here under courses then we have the same option
for membership sorry to jump in there in a moment we have engagements this is gonna be
your communication notification certificates emails orders this is where you see all the
orders you can use this area to create coupons create vouchers and see if people are using
those coupons and those vouchers organ hit all of that but next working to go into memberships
so a membership can be a course bundle or can be a single course and other parts of
your website that you want to protect like maybe dedicated downloads page and you are
creating a page here you want to secure that with the membership there’s lots of different
things you can do with memberships the way I use it as I bundle different courses together
as membership packages okay some to go ahead and click on add membership and this is gonna
look a lot like some of the settings you’ve already seen all you need to do is pop in
a membership name and then right here you’re gonna put the description for someone that
is a member and here’s a description for someone that is not a member then right here is the
restriction option and this is going to be what’s going to happen if someone tries to
go to a page that the membership function of LifterLMS is protecting so they don’t have
access what you want to do when someone does that so say you have a downloads page and
someone send that link to someone else will that someone else is not a member that someone
else is not enrolled what can happen when that someone else goes to that link what you
gonna do with that person so here it is it’s the restricted access redirect now if you’re
using a page builder on that secured page you’re pretty much going to want to use one
of these redirect options so here they are redirect to this membership page so this could
be the page were you telling them you’re making the sales pitch to buy the membership or become
a member a member also you might want to redirect them here I think that really makes the most
logical sense or redirect to a specific WordPress page or redirect to a specific custom URL
so you might want to redirect them to the members dashboard where they can just log
in so it’s up to you what you want to choose him to just go ahead and redirect to this
membership page right there and here’s an option if you want to display a message when
someone goes to a page that they don’t have access to you can do something like that as
well here is auto enrollment so this is how you can it give someone access to courses
if they are a member so you can do this auto enrollment right here so right here’s where
I’m going to add the course so I can click right here I only have one course and it just
pops right on up if you had more you just start entering in some characters and it will
filter out the list I can just click on right there and now what happens is when someone
becomes a member in this membership there can automatically be enrolled in all the courses
that I may list here sorry hearing to set up an axis plan working to actually do that
next arena set up a the payment access plan for the membership and for the course and
that’s pretty much it we might want to disable comments like I said you can add multiple
instructors if you wanted to do that and that’s pretty much all there is there’s no course
builder because were just creating this membership some to go ahead and fill this out right so
I named it platinum member just like that, go ahead and click on publish and we just
created a membership now obviously we need to add the options to actually pay for the
course or pay for the membership website and print the info there that’s okay though let’s
go ahead and see what this looks like I’m sure it’s not to look pretty at all because
we didn’t add any content but that’s okay working to get to that in a moment but first
let me show you something really cool about memberships and it’s very important I’m in
a show you how to secure any page or any post and make it only viewable if someone happens
to be one of these platinum members my click on posts right here and when we installed
this Astra Sites it added these three blog posts so just click on this one this one right
here in the bottom check this out when I scroll down we have something right here in this
is going to be added to any page or post this option and it says membership access so if
I wanted to restrict this to a membership I can click right here and then right here
I can choose the membership so I had multiple memberships then I can choose which membership
packages have access to this content guys this is awesome stuff right here this is something
that you normally would have to pay one or $200 per year for a specific dedicated plug-in
but you get it all in this one integrated system some to go ahead and watch they only
have the one membership I’m in a click that right there and so now only people that are
active platinum members will be able to see this content so I’ll just scroll up and click
on update so now our plan the members are auto enrolled in the course and they are given
access to certain areas of the website that is only for them because their members and
membership has its privileges okay so now it’s time to add this payment gateway and
configure that for the courses and configure that for the membership now like I said if
you don’t have the resources to get one of these payment gateways that’s okay I’m in
a show you how to use the voucher system so you can set up vouchers that you can sell
these voucher codes and you could also reference this WooCommerce fast pass tutorial video
that I have and that will teach you how to use WooCommerce as the shopping cart you can
sell with PayPal and stripe with WooCommerce and then you can just issue out or manually
enroll people in various courses that they purchase until you can get one of the integrations
but I have the PayPal one some to go to plug-ins to go to add new and him to go ahead and install
it so click on upload plug-in and here it is right here, go ahead and click on install
now and then activate the PayPal plug-in so this is perfect now that the PayPal plug-in
is installed on this now walk you through the LifterLMS settings which are going to
include this payment gateway and setting that up and then will add it to our course in our
membership and will start looking at other areas of LifterLMS and then want to start
making element LifterLMS look really good so I’m to go to right here in a minute click
on settings so here’s our main settings panel for LifterLMS it’s a provides a quick snapshot
right here of your enrollments your registrations your net sales and lessons completed for the
week now there’s deeper reporting options this is just a real nice way of glancing at
everything some to go ahead and go through these and in the process working to set up
that PayPal payment gateway so first let’s click on the courses option right here first
you can choose to enable or disable the retake lessons so when someone’s going through course
they can mark lessons as complete and sometimes people might accidentally mark the lesson
completes and then their progress is all kind of out of wax you might want to check on this
box to give your students that option next is the catalog settings now for courses and
for memberships you have to have a specific page on your site that you link up as the
catalog and the catalog is if you have more than one web more than one course available
it will show those courses in a grid so that’s called your course catalog now when we did
this default on boarding experience with LifterLMS it automatically chose this course is page
but I probably don’t want that so the courses page prior was designed in Elementor now if
you also then going here and then assign a the that Elementor design page as your course
page it starts to become a problem let me show you what I mean if I click on courses
look it’s not in a look right here’s all that Elementor content and it just doesn’t look
right and then here’s the LifterLMS content it just does not look right so we need to
work around that we need to do the same thing for memberships so here are your options with
the courses if you just can I have one course you probably don’t want to send anyone on
this course catalog page because there’s just one course there you’re going to probably
want to go and create a separate page assign it to be the course catalog page and then
just don’t ever send anyone there and LifterLMS requires that for to work properly the same
thing goes for memberships your Mike you might want to do it that way if but if you’re like
me I have a whole grid of courses but here’s the thing even when you’re on my website and
you see a grid of the courses I have available I am not using what LifterLMS designed for
that there’s nothing wrong with what LifterLMS designs for this page that’s can list out
all your courses it just I like to design it myself and Elementor you can have both
so what I do is I create a separate page that I sign is the course catalog a separate page
that I sign is the membership catalog and I don’t ever send anyone to it and that’s
why when you look at my course index page on my website it looks beautiful and as I
did with Elementor someone actually just go ahead and do that now I want to go to pages
and I’m going to go ahead and him and it creates two pages to create one that says membership
actually I just need to do it already created a membership when I just really need to do
it for the courses so let me just go ahead and do that now Minna called this course library
just like that, click on publish just like that now I’m going to jump back into LifterLMS
I’m in a click on courses just like this and that that new page I created I’m been assigned
that as a course catalog so here is courses in their discourse library and let me click
on save changes now let me show you what that page looks like so many go to pages again
I’m to show you the course library this is a page I just created and I’m in a show you
the my courses actually not the my courses the courses this is what we had created in
Elementor so here is the courses page it is now back to what was done with Elementor right
and it had this Elementor design and here is the course library page that I signed to
be for LifterLMS and so if I had say six courses it would show two rows of three courses each
for total grid and it would show the six courses just like this now if you ever have a problem
where your changing what you’ve assigned as this course catalog page sometimes a simple
fix that I’ve noticed is if you just disable and then reenable LifterLMS it’ll start working
I have had problems from time to time when I am in LifterLMS and I’m in the settings
right here and I go to change this but then it doesn’t look like it goes into effect sometime
a simple disabling and re-enabling LifterLMS you don’t lose anything it’ll make that setting
change take effect okay right so I wanted this retake lessons option right here’s just
options of how many courses to actually show on this page right here and I have it set
to just the default here nine on the memberships it’s gonna look very similar so right here’s
an option to restrict the entire site to a membership I don’t want to do that but some
people might want to do that all right here is the membership page that was the one that
the onboarding experience created for me I’m gonna leave that I’m to leave actually all
of this just the way it is let’s go ahead and take a look at the accounts option right
here so the first option is going to be which page is going to be your membership dashboard
and this was actually automatically created for us so let me go here and kind of show
you what that looks like our rates and it was right here my courses now let me go ahead
and view that and so this is what it looks like right now don’t worry working to make
this whole thing look better a lot prettier but this is what it looks like right now you
may not want the page name to my courses for me might be I know what I uses members dashboard
so it’s up to you to name that whatever you want you can just go here this is what LifterLMS
created by default someone actually go ahead and change this to members dashboard I just
like the way that sounds better okay so I’ve entered that in and then what you need to
do is you need to copy this into your clipboard and you need to change the Permalink that’s
this little slug piece right here and you do that by clicking on edits replacing that
with this text click on okay and it’s can a formatted properly for you and then click
on update and so now I’ve changed it to members dashboard so now when I open this up you can
see right here it’s his members dashboard and I have it here I guess I need to add a
link in here to the members dashboard something I will do here in a moment so that is the
members dashboard that is right here now these are just the various tabs that you saw and
we don’t want to mess with any of those really those all the way that they are so now let’s
look at this user information option okay so first is this default option here to disable
usernames this actually pretty good this means when someone wants to log into your website
they’ll do it based on their email address this is something that’s actually very good
to leave checks checked it’s going to create support headaches for you sometimes if you
allow people to do both just make it so they have to use their email here’s this password
strength option I don’t actually like this I kinda find it annoying so this makes someone
it makes its own summons creating a password for their account they have all these requirements
and restrictions of using strange characters I think that is a usability issue even though
it’s good for security it’s just that I mean this isn’t Nassar anything this is just a
course website so there isn’t some need to force or cram all this password shrink down
your students throats is just something to get them frustrated there’s an option to add
a terms and condition page and force your students to agree to them when they sign up
here is where we can enable or D there disable or require certain checkout fields so obviously
you’re gonna want first name last name I don’t know why they have address as required for
me I don’t I don’t actually want to ask it at all I don’t need someone’s address so I
don’t make it optional I instead make that hidden same thing for the phone number I make
that hidden but you have these options here to require someone to give that to you when
they sign up right here’s to send an email archive not send an email this is to have
an email confirmation field that’s actually good to eliminate people from hindering typos
they have to actually enter it in twice that’s up to you though if you want that on or not
now here’s some interesting settings that I actually use on my website so this says
if I check on this box if someone goes to visit the my dashboard page they don’t have
an account this will give them the option to register for an account when there on that
page and you have those same information options here so for me I leave that is required I
hide the address I hide the phone number and I like this email confirmation and this is
why I do it it’s for the voucher access so if I gave someone access to course via a voucher
I say go to the membership dashboard and when you go there you’re going to be able to create
an account right here open registration. Be able to create it and then enter in that voucher
code in your to get access to everything so you might want to actually make this a requirement
actually that would actually make sense that’s probably how I have it set up now lastly we
have these options if a user is already in the system the student and they will they
go to their dashboard and they want to update their account fields this is where you give
them the option to do that so I will put for the address I’ll make that optional and the
phone number hey maybe I’ll let someone give me their address and phone number there although
I can I don’t have any need for it but you might in your business some to go ahead and
click on save changes and now we’ve gone through the accounts so here’s were working to go
through all of the payment stuff and that’s in the checkout settings panel so let’s go
through through the settings now so the checkout page that the onboarding experience created
is a page name purchase salami actually go to pages right here and see if we can see
that page and looks like it’s right here and it’s tagged as the LifterLMS check out and
that’s the checkout page right there okay so that is what was automatically created
for you there’s an option to force SSL if Yorty have an SSL certificate on your entire
website you don’t need to force SSL on the checkout and then here’s an option to retry
failed payments through those currency options that we went through on the onboarding experience
we actually already did that but you can go here and to change them if you might’ve entered
them in wrong so here’s the payment gateways now your old legacy PayPal if you have the
PayPal extension installed and activated so when I check on this box like this now PayPal
is going to be an option and I can create some access plans so right here we can name
it the title this is what your your users can see when they checked out and this is
the description that the ring to see on checkouts you can make it say whatever you wanted to
say display orders if you’re also then use striping you might want striped to be the
first option or PayPal you have those options right there here is if you want to enable
the PayPal sandbox this is for testing and then right here’s where you need to go and
pop in your API for PayPal right here the username the password in the signature now
you have to have A depending on age your PayPal account you might have to have a business
PayPal account it’s very simple and easy to get your gonna want the API credentials once
you have that account in place but some older PayPal accounts like maybe from before 2010
you didn’t actually have this requirement of having a business PayPal account so you
can just go into the settings and grab your API your username and your password and your
signature for the API just like that and pop that in here’s some information and invoice
prefix a page style so what happens is someone’s going to click on order now or by for the
course and it’s good to go to the checkout page and they actually complete the purchase
on PayPal’s website if you’re using stripe it’ll all be on your website but it will take
them to PayPal’s website you can have a separate page style for that check out that’s a PayPal
thing you can learn about it by clicking on the link right there now if you want to use
PayPal for reoccurring payments you have to contact PayPal and get this thing called reference
transactions enabled on your account you’re going have to contact them in your and have
to get them to do that and then once that’s done you can click on this check now and it’s
going to go ahead lifters can it go and just verify everything set up right and you have
reference transactions enabled that’s just something you’ll have to do here’s that manual
payment gateway that we had I can that he leave it enabled or disabled it I’ll just
leave that enabled for now I’ll go ahead and click on save changes and now we done our
check out so in a moment working to go and create the payment options for that course
and that membership number and make everything look pretty okay so here is our engagements
and so this is where working to set our email settings so this’ll be the sender name so
right here you might want to put your name or however you like to put your name on emails
that go out and right here is the email address you want use that goes out now you get these
email templates with LifterLMS there great urinal probably want to upload a header image
or like a logo or something like that and you can also edit the footer text of those
emails right here and then here some options with certificates essentially you can use
your own background image designs are for certificates you just need to set the proper
with and height of those images and you can just put those in a go ahead and click on
save changes actually let me fill this out properly okay have gone ahead and fill that
out properly and saved it now let’s take a look at notifications so these are some of
the notifications that LifterLMS uses now it has this notification option or feature
where it’ll just kind of you like to overlay on the website when someone earns something
and it triggers one of these notifications but you also have email notifications to have
these settings all right here so in achievement and this is a very common notification someone
will get so I can click right here to configure it it takes me right here in this is it basically
it’s going to use the achievement badge we haven’t talked about achievements the title
and the content and you can change this template and make it look different for you to go back
to all notifications it’s go to a more practical one so how whatever enrollment so let’s click
on email and will look at that enrollment email so right here it’s going to be the subject
of the emails going to be their name enrolled in and then right here it’s can be the title
of the course here is the heading and here is the content of the body so that’s can be
one of the notifications that ends up going out just you know these are notifications
that this is a notification that goes to you okay so that is some notifications and various
other notifications here I just wanted to show you that it’s pretty easy to change and
make work the way that you wanted to work let’s Leslie took it take a look at integrations
and so these are so these two integrations are BB press that’s adding a user form to
your website I’m looking to go over that in this video I think one day I should make a
video on implementing BB press not just in the LifterLMS framework but just in general
and then right here for a buddy press this is more of making your website a social network
I really never recommend anyone using buddy press it’s just a complicated beast and I
would recommend to people not to use it okay so these are our settings right here reporting’s
pretty basic you go in there and you can see all kinds of reports and graphs and everything
based on students courses quizzes cells and enrollments it’s actually very useful you
can search there’s a lot of cool things you can do there all right some to go back into
my courses because I want to start selling this course and I need to create an access
plan for it so here we are in the course to scroll down and here we are course axis plans
and this is where your to set up the pricing for your courses and this is actually where
you would actually set up your course of for free enrollment if that is something that
you wanted to do as well so what we need to do is click on add access plan and it gives
us these options right here so here’s our options are plan title if you wanted to add
askew you can if you wanted to add text to the enrollment button you can what you you
need to actually and here are some common phrases people might put in there I usually
just put enroll in this course here’s the visibility of this pricing plans you can actually
have this pricing plan be hidden if you wanted to and if you wanted it side-by-side up with
other pricing plans you can make this one kind of stand out by making it the featured
pricing plan right here you can market this a free so what this does is you still have
to create a pricing plan for free course because you might want them to enroll in that course
and this is how you would do it so someone would see it’s free they click on it and they
can still check out even though it’s not gonna require any information right here’s where
you’re put the cost of the course and right here is if it is a one time payment or if
it’s every month every week every year you can enter that right here and you have different
time intervals like this so if I clicked on every it reveals more options so it can be
saved every month like this and let’s say for 12 months so let’s just say this course
is $99 per month there to be charged every month 12 months just like that okay so right
here we have access expiration so you can make this course only available for life for
specific period of time or a specific cutoff date you have those options here hope you’re
seeing how keep these options are because that’s exactly what they are you can do trials
this would be if you wanted it to be say one dollar for one week or something like that
sore one day so maybe it’s it’s a dollar for a day or week and then this regular pricing
starts to kick in you can also have sale prices right here go on sale and you can set a date
for the sale right here this is actually a feature that I should probably use more myself
lastly I want to show you a really cool feature and then I went to fill a couple of these
out and show you how they work and that’s right here this plan availability so remember
I said we made that membership and I set it up so as a member they could take an auto
enroll them in a course well on my website I actually don’t do it that way what I do
is I set up a special pricing plan for members and the cost of enrollment is zero so essentially
you could have separate pricing for members you can give them enrollment for free where
everyone else has to pay a price that’s how I do it or maybe you can discount your courses
by 50% or something like that for your members this is a feature that I use all of the time
for my courses is given this members an option to enroll for free so that’s another way that
you can leverage the membership function so okay him to go ahead and set up this access
plan so essentially you can set up multiple access plans for each course and for each
membership so you might want an example is you might what that example of the lump sum
payment or the payment spread out over 12 months so there’s all these various options
that you can do some to go ahead and set up three of them now okay so one thing you’re
gonna want to do and I’ve learned this a long time ago through trial and error what happens
is after you create or start filling out one of these access plans you’re gonna want to
click right here it says save axis plans you’re not gonna want to click right here where it
says update you need to save the axis plan first so I created two axis plans a full payment
of three payments let’s take a quick look at these so with the full payment I just named
it full payment I made it $999 one payment lifetime access and I made my button say enroll
now okay so that is this woman let me show you the next one this is where I made it a
three payment plan maybe I should name that plan whatever okay and roll now for the button
text it’s 399 every month for three months so you make a little bit more if someone goes
this round but it’s less of a burden and one lump sum for the person that’s enrolling okay
some to go ahead and click on update and then let’s take a look at what this looks like
so far okay so we are getting there so here we go we’ve got our full payment right here
and we got our three payments just hope you’re just noticing right out of the box where it’s
hard because you’re not seeing LifterLMS installed on a different theme but if you were one at
all be looking like this I mean this actually has a long way to go but it looks great already
and we’ve already accomplished so much in this this video so far so here’s our syllabus
here is our pricing check this out with someone clicks on save this repayment click on enroll
now this is what the checkouts gonna look like actually is, look a little different
I’m logged in that’s why looks this way maybe I’ll open this up in the incognito window
but you can see it just looks beautiful it just looks beautiful here’s our payment options
here is all the information on the payments and just looking really good already’s let
me go back right here and let me go back to my course right here so we’ve already done
a lot we’ve created a course we created sections for the course lessons and for the course
we’ve gone ahead and created a payment plan of for that course we’ve done so much now
let’s go and take a quick look at the memberships the membership is going to be the same exact
way of creating a payment plan that I just showed you for course you just click on add
a nexus plan and fill this out it’s the exact same thing so there’s nothing different there
so let’s move forward and go to vouchers so I’m in a go to orders and then vouchers this
is the way vouchers work you click add a voucher and here you would name your voucher so what
I like to do is either if it’s just for one course I’ll name it that one course but if
it’s gonna be a bundle of courses or membership I might give it a different name so me just
go ahead and give this the same name as my course okay now that I have that in I need
to select the course that this voucher code is going to give someone access to obviously
only have the one course so that’s what I meant to choose but this is where you can
set up course bundles that you would issue out with a voucher code or a membership you
can do that as well now this tab break your skin to show you vouchers that people redeemed
we don’t have that yet some to go ahead and click on publish and then it’s going to publish
that now we can actually generate some voucher codes so right here you can say how many vouchers
you want to create and then to how many times can someone use that voucher code so just
for an example and then enter 10 right here and then I’m can enter one this is going to
generate 10 voucher codes that can only be used one time, click on add and then here’s
my voucher codes and it shows me how many times those voucher codes have been used now
this doesn’t actually save until you click on update so if you don’t save it then click
on update you lose all these voucher codes and right here you could see voucher codes
that were actually redeemed obviously there aren’t any redemptions just yet but there
they are so right here you would then export the vouchers to a CSV file and you can start
issuing those out so this is what I was saying how if you didn’t have the resources to purchase
a payment extension for LifterLMS you could still sell your courses you just need to do
it through this voucher system or you can manually enroll students in various courses
okay so now what working to do is working to make things look better I want to soup
up the style of this website to show you how I kind of like to make my courses look so
first let me go ahead and him and I jump into this lesson right here and then I’m in a jump
into the customizer for the theme right here and now because we have a LifterLMS installed
on this website we have a bunch of options that are going to be specific to LifterLMS
so the first thing I want to do is I want to go actually to the layout to the container
and I’m been a change the container from full width contained I’m been a change that to
content box like this okay and then for right here, do the same thing for my blog posts
on it actually it’s already box that’s good but I’m going to change the content box then
I’m in a change that the content box to just like that and leave pages alone just like
that and okay so that’s going to be my container next I want to change the sidebar option right
here and when I scroll down I have options specific to LifterLMS so for my courses I’m
going to go no sidebar and for all my lifter stuff I’m in a go no sidebar and that immediately
made this video a lot larger because it’s now using the full width so were getting their
getting there now there’s other options that you can do with the Astra Theme especially
the paid Astra Theme but this is how I want to style it right now so I’m in a go in a
minute change a color to change this color right here for the background of the body
and that’s it right here so I have my color code it’s really just going to be an awful
white and watch what happens when I add this there it is and you can see now we have this
lesson it’s kind of framed in here and I really like the way this ends up looking like this
in case someone to go ahead and let’s go ahead and click on publish signals publish I want
you to see it and how it’s gonna look him to just quickly jump out of the customizer
and so were getting there so now I really like this kind of a distraction free environment
where someone can just focus on the content here they can jump they you know I was debating
do learners actually need that sidebar with the course navigation or does it just kind
of overwhelm or complicate things where they could just be here and invest just in the
lesson they can always click this link right here and go back to the course index page
here they can go to the prior lesson here they can go to the next lesson I just kind
of really like the minimalistic elegance and simplicity that you see right here okay I
want to go back to the course index right here and make some changes to the colors here
for the syllabus now I have a little bit of custom CSS that I have I have a link in the
video description box it’s gonna take you over to my website you can just copy and paste
this little snippet of CSS it’s going to make little tweaks that I think are going to make
it look the website just look at better so, go ahead and click on customize and there’s
an option in the customizer that says additional CSS which is in a copy and paste it now here
is that additional CSS and I’m trying to do a very good job of kind of documenting what
it does so this one’s going to remove some meta-items right here in Al try to show you
what that is here it’s gonna change the way the course title looks when you’re looking
at the list of courses here it’s going to modifies some dashboard colors right here
right here it’s going to hide the title on the dashboard page these are just some of
the snippets that I like this is going to change the color in the hover color on the
syllabus so this is where you would change it to your color code right here and right
here in any of these were there showing the color here is the color code to change it
to and this is just that off-white color that I’ve been using and then here’s can I hide
some things from the members dashboard someone just highlight copy this and just paste it
right here into the customizer and do a quick publish just like that okay so now you’re
gonna see what happened was the background color here changed in now it’s matching that
color I put on the outside of the container and then I made it so when you hover it it
actually means it makes it white before it was making it like a brown and so that’s just
one of the tweaks that I have in the CSS right here where was that here it is the syllabus
lesson background color so this is the color when you’re not hovering this is the cover
when you are hovering in there you have it this is exactly how I have it looking on my
website and then I cleaned some other stuff up here as well okay so me get out of the
customizer and you can see right here it’s already looking a lot cleaner with this syllabus
and all of that and also let’s go ahead and add that shortcut to the members dashboard
in the menu here so many go back into the customizer like this and you can add menu
items there and that’s what I’m going to do right now okay soma go to menu here’s my menu
in a minute click on add item and there is the members ’96 boredom the click on the
plus and it added the members dashboard option right there let me click on add items in there
it is members dashboard and then I’m in a go ahead and click on publish just like that
okay so now I’m in a get out of the customizer and so now it’s click on members dashboard
to see how that looks and looks a lot cleaner now and we have our icons here for all the
various administrative things that you want to make available to someone so not to show
you how to manually enroll in a course or enroll someone so I’m in a go here and I’m
in a go to courses I’m in a click on my course I’m going to scroll all the way down and right
here I can go ahead and do a search for enrolled students it’s going to show me there with
their enrolled in their progress and all that kind of stuff the last lesson that they were
on and how did they even get in the course and right here you can actually enroll students
so I’m actually the only user so far on this website I’m in the click there click on enroll
students and now we have a student in the clip in this course I’ll go ahead and click
on update alright so now when I refresh my members dashboard since I’m now enrolled in
a course we might see something that looks a little different and there it is here is
a list of my courses there is my notification congratulating me for being enrolled in this
course now the dashboard will only show your students the three of the courses they’re
enrolled in they would actually need to click on my courses to see all the courses that
they are enrolled in but doesn’t this look good so far so now I can just click right
here right there and it’s gonna take me right on into the course here it’s showing might
me their progress that I am in on the course and all of this right here okay doesn’t that
look good it does look good but there’s a whole lot more that we can do with LifterLMS
and were going to take a look at that right now so let’s talk about Astra Pro for a moment
so aster pros can add some additional features you already know Astra Pro it’s a this $59
professional version for astronauts can add these things distraction free learning it’s
going to add the profile picture in the header which is really cool when I have to show you
that it’s also can add that distraction free check out it’s going to allow you to have
your my account page in tabs it’s going to give you some course grid control I don’t
actually use the course grid personally it is also to give you some additional visual
control so let’s go ahead and install the professional version of Astra just so we can
see how it looks and like I said this is not a requirement but it’s definitely something
to keep in mind some to go here and click on the website them in a go to plug-ins add
new and I’m in a go ahead and upload this plug-in by clicking upload plug-ins and then
I’m in a drag and drop it right here so the Pro version of Astra it’s a plug-in that works
alongside with your Astra Theme some to go ahead and install this now what happens is
when you install Astra Pro like this will just go ahead and activated your really not
to see anything different or anything changed this is what we need to do we actually need
to enable what features we want with Astor Pro summit click on appearance and now click
on Astra and here it is so here is it says add-ons to go ahead and click on that now
what I specifically want is this LifterLMS add-ons so I’m going to activate that hoops
I double clicked it to activate that and there’s all these other options that come with the
Astra Pro but I only want to really look at this one right now the spacing is nice to
because when were looking at this container for our lessons in this container the spacing
modules can make it easy to adjust this spacing right here you could do it was some custom
CSS if you wanted and look it already automatically enabled the distraction free learning you
notice I’m in a course and it removed the options right here for that that would be
distracting on a normal normal situation so here is what a lesson looks like in the distraction
free learning I just think it looks great here’s my more complete button I have that
available now because I am in rolled in the course you can see that before and this will
take you to the next or previous lesson also in your student marks a lesson complete it’s
going to go ahead and put them inside of the next lesson I just like the elegance and simplicity
that you see here this actually pulls from Gravatar if I had my correct email in here
it would work there let me go ahead and do that right now okay so now when I refresh
I just change the email address on my account with this WordPress website to the email address
that has a Gravatar at that image attached to it and you can see there it is now in your
students actually click on the image it’s going to go ahead and put them into the dashboard
swimming go into the customizer to show you that you have additional options that only
come with Astra Pro someone to go ahead and click on customize remember to get Astra Pro
visit WPCrafter.com/Astra it will take you to page I have set up that’s can show you
some bonuses that I include if you were to purchase it okay so this is the members dashboard
I believe this will be under layout and then LifterLMS and then general okay let’s see
there you go so for my account I can have a display in tabs this is what it’s gonna
look like see I can have it look that way I actually like this look at better personally
I think it looks a little cleaner so that is an option right there here’s to enable
the distraction of free check out I have to show you that in a moment here’s where you
can control the course columns and the membership columns if you’re looking at the catalog pages
for those okay and then let’s look at our course and lesson options so this is where
we can just through checking a box we can have something completely hidden based upon
whether or not someone’s a student or a visitor I really like that so let’s go ahead and click
on the course index page so we have this right here so I can click on this box here for a
student to enable featured image if I click on that now I just have my one image right
there just like that okay these the first option you see there is to enable or disable
the distraction free learning so by default it’s enabled in this is what it looks like
or I can check the box and there it is I have it just like that I can hide the course description
I didn’t obviously enter one if you followed along in this video I can enable the meta-information
I didn’t add that the instructor detail I didn’t add that either the progress bar I
really really like the progress bar so this is what looks like without it I like it with
it and here’s where it’s very powerful you get to enable or disable items that are visit
viewable to the visitor so this is the featured image course description and really this syllabus
you there’s no reason to show your syllabus to someone that’s not enrolled in your course
okay so these are the various options there now remember I said we we can adjust this
padding this spacing that is in this frame that’s actually very easy so I can go back
like this I can click on container and then it right here is the spacing for the container
so if I wanted to change that this is the spacing in the container arty know it set
to 40 so let me go ahead and lock all of these together and I’m going to change that to 20
just like that it’s hard to see in this scrunched up a browser like this from it got like 40
I don’t know let’s go ahead and click on publish and then see what it looks like a so here
it is with the default padding there so let’s see what happens when I refresh it oh that’s
not good I think I actually wanted it to be 40 okay so let’s up this the 40 just like
this let’s save its let’s go into the front and let’s do a refresh and I think you look
okay so let’s looking better she can set that to whatever you want you knew have these spin
this spacing control that you didn’t actually have before so now let’s change this from
viewing as myself this actually really need featuring anyone talk about yet with LifterLMS
when you’re setting up your courses in your lessons you can actually view it as a visitor
or as a student with these options right here I’m actually enrolled as a student so I want
to change this to view his visitor so Nelson to show me what this looks like if I was a
visitor see how much cleaner this looks I don’t have any that meta-stuff showing in
all that I just have my big image right here I have my two pricing plans I have the syllabus
but you probably don’t want to show the syllabus and I’ve got some coming up that’s going to
knock your socks off on how to really make amazing pages like this for selling your courses
okay so let’s jump back into the presentation so I just showed you real quick I didn’t spend
too much time on it asked her pro how you get this distraction free learning the profile
picture actually didn’t show you the check out I should show you that real quick but
I showed you all these other options here let me just do that really fast if I click
on enroll now so here’s the distraction free check out you see how just elegant and lean
it looks in and it just hid the entire header went ahead and put the logo in the middle
and this just I mean this is a shopping cart to convert your visitors into students so
that’s good okay one to cover that now let’s talk about something really special that I
have cooked up so the one thing that I’ve never liked about LifterLMS but I’ve got a
solution I’ve never liked the course page because number one it’s really not formatted
to sell of course it’s just showing information in this hierarchy type of format where you
just have normal content and it doesn’t look special it all is just not formatted for selling
I don’t like it at all I’m never liked it and you know I’ve got a solution you have
very limited design control with it one of the biggest gripes was always that it reveals
all your course contents I’m telling you if you’re sitting there pouring your heart and
soul into creating courses in your creating your syllabus in your lessons and all that
kinda good stuff and then someone comes along and sees your syllabus and then they go and
they try to create the same course now that they’ve kind of seen how you break down the
course and it’s part of the secret of your course and it’s going to be part of the secret
of your success why just let someone get that information for free so I’ve never liked how
it reveals all of your course content so the solution is a plug-in that is free and available
to you in the WordPress directory and working to install and activated him to show you how
awesome this is it’s can allow you to use a custom layouts that were built with any
page builder can allow you to use that work and use it with Elementor of course but is
can allow to use this custom layout with any page builder to now be able to build a beautiful
looking sales page to sell your course or your membership notice only one little tricky
part we need to get the payment links so there is and can be this automatic payment button
but we just need to get the link and paste it into our page builder built a template
yearning to see exactly what I mean in a moment I’m so excited about this plug and I had to
ask someone to build it for me and they did it was as matter fact the developers of the
Astra Theme I went to them and I said there’s these big problems with courses can you fix
it and they said sure will fix it just for you so that you can make a video on it and
here we are today okay some to jump back into the back end of the site to go to plug-ins
add new and then I’m in a do a quick search for LifterLMS now it is a new plug-in it’s
right here it’s called custom templates for LifterLMS and I want to show you how it works
go ahead and click on install now and then go ahead and click on activate now what this
plug-in does is very very simple if you go to courses if you go to LifterLMS there’s
a new section here that says custom templates and here we can actually create a custom template
that when were in our course setting we can have it show that instead of showing the default
page that LifterLMS generates so let me show you what I’m talking about so right here instead
of showing this with this image and you don’t really have a lot of control like actually
looks nice because obviously we’ve gone through in this video to make this look really nice
and Astros done what they’ve done but still it’s not really geared towards selling maybe
like a low-cost course but nothing big it’s just not made for that and that’s okay because
working to fix this all right now so let’s go ahead and go ahead and click on add new
and I’m going to name this the same name as the course so it’ll all make sense okay and
then I’m in a go ahead and click on publish right here and it’s going to go ahead and
publish this new custom template next go ahead and we actually have to do this when right
when we create our first template you have to go down here to settings permanent links
and then we just have to go ahead right here and change the permit links to post name and
click on save changes that’s actually something should’ve done earlier in the video that’s
okay make sure it’s on that now if Yorty have it set the post name just go ahead here and
click on save changes it’s gonna reset the perm links that’s kind of what I was after
now let’s go back to where we were to the custom templates were to click right here
and this is where you can now begin to build the template with any page builder but I have
Elementor some to click on edit with Elementor and it’s going to take me right here and what
working to do is I’ve put together a special template for this website and working eight
import it so you can see a download link to its in the video description box right now
when I click on add template you can use any template this is just when I put together
some click on my templates there’s this option right here with the arrow pointing up, click
on import template now all I need to do is just drag and drop and it’s going to go ahead
and import this template right now and there it is it says course cell speech by [email protected]
and go ahead and click on insert and then I’m in a click on yes and it’s going to go
ahead and put this template in there and this is the template that I’ve created so essentially
we have a big video here so you can click on this and Elementor hoops that’s not what
I wanted you can edit this and Elementor by clicking on the edit icon and change it to
a video that you want you can go ahead put your title right here you can put some course
benefits put your course price and then we have this enrolled now button so remember
I said we need the link to the payment page this is how were going to make this work soaring
to go here and these links are essentially the bio links for these individual plans for
this course so say I just wanted to offer the full payment I could right-click here
and I can just copy the link and then what I want to do is when I am in here I want to
make this button take me to the link I just copied so here it is I’m in Elementor and
I just pasted my link in there it is so it’s your domain name/purchase/question plan equals
and then it’s the plan number that was automatically created so now when someone clicks this button
it’s going to take you to the same place as if someone clicked on this a button that’s
because we can replace this whole thing here in a moment okay so you go ahead and probably
want to change it for all of these just like that if you wanted to stick with this template
scrolling down I’m scrolling down okay let’s paste that there so now here’s our template
we’ve got a cell’s video were showing people the benefits we’ve got our price we’ve got
our button right here you can have a reinforcing headline here some info on you the instructor
here’s can be some student testimonials of successful students and here we can add some
frequently asked questions and our final enroll now to go ahead and click on updates and now
many get out of Elementor a minute click hamburger icon and exit back to the dashboard’s and
I’ve created a custom template that I want to show instead of the Dole boring course
page so I’m in a dues on the click on courses and him to go back into that course right
here and that plug-in added this new tab here remember we didn’t have this before is this
description general restricted and reviews now we have custom template swing click right
here and then right here I can choose a custom template will the only one I created was that
when you just saw now you can put membership templates there whatever you want in this
is just a way to have full control over how your courses and memberships are sold this
is the power behind this entire tutorial is what you’re seeing here you can look at many
course platforms that are hosted in the cloud like teachable and course era the do not give
you control over the cells pages of cabinet click on updates all right it’s updating and
I’m in a go here so this is what is a person on your website looking at your course would
see before now see what happens when I click on refresh instead they see this beautiful
gorgeous cells page that you have full control over every aspect of we scroll down we have
all this information here we have our student reviews we have are frequently asked questions
and our final and roll button now this is what happens remember we took the link that
would take someone to the shopping cart to check out we put it in the button so guess
what when I click on this button looks what happens it takes me straight here to check
out so the only kind I gotcha with using one of these custom templates is you have to have
the right payment link now what I could’ve done is if this course because I created those
multiple axis plans I could incorporate may be a pricing table or something like that
into the template to just have a more X easy to understand a pricing grid than what we
were getting the default way and just him and tell me this this looks beautiful I mean
it looks absolutely beautiful okay so that is wrapping up what were going over here on
this old LifterLMS fast pass we went over everything we made a beautiful will we made
a course we made sections for the course we made lessons we added a pricing options for
the course we went ahead and created a membership we looked at vouchers we looked at all of
the settings in the back end of LifterLMS let’s actually jump back there really quick
we looked at all of this we just barely touched on the reporting probably have to make some
follow-up videos on setting up these engagement emails now LifterLMS has really good documentation
on their sites you can go over to their website and check out some of the documentation right
here for checking out you’ll see all your orders you can generate coupons a lot of stuff
is kind of self-explanatory creating a coupon you can do this and create your different
parameters the only thing I think I did not cover so we have our members dashboard we
went ahead and did that hears our members dashboard only thing is this course is tab
right here this is going to that default template that we have here you can what I recommend
is making your if you have more than one course and when someone clicks on courses make it
in your page builder it’s gonna look a lot better and then you’ll just match the links
up to take you to the various course sales pages so you can do that or in this case since
we only have the one course really we can change this courses tab and just have it be
a menu link that’s going to take you directly to the course cells page which is right here
you can do that as well now I’m viewing it as myself if I change it to view as a visitor
it’s going to go ahead and show me that beautiful sales page so you might want to do it that
way there’s so much flexibility it really is now not a LifterLMS thing it’s just a WordPress
thing oh I think lastly what I want to do is show you what happens when someone is not
logged in and clicks on the members dashboard to go ahead and log out really quick and this
will take me to the login form but I’m in a click on back to my blog now someone clicks
on members dashboard and they’re not logged in this is what they’re going to see here
is where they can log into your website so you don’t have to do any hackery to have a
custom login form or anything like that it’s all here for you and here is what we enabled
so some can actually register so this is how they can do it right here and then if they
have a voucher they can feel this out click right here have a voucher and paste in their
voucher code and then click on register and there to be automatically enrolled in whatever
that voucher code would get them so I usually send out an email with instructions to click
here fill this out pop that code in then they are good to go there in their members dashboard
and they will have access to all of their courses so that’s gonna wrap up this LifterLMS
fast pass so I know we’ve covered so much in this video and there’s just a few things
left now here’s the good and the bad news the bad news is I’m going to be ending this
video but the good news is I ready have video tutorials on it and I’m just can add the links
in the video description box down below and so that’s going to be the adding security
with iThemes Security you’re gonna want to do that for sure and then the updrafts backup
I got a video about that as well how to backup your your website off-site it’s going to be
very easy to follow also connecting in the WP mail SMTP this is a very important plug-in
for deliverability of these course receipts and notifications and all that kind of stuff
you’re gonna want to go through that video as well and then of course Yoast SCO actually
they just released version 7 of Yoast SCO and I have a new tutorial on the way but I
would have a link download to the old tutorial hopefully the interface didn’t change that
much I’ve got you covered with all of this stuff and we’ve accomplished so much you are
going to have a website if you’ve made it this far that looks better than all of these
expensive monthly fees services because you could actually have full control and make
this look exactly how you wanted to look to match your brand your personality to have
a look exactly how you want it to look so congratulations to you for making it to the
end of the video making it this far I’ll probably do a follow-up video to this so if and when
I do that I’ll have a link in the video description down below but if you’ve enjoyed this video
in any way I just want to ask you right now to give it a thumbs up of course and maybe
just say hi down in the comment section down below I’d love to hear how this video has
helped you to build an online course website also you’re going to want to subscribe to
the channel normally I asked people to consider subscribing but I’m saying you really should
subscribe why because I do regular AMA videos that ask me anything video so if there’s any
kind of gap or maybe something I’ve left out I want you to know that I am available to
you for that just go ahead and subscribe and you’ll be notified when I do these live videos
and there live you can ask question and I will answer it alive and also the last resource
you might want to go ahead and if you’re on Facebook join the WP Facebook group we have
a lot of conversation going on and there is a real quick way to ask questions and people
that are going through the same process is you are there to support each other and I’m
of course in there and I do private asked me anything videos for the Facebook group
as well so I am proud of you I’m happy for you share this video help me out on the channel
if there’s anything that I talked about the video that had a purchase involved you definitely
gonna want to check out the link so that does I have additional training programs so with
Elementor I have a whole training program with Elementor that you can get for free if
you were to buy Elementor the same goes for Astra as well so I’ve got you covered in every
way congratulations for making it to the end of the video and I will see you in the next
one