How to Make a WordPress Website 2018  – FOR FREE!

How to Make a WordPress Website 2018 – FOR FREE!

August 13, 2019 29 By Bernardo Ryan


If you wanna learn how to make a
Wordpress website, watch this video and I’ll show you how step-by-step using the
element or page builder with WordPress What’s up everyone? It’s Jameson from NYC
Tech Club, and today I’m gonna show you how to make this beautiful and
professional WordPress website step-by-step. And you don’t need to know any type
of coding or programming whatsoever. It’s just gonna be a bunch of drag-and-drop
and copy and paste. And by the end of this video, you’re gonna be able to create whatever type of layouts that you want for your own WordPress website. What we’re gonna do today is learn how to use the Elementor Page Builder and you’re gonna be able to customize your website to look however you want and have whatever type of images or content or whatever layout that you want by the end of this video. So this is the demo website that you’re looking at right now. And you can have your website look exactly like this or what you can do is go in and customize and add whatever you want or delete whatever sections that you don’t want. And I’m gonna show you how to do all that in this video tutorial. So we’re gonna use WordPress to learn how to make our WordPress website. And WordPress is the number one content management system on the internet and there’s a bunch of large companies that run their website using WordPress. So I’m
super excited to show you how to use it. By the end of this video you’re gonna learn how to make demo websites that look just like this. So if you’re a developer or someone that just wants to learn how to make their own WordPress website, keep watching this video because I’m gonna show you how to make a beautiful and professional WordPress website step-by-step using this Elementor Page Builder. And you can see how easy it is to use. All we have to do is just turn it on and we have all of these different elements that we can drag into our WordPress website to create whatever custom layout that we want. And we can also use these pre-made templates right here to create a page really quickly, and then just go in here and just edit the content and the images. And then just
really customize it and make it our own. So if you wanna save thousands of
dollars building out your own WordPress website, then keep watching this video
because I’m gonna show you how to make a WordPress website step-by-step. So if you’re ready I’m ready. Let’s get started. The first thing that we have to do is register a domain and get hosting service. And again, a domain is your web address and the hosting service allows you to run your website and store all of your content. So you really need both of those in order to make a WordPress website. And what I want you to do is come to the text tutorial on “How to Make a WordPress Website-Quick & Easy. So there is a link to this page in the video description and this is the text tutorial for this entire video. So once you’re on this page, what I want you to do is come down to step number one which is “Get Hosting and a Domain,” and you’ll see a link right here to the InMotion website and that’s where we’re gonna go to register our domain and get hosting service. And if you click on this link right here, you’re gonna be able to register a domain for free. So that’s why I want you to click on this link. So go ahead and click on this. And you should be redirected to the InMotion website right here. And again, I want you to go to that link because you’re gonna be able to register a domain for free and you’re gonna get up to 56% off for all of your hosting. And that’s the largest discount that you’ll find on the Internet for Inmotion. And Inmotion is one of the best hosting services available. They’re super fast, really reliable. They’re cheap and they have great customer service, and they give you a really easy way to install WordPress so that you can create your WordPress website. And that’s why I’m gonna recommend them to you. So once you come to this page, what I want you to do is come down here to where it says, “Business Hosting” and we’re gonna hover over the “Learn more” button and just click on that. And once you come to this page, you can see right here that you’re gonna be able to register a domain for free and that’s gonna save you $14.99. And down here, you can see that we have three different plans: the Launch, Power, and Pro Plan. And I recommend the Launch Plan if you’re only gonna make one or two websites but if you wanna make more than one website, then you probably wanna choose the Power Plan because you can host up to six different websites on this plan right here. So what we’re gonna do for this video tutorial since we’re only making one website is we’re gonna select the “Launch” plan. And again, you can select whichever one that you want. But once you’re ready,what I want you to do is hover over “Order now” and then click on the “one year option.” And now what we’re gonna do is register a domain. So what I want you to do is type in the web address that you wanna register right here. So I typed in “nyctechwebby”. And once you’re ready, click on the “Search” button and if you get this notification that says, “Great news, your web address is available” then all you have to do is click on this button right here that says, “Add to cart”. And now you should see the domain added right here and you should see that it’s free. And down here where it says, “Domain privacy” this is just an extra cost and we don’t really need this. So if you want, you can remove this and you can always add it back later. And up here, you can see that you get a really large discount. So this is about 56% OFF. And again this is the largest discount that you can get with InMotion, if you go through the link that I have on the text tutorial. And that is an affiliate link so I do get a small little fee from InMotion but it’s no charge to you. So now we have our hosting and we have our free domain. So what we wanna do when you’re ready is click on the “Continue” button right here. And again, you’re gonna see this notification right here and we don’t need the privacy protection right now so
just make sure that it says, “No thanks” right here and then click on the
continue button. And now what you wanna do is create an account with InMotion. So
type in your email address and once you’re ready click on the continue
button. And now what you wanna do is pause the video so that you can fill
everything out over here for your billing information. So go ahead and do
that on your own. And then once you’re ready, what I want you to do is come down
to the bottom and click on the “Review my order” button. And once you’re ready to
review your order, come down to the bottom to this section right here and
check this box that says, “You’re agree to the terms” and then click on the “Checkout”
button. And once you register your domain and get hosting, what I want you to do is
go to your email inbox. And you should see this email from InMotion called
“Verification required.” And what you want to do is open that up and click on this
link down here to verify your domain. So once you click on this link, you’re gonna
open up a new pop-up and you wanna verify your contact information. And once
you do, you’ll see this notification right here that says, “Contact Information
Verified.” And once you do, we are good to go and we can close out of this. And now
what I want to do is go back to the email inbox to open up the next email
that we need from InMotion. So let me just click “Back” right here. And now what
I want you to do is open up this email from InMotion hosting titled, “Welcome to
InMotion, and you should see some login details right here to your account
management panel. And this is where you can go to access a bunch of stuff but we
don’t need to go in here because we had InMotion install WordPress for us, which
saves a lot of time. So we can just scroll down to the WordPress details
right down here. And this is where we’re gonna go to
login so that we can customize and create our WordPress website. So you
wanna save this information and this link right at the top, this is how you’re
gonna login to your WordPress website. So make sure that you write this down and
save that. And once you’re ready, we can just click on that. And you’ll get this
pop-up right here and you should have the username and password from your
InMotion email. So go ahead and paste that in and then once you’re ready, go
ahead and click on “Remember me” and then click on the “Login” button. And once
you’re logged in, this is your WordPress dashboard. And this is we’re you’re gonna
go to create all your different pages and posts and upload your images and select
your settings and everything. So you’re gonna become very familiar with the
WordPress dashboard as we go through making our WordPress website. So now that
we’re logged in, what I wanna do is move on to the next step which is gonna
be installing the WordPress theme that we’re gonna use. So what I want you
to do is hover over “Appearance” on the left hand side and click on “Themes.” And
once you’re on the Themes page, a theme is a template with a bunch of different
custom options that lets you build out your WordPress website. So we wanna
select a special theme for this WordPress tutorial. So what I want you to
do is click on this “Add new” button right here. And once you come to this page
right here, I wanna search for a theme called, “ocean wp.” So go ahead and type
that in, and you should see the search result right here. So you should see this
theme pop up and if you hover over it, we can just click on “Install.” And once the
theme is installed, let’s just click on the “Activate” button right here. And once
the theme is activated, if you wanna go and check it out, go ahead and click on
“Visit site” and it will open up a new tab. And if we go to it, you can see that your
website looks pretty basic right now but don’t worry because we’re gonna go in
here and customize the look and feel in just a little bit. But right now, what I
wanna do is just move on to the next step. And now what we’re gonna do is
install the required plugins that we need for this WordPress website tutorial.
And plugins are tools that help you customize and build out your entire
WordPress website. So the ones that we want for this website are the elementor
plugin and the ocean extra plugin. So what we can do is just click on this
link right here that says, “Begin installing plugins.” And once you come to
this page right here, let’s just check this box at the top so that you select
both of these plugins and then go into this drop down and select “Install and
then click “Apply.” And once the plugins are installed, we can go and check them
out. So if you hover over plugins, go ahead and click on “Install plugins” and
you should see a list of all your plugins right here. And you can see that
we have the Elementor and the Ocean’ Extra plugin right here. And if you ever
wanna install some additional plugins you can always just click on “Add new” and
if you ever need a plugin for your WordPress website, you can search by
these filters right here or you can type in a keyword and find the plugin that
you can use for your WordPress website. And I’ll let you play around with this
on your own and we do go over this stuff in more detail in our video tutorial on
“How to use WordPress.” So I’ll link you to that video in the video description
but right now what we’re gonna do is just move on to the next step. And now
what we’re gonna do is learn how to make some pages for our WordPress website. So
what I want you to do is hover over “Pages” on the left hand side and then
click on “Add new.” So creating a page is really easy. All you’re gonna do is just
type in the name and page right here. So we’re gonna make a Home page. So I’ll
just type in home right there and we’re gonna come back down here and select
some options in a little bit. And then we’re gonna edit and customize the page
with the Elementor page builder in a little bit. But what I wanna do right
now is just create all the pages that we’re gonna have for our WordPress
website. So once you type in your title for the first page, go ahead and click on
“Publish” right here. And once the page is published, we’re gonna create a few more
pages together and I’m gonna speed this up just a little bit just to save some
time. But go ahead and create whatever pages that you want. So all you have to
do is click on “Add new” and just type in the name of the pages right here and
then click on “Publish.” And we’ll create another page right here, so I’ll type in
blog and then click publish. And we’ll just create two more pages. So click on
“Add new” and we can type in “Services” right here and click “Publish.” And then
we’ll create one more. So I’ll just do “Ad new” one more time and create a
Contact page and then click “Publish” right here. And if you wanna see all of
your pages, what you can do is hover over pages and click on “All pages.” And you
should see a list of all your pages right here and you should see a sample
page right here. And this is made by default when you
install WordPress. So if you want you can click on trash right here to delete this and
now you just have a few pages right here. So now we have all of our pages for
our WordPress website and you can always go and create some additional pages or
change the pages right here. And we’re gonna come back to this page a little
bit later and customize some of these, but now what I wanna do is just move
on to the next step which is gonna be customizing the settings for our
WordPress website. So what I want you to do is hover over “Settings” on the left
hand side and click on “Reading.” And once you’re on the Readings page, what I wanna do is select the Home page and the Blog Post page. So right here, click on “A
static page” and then go into this first drop-down and select the home page that
you just made and then go into the second drop-down and select the blog
post page that you made. And again, if I do go too fast, you can always pause
the video and rewind and re-watch some sections. I am gonna speed this up
because this stuff is pretty easy and I don’t wanna bore you with going over
the same steps over and over again. So once you’re ready, let’s just click on
“Save Changes.” And once those settings are saved, now what I wanna do is change
the permalinks. So again, under settings right here on the left hand side, let’s
click on “Permalinks.” And once you’re on the permalinks page, come down here and
let’s select the “Post name” option. This is good for SEO and just looks a lot
cleaner. And once you’re ready, come down to the bottom and click on “Save Changes.”
And once those settings are saved, and now what I wanna do is add the www. in
front of the domain or web address. So underneath settings, let’s click on
“General.” And once you’re on the general settings page, this is where you can
change the site title. So what we can do is just change this to “Design Studios” or
whatever name that you want for your website and if you wanna put in a
tagline you can or you can delete this. And then right down here where it says,
“WordPress address,” all I wanna do is come in here. Before my domain name, I
wanna type in “www.”and I wanna do the same with the site address. So again just
type in “www.” and make sure that you don’t delete or edit anything else because if
you do, it’s gonna make your site crash and then you’re gonna have to start all
over again. So double and triple check that you just typed in “www.”” in both of
these. And then once you’re ready, come down to the bottom and we’ll just click
on “Save Changes.” And now you should be logged out and all you have to do is
just log back in. So once you’re ready, click login and once you’re logged in
the settings should be saved. And now we’re gonna move on to the next step.
So we can always come back into the custom settings and upload a custom logo
and change our colors and everything. And we can come back and do that a little
bit later but what I wanna do right now is just move on and show you how to
create a header menu so that you have links at the top of your website. So what
I want you to do is hover over “Appearance” and then click on “Menus.” And
once you’re on the Menus page we can just type in a menu name right here. So
I’ll just type in “Header” and then click on the “Create menu” button. And once the
menu is created, now what we wanna do is go into this drop-down right here and
just select the pages that we wanna add to our header menu. So I’m gonna
select all these pages and just click “Add to menu.” And once the items get added
right here, if you want you can click and drag these around to rearrange these to
whatever order that you want. And I’ll probably speed this up a little bit. And
then once you’re ready, come down here and what I want you to do is check this
box for the main menu. So whatever you put in here is gonna show up on the
main menu at the top and then you can create some additional menus for your
footer and if you want a top bar or a different mobile menu, you can just
create those and select where you wanna display these menus. So once you’re
ready, let’s click on “Save Menu.” And once this menu is created, now we have our
header menu and we can create a footer menu really quickly if you want. So let’s
click on “Create a new menu.” And once this popup comes up, we can just type in
footer right here and click on “Create Menu.” And now we wanna add some pages or links to our footer menu. So I’ll do the Home page, About and Contact just for fun and then click on “Add to Menu.” And once these show up, you can rearrange these if you want. And then come down here and
select “Footer” and then click on “Save Menu.” And once the footer menu is saved,
we are good to go. And if you wanna ever edit any of
these items, you can click and expand this and then you can change the navigation
label right here or you can delete this item by clicking on “Remove” right here.
And you can also add custom links if you want by clicking on this and then typing
in the URL and the navigation label right here. And if you wanna edit the
header or footer menu, you can just select them right here and then click on
the “Select” button right here, okay? So pretty much, we are done with the header
and footer menu and you can always come back in here and customize this stuff on
your own. But now what I wanna do is just move on to the next step. And now what we’re gonna do is go
into our Theme Settings and show you how you can customize the look and the feel of the
header menu and also how you can upload your own logo. So what I want you to do on the left hand side is hover over “Appearance” and click on the “Customize” link. Once you’re on the customize page
“you can see there are a bunch of different tabs here for all of your
different theme settings. And what I wanna do is just go through some of these
ones that I think are important and you can always pause the video and go through
these other ones on your own. And I will create a more detailed video that goes
through all of these different tabs. so I’ll link you to that in the video
description once it’s done. So on the right hand side, you can also see that
there is a preview screen and this is what your visitors see right now if they
go to your WordPress website. And if you make any changes to the theme settings,
they’ll show up over here. And once you’re done with all of the theme
settings and the changes, what you want to do is click on the blue button up
here just to save everything, okay? So the first thing that I wanna do is go to
the “Site Identity” tab. So click on that. And what you can do here is change the
site title. So mine says, “Design Studios” and if you upload a logo, it’s gonna
replace this. And I’ll show you how to upload a logo in just a little bit but
if you like the site title, what you can do is just put in whatever name of your
website is right here and you can also add a tagline right here. And if you want
to have a favicon, what you wanna do is upload that by clicking on “Select Image”
right here, and then find that image that you wanna upload. And then once it’s
uploaded, your favicon should show up over here and also next to your web
address on some web browsers right here. Okay? So I’m not gonna make any changes
here so I will just click back, but if you do make changes make sure that
you click on the publish button right here just to save everything.
So once you’re ready, I want you to come down to the “General Options”
tab and click on that. And once you’re on this tab, what we’re going to do is go to
the “General Styling” tab so click on that. And what you can do here is change the
primary color for your WordPress website if you want. So right now, the default
color is this baby blue color and you can see it over here and also whenever
you hover over these links right here. If you wanna change this color, all you
have to do is click on “Select Color” and then you can drag this wheel around to
whatever color that you wanna have. And you can see now that I changed the color, it changes over here and also when I hover over these items right here. So I’m
gonna leave this as the default, but that is how you change the primary color for
your WordPress website and maybe I’ll go back in here and change that a little
bit later. And you can also change the “Hover Primary Color” right here. So that’s
just when you hover over an item like a button, it’s gonna change to this color
right here. So once you’re ready, you can come down to the bottom to the links
color section and if you wanna change the color of your links you can do that
right here. So you can see that they’re a gray color right here and if you hover
over it, it changes to that baby blue color. I’m gonna leave everything as is right
now but this is where you change the link colors. And we can also customize
the header menu link colors in just a little bit also. So I’ll show you how to
do that in a few seconds. So let’s go back and let’s go to the General
Settings tab. So in the General Settings tab, this is where you can go to change
the layout for your pages and posts. And for the pages, what I wanted to do is
select this option right here which is the “Full width” option. So that’s gonna
get rid of that sidebar right here and then for my posts, I’m gonna leave it
just like this so I will have a sidebar, and I’ll show you how to customize that
in just a little bit. So if you like the full width option for your pages, then
just select this one. Otherwise, you can select any of these other options. And
then once you’re ready, we can just click “Back” right here. And what we’re gonna do
is click on the “Publish” button to save everything at the end. So we don’t have
to do that right now and if you want to change the page title or the font or
anything like that, you can click here and then you can do
that here. So you can change the text color and the background color and the
size and everything, but we’re not gonna do that but I did want to point that
out to you. So we’ll just go back and I think that’s
all we’re gonna do for the general options. So we’ll just go back to the main page
right here. And now what we can do is go down to the Typography tab. And
this is where you can go to change all of your different font styles for your
body paragraphs, your headings, your logo, your main menu and everything like that.
So there’s only a few things that I wanna change. So what I wanna do since I’m
gonna have a text logo like this is I wanna change the font. So I’ll go in
here and click on logo. And I’ll just go into the font family drop-down and find
the font that I wanna use which is gonna be called “Permanent marker.” So once
I find that right here, I’ll just click on that and you’ll see that it gets
updated right here. And I can change the font style right here. So I’ll put in 32px. And make sure that you put in px at the end if you change the font size so
that it shows up like this. And if you want you can change the line height or
the letter spacing but I’m pretty happy with it just like this so I’ll just
click back right here. And what I wanna do now is just change the font style for
the main menu since we’re in this section right here. So I’ll click on main
menu and I’m gonna leave the font family as is, but what I wanna do is come into
“Text Transform” and I wanna uppercase everything. And that’s just gonna make
all of these letters uppercase. And if you want, you can change the font size.
I’ll leave that as is. And if you wanna change the letter spacing, you can do
that like this just to give each letter more spacing, so I’ll just put it at 0.5
or 0.4 and that looks pretty good So once you’re ready, we can just click back
right here. And pretty much, that’s all I wanna do for my font styles, but you
can always pause the video and go through these ones on your own. Otherwise, once
you’re ready, let’s click “Back” right here. And now what I wanna do is get rid of
the top bar up here. So if you like this, you can keep it and customize it but
what I wanna do is just come to the “Top Bar” tab and click on that. And I wanna
go into the General tab right here and I just want to uncheck
this box right here to disable the top bar so that it doesn’t show up. And I’m
pretty happy with how that looks. So once you’re ready, if you like that let’s
click back right here, and then let’s go back one more time. And now what we can
do is go down to the Header tab to customize this entire section right here.
So let’s click on this and what I want you to do is go to the General tab right
here and what you can do here is choose the header style that you want. So
there’s a bunch of different options that you can play around with and the
one that I want is the transparent option so if you want you can select
that and then you might see a little border line right here if you want to
get rid of that just uncheck this box right here that says header border
bottom and that’s gonna remove that and if you do have the transparent option
and you want to have a color for your header menu, what you can do is come down
here and click on “Select Color” and then you can choose whatever color that you
want. And you can make this transparent by just dragging this over to the
left-hand side just like this. But what I wanna do is just make this the default
so I’m gonna clear that, but if you wanna play around with that, go ahead
and do that. And then once you’re ready, let’s click on “Back” right here. And now
what we can do is go to the Logo tab. And what you can do here if you have your
own custom logo is you can upload it by clicking on “Select Logo” and then find the
logo that you wanna upload. And if you do use a logo, that’s gonna replace the
site title right here. So if you wanna keep the site title and you wantna
change the font color, you can go in here and just click on “Select Color” and
choose whatever color that you want And I wanna make this white and right now
you won’t be able to see this, but it’ll make more sense once we start making our
different pages. So I also wanna change the hover color. So I wanna make sure
that this is black. So I’m just gonna click this and it should be black. So if
I hover over this, it does turn black. So that’s perfect. And then what I wanna
do is change the text colors right here to black and white also. So let’s go back
right here. And now let’s go to the menu tab and all I want to do here is come
down to where it says, “Main Styling” and I wanna go in here and change the link
color to white. And again, it’s gonna make it hard to see but it’ll make more sense
once we create our pages. So for the hover color, I wanna change
this to black. So I’ll go in here and just change this to black. And if you
wanna get rid of the magnifying glass, you can come down a little bit and you
should see the “Search Icon” section and you can disable this to get rid of this
little icon over here. So I’m gonna leave that unchanged though and just keep that.
And once you’re ready, let’s click “Back.” And now let’s go back one more time. And
the last thing that I wanna do is go and change the copyright over here. So if
you wanna customize the copyright, click on “Footer Bottom” and then you can
go in here and change the copyright to whatever you want. So I wanna delete
this text and type in “NYC Tech Club” right here. So if you want, go ahead and change this.
And once you’re ready, go ahead and click “Back.” And now we are done with our
Theme Settings and if you want, you can always pause the video and play
around with this stuff on your own. And I will have a more detailed video that goes through
all of these different tabs in another video. So I’ll link you to that in the
video description once it’s done. So what I wantna do right now is
just save all of the changes that we made. So once you’re ready, let’s click on
the “Publish” button right here. And once everything is saved, we are good to go.
And now we can move on to the next step. So what I want you to do right now is
exit out of this page by clicking on the “X” button right here. And now you should
be back on the WordPress dashboard. And now what we’re gonna do is learn how to
customize and create all of our different pages for the WordPress
website that we’re making. So what I want you to do is come down to “Pages” on the
left-hand side of your WordPress dashboard And click on “All Pages.” And now
you should be on this page right here with a list of all the pages that you
created. And you can always go and create some additional pages by clicking on “Add
New” right here or what you can do is hover over these and delete them if you
don’t want them. So we’re gonna delete this sample page if you have that
because that’s created by default. So let’s click on “Trash” right here. And once
that page is removed, now what I wanna do is go and show you how to build and
make the Home page. So hover over Home and click on “Edit.” And once you’re on the
Edit Home page, what I want you to do is come down to the OceanWP Settings and
in the main tab, come to where it says, “Content layout” and in this drop-down,
let’s select the “100% Full Width” option and what that’s gonna do is just make the page go from one end all the way to the other. And once you’re ready, let’s just go to the Title tab
and I want to disable the page title for the Home page. So I’ll just click on this right here. And then
what we’re gonna do is go and save this. So let’s click on the “Update”
button right here. And once the page is updated, now what we can do is go into
the Elementor Page Builder and start customizing our page. So click on this
button right here that says, “Edit with Elementor.” And once the page builder
load, you can see that you have a blank canvas right here and this is the home
page that we’re making right now in WordPress. And then on the left hand side
over here, you have a bunch of different widgets and you can just click and drag
these into the Home page and you can sections. So if I click on this, you can
see that you can add a full width row or you can have a row that’s split in half
or any of these other options. And you can add as many different rows as you
want so you can have a bunch of different sections. And that’s how a
bunch of people were making their WordPress websites using the Elementor
Page Builder. But the page builder has improved a lot since a lot of people
started using it. So instead of creating sections on our own and trying to figure
out what looks good, now what we can do is use the templates that the Page
Builder team has created for us. So if we click on this button right here that
says, “Add Template” and you should get this pop-up right here. And if you’re on
the pages tab, then you’ll see a bunch of pre-made templates right here. And these
are all made by the Elementor Design team and they research what makes a good
website and they made all of these professional looking templates for you
to use. So if you like any of these, what you can do is hover over them and click
on it. And you’ll get this preview screen right here. And you can just scroll down
and see what the entire template looks like. And if you likely look in the feel
of it then you can add it to the page that you’re making by clicking on the
“Insert button” on the upper right. And you can always customize these templates so
you can change the photos and all of the content. You can even change the colors
and these sections that are on the
template. So if you don’t like anything
that you see here, you can always delete it and you can always add some additional stuff. So the template is really just a template. It’s a framework that lets you build out your page and makes life a lot easier then using all of the widgets and dragging them in yourself. These are
pre-made. So really, it just helps with the design process of making the
WordPress website that you want. So what we can do is just go back and find a template that you wanna use. So what I’m gonna do is just click on trend right here. And you can see once it’s sorts that we have templates for the About page right here and even a Contact Us page. So maybe we can add these to the
different pages that we’re making a little bit later. But right now since
we’re making the Home page, the template that I want is this one right here. So I
can click on the “Preview” button right here just to get it to pop up and you
can see what it looks like. And if you like this one, then go and find this one.
And what we’re gonna do is just click on the “Insert” button right here. And now you
should see the template get inserted into your preview screen right here. And
I’m gonna show you how to edit all of this in just a little bit, but first what
I want to do is just save everything so that we can go and check it out. So I’m
gonna click on the “Update” button right here. And once everything is saved, if I
click on this little icon right here, I can open up a new tab. And once this tab
opens up, you can see what the Home page looks like with our custom header at the
top. And if you like everything here, then all you have to do is just go into all
of these different sections and update them with your own content, but you can
always go and delete some of this stuff. So let me show you a few things with the
ehere Elementor Page builder. And once you’re back on the preview page,
if you hover over these different sections, you’ll see that they’re separated by these blue
boxes. So we have a section for our slider right here and then we have
another one down here. You can see that we have this blue box. And if we ever
wanna edit any of these sections, we can just click on the little icon right
here at the top and then we’ll get this popup to edit this section. So we can
change the layout, we can go into the Style tab and change the background
color and we can change the spacing in the Advanced tab right here. So I’ll show
you how to do this stuff in just a little bit, But first, let me just walk
you through the rest of this template and how you can use the Page Builder to
customize these pages, however you want. So if we come down a little
bit, what you can do is actually move these sections to different places on
the page too. Just click and drag it and drop it wherever you want, and you can
see that we can move these little rows in two different spots. And if you ever
wanna remove a row or a section, just hover over it and click on the “X” right
here. And that’s gonna delete that row. And you can always undo these actions by
clicking on this little icon at the bottom where it says, “History” and you’ll
see a list of all the actions right here. And then you can click on these icons
right here to bring back anything that you just did. So if you click on this one
that says, “Editing Started” you’re gonna be back to square one and that’s gonna
just start everything back from scratch. So what I actually wanna do for this
Home page is I do wanna remove this so if you are using this template, I do
recommend that you just delete this section right here by clicking on the “X.”
And if you wanna replace any of these sections with something else, what you
can do is click the”X” right here and then we can add something called, “Blocks.”
So at the bottom over here, what we can do is click on “Add template” and if
you’re on the blocks tab right here you’ll notice that you have a bunch of
pre-made sections for the WordPress page that you can insert. So what we can do is
go and find a new testimonial block to add. So I can go into this drop-down
right here and just search for “Testimonials.” And we can always go in and
edit the look and feel of these with our own content and colors and all that
stuff also. So maybe I wanna add this one right here. So what I can do is just
click and check it out. So I’ll get this little pop-up right
here. And if I like how this looks, I’ll just click on the insert button right
here. And you can see that the testimonial blog gets added right here
and what I want to do is just drag this up a little bit. So I’m gonna move this
over here. So pretend that I like this right here. And I wanna go in here and
just edit this. So maybe I think this is a little too wide so I’ll just click here just to
make sure that we’re editing this section. And then in this section over here, I’ll go into the “Advanced” tab and I’ll just change the Padding right
here to maybe 50 px for the top and 50 px for the bottom and you can see that
it’s not as wide anymore. And if I wanted to change the background color,
I can go into the Style tab and then right over here, I can just
click on this paintbrush and get this pop-up right here And go in here and maybe I wanna select this
color and you can see that the row changes to another color. But this is actually kind of ugly so I’m gonna clear this. And pretty much, that’s how you edit a row. So I’m gonna go back and revert back to the old testimonial because I actually like that format. So I’m gonna click on the
“History” button right here and I’m just gonna go back over here and click on
this one right here. And you should see the testimonials get added back right
here. And if you don’t like any of the pre-made blocks or the templates, again
you can always go and just create your own section by clicking on this button
right here and then adding however many columns that you want for this row. So if
I clicked on this one, I can go in here and edit this row by clicking on this
and then going in and changing the padding to whatever I want so I can add
some spacing right here. And then we can go in by clicking on this button and
adding whatever elements that we want. So we can just drag these in and then type
in whatever we want. So I can type in services right here and I can go and
center this and then click on the “Styling” tab and change the font color to
black. And then what I can do is go into the Typography and change the font size
to make it larger. And then I can go back and add another element. So I can add a
text element. And what I can do here is just type in whatever I want and then I
can go to the styling tab and I can center this also and just add a bunch of
different elements. So again, you can always build out your own sections if
you want also. But again, I think the Elementor Page Builder does a great job
with creating a bunch of different types of blocks and templates that you can use
and you can always go in and customize them however you want. So instead of
making our life difficult and trying to create a block on our own, I’m just gonna
suggest that you use the blocks and the templates. So I’m gonna delete this. And what I want to do right now is just show
you how I would customize this page, and I think if you follow along you’re gonna
learn a lot about how to use the page builder also. And what that’s gonna do is give you all the tools and resources that you need to customize the homepage and any other page
that you want to create for your WordPress website So if you want, you can follow
along and we’re gonna do a bunch of different edits to the Home page and
then I’ll let you pause the video and create all the other pages that you want
on your own with a bunch of blocks and templates. So the first thing that I wanna do
is I wanna show you how to change the slider video to another video
or a background color. So what I’m gonna do is just hover over this row and click
on the button right here so that we have this edit section. And then what I’m
gonna do is go into the Styling tab. And what you can do here is add a new video
link if you wanna change the video right here or what you can do is click on
this icon right here and then you can change the color to whatever you want
right here. And you can also add an image if you want also by clicking on the “+”
button right here. So you can go in here and if you wanna upload your own file,
just click on “Upload Files” and then click on “Select Files.” And then what you
can do is add your image if you want just by finding it and then clicking on
it and then you’ll see the image get inserted right here. And then we can just
click on this button. And now you can see that we have a slider image right here.
But if you don’t want the image right here, we can go back in here and delete
this, and we can just go back and upload a video link right here by going to the
video link section. And we can open up a new tab, and we can go to YouTube. And
what I can do is just type in “GoPro Hero 6” and go here. And I actually think this
is a really awesome video. So if I go here and click on this, what I can do is
just click on “Share” right here, and you’ll get this URL right here. And what
you can do is just copy that and then go back to the Elementor Page Builder right
here and we can paste that in right here. And you should see a video get inserted
right here. And I think this video looks pretty cool. And if you are using a video
background, what you wanna do is have a fallback image. And that’s so if the
video doesn’t upload, you have an image that uploads in its place as a backup. So
what you wanna do is click on the “+” button right here and you should get
this pop-up. And this is where all of your images are gonna be stored. And
you can see that there are some images already uploaded and that’s because
we’re using these Elementor templates with images on them. So it automatically
uploads the images once we decide to use one of these templates. And if you ever
wanna clear these out, you can just click on the image and then click on the “Delete” link right here
and that’s gonna remove the image. If you wanna upload your own images,
you can click on “Upload Files” and then just click on “Select Files” and find the image that you wanna use and then you can just upload that image. And I will have some resources in the video description
to show you where you can go to get free images to use for your WordPress website
that you’re making also, okay? So that’s gonna be in the video description and right now, all I wanna do
is just show you how to upload this fallback image. So I’m gonna select this image and you can see that it’s selected with that check mark and then click on “Insert Media.” And now, you should see the fallback image right here. And if you wanna change the background overlay, which is a blue or purple tint right here, you can go into background overlay and then
click on this “Color” tab right here and then you can change this to whatever you
want. You can see that it’s green right now I can change back to purple. So
really, that’s just something that you can do on your own. And what I wanna do
is actually remove this video background. I just wanted to show you that you can
replace the video. I think it’s a little distracting right now so I’ll put it
back when I publish this video tutorial. But right now, I’m just gonna remove this.
And you can see now, we have our default fallback image right here. So that looks
pretty good and I’ll just keep that as is for now. And what I wanna do now is
show you how you can edit the text and the icons and the buttons for this
section really quickly. So if you wanna edit any of this stuff, all you have to
do is just hover over it and then click on the area that you wanna edit. So I
can click on the icon section right here. And if you wanna change the icon, you
can go into this drop-down and select whatever icon that you want. And the
Elementor Page Builder has a bunch of different stuff for you to choose from.
You can actually type in a keyword if you want also. So we’ll just leave that
bicycle there but if you wanna change the title or the little text over there
too, you can also do that. And if you wanna shrink the spacing, you can go to the
Advanced tab and you can see that there is some bottom padding here. So you can
always put that as zero or change that to make this a
little smaller, this gap, right here. So I’ll leave that as is, but I do wanna
change the title right here. So I’m gonna click on this and I wanna go in here
and just type in “Design Studios.” And I think that looks pretty good but if you
wanna go and change the font color or the size, you can always click on the
Style tab and then change the font color right here, or click on this pencil to
get the typography and you can go in here and change the font style or
actually change the size of the font over here. So it’s really up to you. I’m gonna
leave this as is and what I wanna do is actually just hover over the section right below it
and you can see that there is a small little row right here or section. So if you wanna get rid of that, just hover over this pencil and then you can click on the X right here and that’s gonna bring this
up, okay? But if you don’t want that, remember you always have the option of
going back on your history right here and then just going back one step. So I
like this how it is and maybe, I’ll update this text a little bit later, but
all I really wanna do because this is pretty simple and it doesn’t really
matter what my demo site looks like, it just matters what your WordPress website
looks like. I wanna just show you how to edit the button right here. So let’s
click on this and we can go in here and change the text so we can delete this
and type in something like “Learn more” and we can link this button to the About
page if you want. So if you wanna do that, let’s type in “http://wwwmyctechwebby.com/about” and what you wanna do is type in your own website name right here and the “/about” is gonna
link to the about page that we’re gonna make a little bit later or the one that we
actually published a little while ago that you can make. So you can always get
these URLs from your pages page also. So if you wanna change the button size,
you can do that right here in this drop-down. You can change it to extra small
and you can see that it shrinks just like that or you can leave it as large.
And if you wanna change the style of this button, you can do that right here
also. And if you wanna change the color, click on the Style tab right here and you can just
come down here and click on the “Background color” tab and we can change this to purple and then we can change the text color, if we needed to, to white but that looks pretty good. And if you wanna change the “Hover” color to something else, you can click on the “Hover” tab right
here and we can change this to white right here. And then what I wanna do is
change the text color to purple. So now if I click out of this really quickly
and now if I come down and hover over the button, you can see that it changes
to another color. And I’m pretty happy with how this slider looks for my demo
WordPress website. So if you need to pause the video, you can do that and
update your slider and if you need to you can always click on the “Update”
button to save your changes. And then once you do, if you wanna see what the
website looks like, you can click on the “Preview Changes” button and it will open
up a new tab and you can go to it and see what your WordPress website looks
like right now. So this looks pretty good and I actually like a lot of this
template but I’ll show you how to add some additional sections. So let me close
out of this and maybe you wanna add an “About” section right here. So you can make
your own by clicking and adding a new section or what you can do is come down
to the bottom and click on the “Add template” button. And once you get this popup,
we can just go to the “Blocks “tab and you should have all of these
pre-made blocks right here. And you can scroll through this and find
the one that you wanna add or you can always just come to the top and filter
by different section. So we can click on “About” and then we can find one that we
like. So maybe we like this one right here a And we can check it out by clicking
on the “+” button right here and if we like how this looks, we can just insert
it and it should show up at the bottom over here, and we can just click and drag
it to wherever we wanna place it so I’ll move it up here. And if it looks too
big, you can always click over here and then edit this section so you can go
into the Advanced tab and then change the padding to whatever you want. So
maybe we’ll put this as 50 px for the top and bottom, and then we can add a
background color if we want also just to play around with this even though I’m
probably gonna delete this section. But again, what you can do to really
customize this entire section is add whatever type of blocks that you want
for the different pages, okay? So I’m going to delete this and I
do want to mention that if you wanna change anything here or you wanna
substitute these images with icons, again you can come down to the Templates
section and click on this and then just go back to the Blocks tab right here and
then you can go in here and then search for Services and there’s a bunch of
different options. So you can see right here that you have icons that you can use or these ones right here. So you have so many possibilities with customizing
the layout for your WordPress website that I’ll let you play around with this
on your own. So I’m just gonna close out of this. And what I wanna do is just go
up and just remind you how you can edit this stuff. So if you wanna edit the
image, all you have to do is hover over this and you can click on the pencil
right here and then you get the popup right here and you can delete this. You
can put in a new description and all that stuff. And if you wanna style this
text, you can always just go to the Style tab right here and you can change stuff
right here. You can go into this drop-down and change the typography. It’s really up to you.
So again, it’s a lot of trial and error but whenever you make any type of change you can see it right here real time. So if you don’t like it, you can always undo the change or you can save it and then it’s gonna be on your WordPress website. So if you don’t like any of these sections,
feel free to delete them or replace them with anything else and what I’ll do really
quickly is just show you how you can edit this section and then again link
this button to the “Contact Us” page instead of having a blank link right
here. So we’ll just hover over this and click on the “+” button right here. And
if you wanna change the background color, we can just go into the Style tab
right here and then go in here and maybe we’ll just have this blue color. So that
looks pretty good and then we can go and just change the button by clicking on
this. And if we wanna link that to the “Contact Us” page, we’ll type in our URL
right here so I’ll type in “http://www.nyctechwebby.com/contact” and let me actually show you where you can get
the URLs for all your different pages. So after I’m done editing this, I’ll show you how
to do that. So let me just change the background color really quickly. So I’ll
click on the Style tab and come down here, click on “Background Color” and just
change this and then go to the hover tab and then change this to white. And then
I’ll go into the text color and change this to the blue color. So let’s see how
that looks because that might be a little weird. We might have to put in a
border color right here. So let me click out of this and yeah, there’s no border
right here to separate this. So let me click back in here and then go back to
the Style tab and add a border. So I’ll go in here and click “Solid” and then we’ll put
in the border color right here. So I’ll change that to “Black” and then we’ll put
in the width as 1px so I’ll put that all across. That looks a little thin so maybe
we’ll change this to three. And again, this is just a demo website so it
doesn’t really matter what I put in here, but you can see that this is what it
looks like right now and it looks a little better but it looks actually a
little weird too. So if you don’t like how it looks, always go back in the history
and then you can just click out of it and that’s all you have to do to
undo your changes. So if you do like how this website looks and you’re done
editing everything, again all you have to do is click on the “Update” button right
here and that’s gonna save all of your changes. And pretty much, this is the home
page that I’m gonna have for this demo website. And again, it’s so easy with
these templates that I really encourage you to use them with the Elementor Page Builder.
So don’t build anything from scratch if you don’t have to. Just use the pre-made blocks and the templates
and then customize whatever you need to. So let me show you how to get these URLs
to link to your different buttons. So what we can do is hover over this little icon over here and click on that and then just go back to our dashboard. And once you’re on the “Edit Homepage”
down here where it says permalink, this is where you can get the URL for this
page. So every page is gonna have a unique URL and you can come into each
one of these and then just copy this URL and then paste it into the section where
you wanna link the button to whatever page that you want to, okay?
So pretty much we are done showing you how to make the Home page and if you
need to, you can pause the video and edit your own Home page by clicking on the
“Edit” button right here and then going back into the Elementor Page Builder and then adding whatever templates or blocks that you want and customizing them. And once you’re ready, push “Play” and what we’re gonna do is go and create some additional pages. So right now, I’m just
gonna move on and I’ll just hover over “Pages” and click on “All Pages” just
to go back to the page list. And once you’re back on the Pages page with a
list of all the pages that we created, we can move on and create the next page.
And again, as we make these pages, it’s gonna be very simple because all we’re
using are the templates and the pre-made blocks. So I’m gonna go through this stuff a little quickly
and we’re not gonna do too much customization because I’m just showing you how to use this
stuff and then you can go in and pause the video And then create your pages on your own. So right now, I’m just gonna go and add a template for the About page. So I’ll hover over “About” and click on the
“Edit” link. And once you’re on the “Edit” page, we can just come down to the
settings down here and in the content layout, I wanna select the “100% Full Width” option.
And then I wanna go to the Title tab and just disable the Page
Title right here and before we enable the Page Builder, I wanna save this so
I’m gonna click on the “Update” button. And once the page is updated, now we can come
to this button right here and click on this. And once the Page Builder loads,
again you can always add as many different sections as you want and add
whatever elements that you want to build out your own page or what you can do is use the
pre-made templates which is what I recommend. So I’m gonna click on “Add
Template.” And you can just go in here and find whatever template that you wanna
use for whatever page that you’re building. And some of these do say “Pro” right here and that means you would have to upgrade to the Premium Elementor
Page Builder in order to access some of these. But you don’t really need to. You
can just use the free ones which I think are really good. So I’ll click on “Trend” right here
and I’ll just select this one right here. And we can see a preview of
this one and maybe we’ll edit the colors but I think this one looks pretty good.
So we can change some of the stuff. So if you like it, we can just click on “Insert” right here.
And now we have our template inserted right here. And I can go in and edit this.
So let me just click on this right here. And I can come down to the Style tab right here. And we can come down to the Overlay, and we can change this to that purple color. And I think that looks a lot
better for the style of the WordPress website that I’m making. And then if you
want to change any of this other stuff we can go in here I can change “Our Story”
to about us so maybe I’ll just type “About Us” right here. And we can change
the font color by highlighting this and then going into the Style tab and
changing this, again to the site colors that we like. And maybe we’ll change this
icon right here so we won’t have the heart. But we’ll go in and just change it
to something else. So I’ll just select this “i” right here
for info and I think that looks pretty good. And again, you can do whatever you
want to your About page. If you wanna add some additional sections, you can
always come down to the bottom and click on “Add template.” And again, you can go to
the Blocks tab and you should see all of these pre-made blocks and you can just find the
one that you wanna add to your WordPress page that you’re making and what I wanna do
is add a call to action to the bottom over here. So I’m gonna find this one right here
and I can click to check it out. And I like how it looks but I’m gonna
update or change this text right here. So I’ll just click
and insert this and you should see it get inserted right here and it looks a
little big. So I’m gonna click on this icon right here, and I’m gonna change the
padding right here to make it not as tall. So I’ll change this to 50 px for
the top and bottom. And then what I can do is change the color right here so maybe,
we’ll make it the blue color or the purple color. And then I can change this text to the white color
by clicking on “Style” and then going in to the text color and just changing this
and maybe I’ll change the header right here. So instead of this text, I’ll change it to
have a question and put a question mark. And then this button looks a little different than the one on the home page. So if I wanna replace this button, what I can do is hover over this and just delete it
and then go back to all of these elements right here. And if you don’t see this,
just click on this icon right here and then find the Button element and
just click and drag it in right below over here. And now we can just edit this.
So I can click right here and I can Center this. I can put in a link right here so I’ll type in
“http://www.nyctechwebby.com/contact” and that’s gonna link to the “Contact Us” page and then if I wanna make this button larger, I can go here and change that to a larger text
size. And then what I can do is go into the Style tab right here and we can
change the background color to another color. So maybe we’ll make this white and
we’ll make the text color the purple blue color. So you can see what it looks
like like that and then we can also change the Hover color to another color
also. So maybe, we’ll have the text color as white and then the background color,
we’ll change it to green just for fun. And so now, if I hover over this it
should turn green and that looks pretty good. And again, if you ever wanna
delete any of these sections, you can do that by just clicking on the “X” right here.
And if you wanna change the background color over here or this overlay, we can just hover over this,
click on that, click on “Style” and then we have an image right here that you can
replace if you want. If you wanna keep it, go ahead and do that. Just come down here and you can see there are two colors. So this actually goes from one color to another color. So what you can do is change these colors to whatever you want. And I’m just gonna change this
one so you can see it goes from orange to purple that looks pretty good. And we
have a video inserted here. If you wanna remove this, you can always just hover
over it and click “X.” You can also edit this if you want. And you can see that it
shows up up here instead of in this whole section and that’s because if you go to the
Advanced tab right here, the margin is -150. So that just pushes this up, okay?
So if you like what you see and again you can always link this stuff over here too.By clicking on this, you can link it right here. If you like what you see, as I was saying, just click on the “Update” button right here to save everything. And once everything is saved, we can go and check it out by
clicking on this link right here. So let me go and see what the About page looks like.
So we have our header, the title right here, and then all this stuff right here. So a little short section and if you wanted to, you can update the icon and change the color, insert whatever you want.
And down here, we have that cool little call to action that I just put in. And I just
noticed I didn’t change the text right here, so I will just go back in and do that right now.
So I’ll come down to the bottom and just click here. And I’ll change this to “Contact Us” and then click “Update” again. And pretty much, my About page is done. So if you want, you can pause the video. Use this template if you want. Use some different blocks if you wanna add some different stuff. Or
maybe you wantna use a pro template, you can do that too and then just update
whatever you want. And once you’re ready, let’s go on and create one more page
together and then I’ll let you go off and make as many different pages as you
want. So once you’re ready, we can just click on this little hamburger icon and
click this “Exit” button right here. And now we should be back on the Edit page
right here and there’s really nothing to do. So let’s go back to the pages list by hovering over Pages and click on “All Pages.” And the last page that I’m gonna make together with you is the “Contact Us” page. And again, all we’re gonna do is go and find another template and just customize it because again, the Elementor Page Builder, I can’t say this enough, it makes life so much easier. So let’s hover
over Contact and click on the “Edit” link right here. Once you’re on the Edit Contact page,
let’s come down to the Ocean WP settings, and just change the Content Layout to 100% Full Width and then go to the title and disable this or you can enable. It it’s really up to you. But since we’re using a template that probably has the page title or the title for this page, we’re gonna disable this.
So once you’re ready, click on the “Update” button right here. And once the page is updated, we can come
here and click on “Edit with Elementor.” And once the page builder loads
I’m just gonna add a template so I’ll click on this. And then I’ll sort by Trend and I wanna
add this “Contact” page. So I can click on it just to preview it just to show you what it looks like and the colors don’t really match my WordPress website, but I can just go in here and customize this stuff.
So I’ll click “Insert” right here just to insert the template and then we
can go in and we can change the Overlay by clicking on this right here
and then go into the Style and we can keep this image and just come down to
Background Overlay and change this to that blue purple color just to be
consistent with the rest of our website. And then I can change the text right
here from this orange color to white so it looks a little bit better.
And if you ever wanna change any of this text, you can also do that on your
own. And then down here, I’m not gonna really edit anything. All I’m gonna do is
just change these colors so they match my website. So if you need to, you can always pause
the video and then add or delete whatever you want or you can just watch and learn
how to use this page builder. And then whenever you’re ready,
you can go in here and customize all your different pages on your own. So just
remember that you can always go and change the spacing for each of these
sections by going into the Edit section and changing the Padding if you want. And
you can always delete any section that you don’t want on these templates and
you can add whatever type of row that you want also. You don’t have to use the
templates as they’re built. You can customize them to look however you want
and you can also drag these rows to different places if you want also. And if
you wanna have this map you wanna edit this. So we can just hover over this
pencil and click on this and then we can type in our address here if you want.
I’ll just leave this as is and I’ll just come down to the social media buttons and these are elements. So you can always add whatever elements that you want to
these rows too. You can just click on this button right here and you can see all
these different elements that you can just click and drag into whatever
section that you want. So all I wanna do is just hover over this and click on
this. And I can delete some of these that I don’t want so I’ll delete these two.
And if you wanna add your own URL for some of these pages, just click on these
buttons and then you can type in your links right here for all of these
different social media pages, okay? So I’m just gonna change the color really
quickly so we’ll change this to white. So that looks pretty good and pretty much,
I’m done with the Contact Us page. And that probably took what, one minute, two
minutes really. And it probably would have taken a little bit more if I changed
the text but I’m pretty happy with the look of this. So whenever you’re ready, just make sure that you click on the “Update” button
to save all of your changes. And then if you wanna go check out the page, you
can click on this icon right here and it’ll open up a new page and then you
can see what the page looks like with the template that you just chose or
whatever blocks that you added to this page. So I’m pretty happy with this and
now, I’m gonna go back to my dashboard. So once you’re ready, let’s go back. So click on the hamburger and click “Exit” right here. And now what you can do is pause the video and
create whatever type of pages that you have for your WordPress website. So you can see on my Pages list, we created the About page, the Contact page and the Home page. I’m not gonna create the Services page with you because these steps are pretty much the same. I’m just gonna add a
template and then customize it with my own text and colors and images and you can do
that on your own. So what I want you to do is pause the video edit or create
whatever pages that you want. And then what we’re gonna do is show you how to create some blog posts. So if you want, pause the video right now. Otherwise
we’re just gonna move on to the next step. And now what we’re gonna do is
learn how to create some blog posts and this is gonna be really easy. So if
you’re on your WordPress dashboard or you see this left hand menu over here, to
create a blog post all you have to do is hover over post and then click on “Add
New.” And once you’re on the Add New Post page, to create a blog post all you have to do is type in your blog title right here. So we can type in “Professionally
Designed.” And then what you’re gonna do is just come down here and type in
your content and if you wanna edit any of this text, what you can do is just use
any of these buttons right here. And if you only see the first row, what you wanna do is click on this button that says, “Toolbar Toggle” and you’ll have all of these buttons to link your text to make it bold, to make it larger and format your text however you want. So you can play around with this stuff on your own
and we don’t really need to do anything with the WP settings over here. So if you
want, you can add a featured image which is what I wanna do. And I’ll show you
what that looks like on the Blog Post page in just a little bit. So we can come
here and click on this link right here. And we’ll get our Media Library and
again, if you wanna upload your own files, you can always just click on
“Upload Files” and click on “Select Files” and find the image that you want to upload. I’m just gonna use this demo image right here. So I’ll just click that and click on “Set Featured Image.” And now you should see the image get added right here. And now all we have to do to publish this post
is click on the “Publish” button right here. And pretty much that’s all you have to do to create
a blog post. And we can go and check it out by clicking on “View Posts.” And you
can see on the blog post page that we have our featured image and our Content
section right here. And there’s a few things that we can do to make this page
a little better. We can delete this sample blog post that’s installed with
WordPress, and then I can show you how to customize the sidebar on the right-hand
side. And I can show you how to add a background color for your header when
you don’t need a transparent header. So let’s go back and do some of that stuff
right now. Let’s go to the Customize tab and change the background color for our
header first. So click on this. And once you’re on the customize page, all I want
you to do is come down to the header tab and click on that,and then go and click
on “General.” And then what we’re gonna do is come down to where it says, “Background
Color” and click on “Select Color” and then choose the background color that you
want for whenever you’re not using a transparent header. And you can see that the
background color turns to this color right. here And now all we have to do
once you’re ready is go ahead and click on the “Publish” button. And once everything
is saved, we can just close out of this. And once you’re back on the
Blog post page, you’re not gonna see the background colors show up right now
because you have to go into the Ocean WP Settings to change that. So let’s click
on “Edit Post.” And you have to do this for each of your blog posts. You have to come down
to where it says, “Ocean WP” and click on “Header.” And then what you’re gonna
do is click on “Enable” and then go into the Header Style and select the “Minimal”
option or whichever option that you want, just not the transparent one. And then go
back up to the top and click on the “Update” button. And once the post is
updated, now we can go and check it out. And once the post loads, now you can see
that we have a header background color which looks a lot better than the
transparent option. And if you wanna change the background color for the page
title section, you can always go back into the Customize tab and then go into
your General Settings to the Page Title, and you can update the background color
there. But I actually like how this looks and what I wanna do, now that we know how to create blog posts, is I wanna show you how to delete this one right here and then you can pause the video and create
however many blog posts as you want. And then I’ll show you how to update this
right sidebar right here. And then pretty much, we are done creating our WordPress website. So let’s go back to our dashboard and delete that sample blog
post page. So I’ll click on “Dashboard.” And once I’m back on the dashboard, I’ll come
down to Posts and click on “All posts.” And once you’re back on the Post page, just
hover over “Hello World” and click on “Trash” to delete that sample blog post.
And before we move on to creating or editing the sidebar, what I wanna do is
go and edit the Blog page. So this is one of the pages that we created a little
earlier and we have to go in and change the Header option. And then I wanna
change the layout for this Blog post page because right now it just looks
just like this. And what I wanna do is customize this a little bit. So first, we
can go to the Edit page and if you’re not on this page right now, what you can
do is just hover over Pages and click on “All Pages.” And then find the Blog post page and then just click
on that and what we’re gonnao do is come down here to the header. And then we’re gonna go in and do the same thing that we did for our Blog post. We’re gonna enable the header and then go in here and choose the “Minimal” option and click “Update.” And once that’s updated, now what I wanna
do is go to the Customize tab to change the layout for this Blog post page. So
I’m gonna hover over Appearance and click on “Customize.” And once I’m on the
Customize page right here, I’m gonna come down to where it says, “Blog” and click on
that. And then what I wanna do is go into the Blog Entries tab. And what I
wanna do is come down to where it says, “Blog Style” and in this drop-down, you can
select whatever option that you want. And if you want, you can go to the Blog page
to check it out. And now you can see that the layout for the blog page looks a
little different. So whenever you create some additional blog posts, they’re gonna
show up in two rows just like this, with a box just like this. And I think this
looks a lot more professional than the layout that we had before. So I like this
and if you like this, go ahead and select the “Grid” option and then click on the
“Publish” button right here to save your changes and then we can just close out of this. And now the last thing that we’re gonna do is
just show you how you can edit your sidebar. So on the left hand side, if you’re on your
dashboard, just hover over Appearance and click on “Widgets.” And once you’re on the
Widgets page, you’re gonna see a bunch of widgets on the left-hand side and then
on the right-hand side you’re gonna have this right sidebar. And what you’re gonna
do to customize the sidebar is drag some of these widgets into the right sidebar
and then place them wherever you want. So I just put in this “About Me” widget. And
if I like it, all I have to do is click on the “Save” button. And then if I don’t like it, I can click on the “Delete” button right here. And you can change any of these widgets that are in here right now by clicking and
expanding and then putting in whatever title or deleting these if you want. So
it’s really up to you. You can customize the sidebar however you want. And once
you’re ready, then you’re good to go. So again, let me just show you on the
Blog post page what the sidebar looks like. So I’ll just click on this Blog post right
here, and you can see that the sidebar looks like this right now. If you
don’t like everything, you can just go into the Widgets page and delete some of
this stuff. So I can delete this one and maybe, I’ll delete the archives one. And
pretty much, that’s all you have to do. So if you want, you can pause the video,
update your blog post, update your widgets. And then once you’re ready, you
are good to go and you just learn how to make your own WordPress website. So what
I wanna do is just close some of these tabs. And I just wanna say, “Congratulations
on learning how to make your own WordPress website using the Elementor Page Builder!” I hope you enjoyed this video, and if you have any questions whatsoever, you can always or contact me via Facebook, email or YouTube and I’ll get back to you right away. So please make sure to like this video if it helps you out. And make sure to subscribe to the NYC Tech Club YouTube Channel and look out for more videos on how to use the Elementor Page Builder and how to create some additional WordPress
websites. Congrats again, and I’ll see you later! [Music]