Hi guys Today, we're going to see how you can create a one-page website in WordPress. Now a one page website is a simple
website with only a single page Where you can keep all your content.. So after watching this video, you
will be able to create a one-page website like this Where you can add
different kinds of sections like this. And also you can create
a menu for your site,. Now when a visitor clicks on a the menu item It was taken to that particular
section of your site.
And then we will see how you can easily
customize your site to any style you want just by using drag and drop like this Next, we will see how
you can make your menu fixed on the top like this for easy to navigate. And finally, we will also see how you
can add a contact form to your site so that he was just get in contact
you easily by filling up this form. Okay. So having a one page website will help
you in this does go through your content with much ease And it'll keep them more engaged. make sure you watch till the
end to learn how to do it. This is Bryan from Website Learners. And let's start creating
a one page website. So to create our One-page website. we're going to do 2 parts The first part is to launch a website. Now, this is where we get a new
website live on the internet. So the launch your website
will learn to do two steps. The first step is to choose
a name for your website.. So to choose the name, this click
the link below this video, And it'll take you to this page.
Now here, enter the name
you want for your website,. I'm going to enter absolutementor.com And then click search. And as you can see, our
domain is still available,. Once you choose your name, you can go to the next step, which is to get this domain name and hosting domain is the name of your website, which
people need to enter to visit your site. And hosting is the place where your websites files are stored like your
websites, images, and files. So to get this domain name
in here, Click add to cart and then click continue. Now here, it will ask us
to choose our hosting plan. Now hosting is needed so that your website
is visible on the internet and can be accessed by anyone. And as you can see here, hosting provides the space to store
your website on the internet. So based on the number of
websites you're going to build. You can choose a plan here.
I want to build one website. So I'm going to choose this plan. Now, here you can choose how
long you want the hosting for. I'm going to leave it as 12
months and click continue. Now, here, you can see that we're getting a domain., which is absolute mentor.com for free and our hosting.. Now, both of these are valid for one year. which means Once we complete this purchase our site will be live on the internet for one year. So to get our domain and hosting., let's fill up these details. Now choose the payment method you want here enter your details And click order now. As you can see, we have
successfully placed our order.. Now, if we click here., You can see that we have successfully
got our hosting and domain. okay. Once you go to your hosting and domain. your website should
now be live on the internet. So to check that let's open a new dab and go to our site, you can see that.
We have a brand new website on
the name, which we selected. And anyone in the world can access
this site, By going to this address. now, sometimes it takes a few
minutes for the domain to become active on the internet. So if it didn't work for you, try refreshing after 5 to 10 minutes. Okay. So now, we have successfully
launched our site on the internet!.
So once you launch your site, you can go to part 2 of this tutorial, which is to start building your one page website. Now, instead of building your
(one-page) website from scratch we're going to first import the
design and then we're going to edit it to make our own site. So this is going to really
speed up the process.. So the input, the design,
we're going to do four steps. The first step is to log into our website. So the log into your site, all you have to do is just type /WP-admin, next to your sites address. Now if we press enter. You can see that we have got the login page of WordPress.. Now here, you need to enter your
username and password to login to your wordpress dashboard. Now one's your site is active. You should have received the
login details of WordPress in your email. So let's go to our inbox And you can see that we have got this email. just open it. And you can see here, we have the username and password Now to login to our website.
Just copy these details and paste them here. So let's copy the username. And paste it here Then copy this password. paste it here and then click login. You can see that we have
successfully log into a WordPress site. And this is the WordPress
dashboard., this is the place where you can control your website. Once you've logged in, we can now go to step two. which is to install a theme WordPress.. So we're going to install a team
called Astra, which is going to import the design for our site. So to install the theme, this go to appearance, click themes then click add new. search on a theme called Astra And you will get this theme. Now, this is the theme, which is
going to help us in both the design. So to install the theme, let's click install, and then click activate So now we have successfully
installed the theme.
Once you have installed the theme.. Next We can go to step three, which is
to choose a design for our website. So to choose the design. let's click get started, And now it will ask you to choose the page builder, Now we recommend you to choose
Elementor here, Which will make it easy for you to edit your website,. So I'm going to select Elementor And here you will find different
designs, which you can apply to your site. So have a look at these designs. And select the one you like.. I am going to choose this
one. Now, as we are creating a
One- page website, we are only going to import the homepage.
So here you can see the preview of
how the home page design looks Now to import this design into our site. Just click import home template, click next. then click skip And then click view template. You can see that we have successfully got
the home page design, which we selected.. Okay. Once you have got the
design into your site. next, let's go to the final step. Which is to edit the content of our site. So to edit our content, just click edit with Elementor. And now it will take you to this editing mode, Where you can edit
any part of this page..
So let's say you want to change
this text, just select the text, And then enter your own text, I'm going to enter, let your change begin here. Next, if you want to change the
text on this button, just select it And then enter your text Now in the same way you can change
any text you want on this page. Okay. Next. Let's see how you can edit this section. So if you want to change the title here, just select it, And then enter your text, I'm going to enter James Allen And like we did before, you can change the text here, now, if you want to change this image. All you have to do is just
click on the image, then click here, and drag and drop your
images from your computer As you can see, the image has been changed..
So now we have successfully edited this section. now, in the same way, you can edit
any section you want on this page. Once you are done with all the changes. just click update And all your changes will be saved.. No, if you click here, You can see that all our
changes have been applied.. Okay. Now, let's say you want to remove
the section from your page. All you have to do is just go back to this tab. Now to remove this section Just go here and click this icon. As you can see, the section has been removed.. Okay. Now, if you want to add a new section. just click here and then go to blocks And here you will find defense section, which you can add to your page. Now if you click here, You will get different categories.. Now, if you want to add a
contact section to your page. just select contact And you will get different
types of contact sections. Now have a look at these sections, And select the one you want.. I'm going to select this one Now to add this section to your page. just click insert And As you can, see, the section
has been added to your page.
Now, if you want to change this text. just select it And then enter your own text. once your done with changes, click update. Now, If we go back to our site And click refresh You can see that we have now got a new
section, which we added to our page. So now we have successfully
edited the content of our site.. Now, we open a new window
and go to our website. You can see that we still
have a default page. And the page we created does not appear. So now to display our page You need to set the page you
created as your default homepage.. So to do that, let's go to our WordPress dashboard. Then go to settings and click reading Here you can see that our homepage is set
to latest posts Now to set the page we created as our default homepage. select static page Then click here, And select home, which is the page we created once you select it, just click save changes Now If we go to our site and click refresh, you can see that our page, now appears here okay So, this is how you can edit
the content on your site.
Next. Let's see how you can add a logo to your site. So to add our logo, here, let's click customize. Now click this blue icon, And then add your logo here. So let's click here And then drag and
drop the logo from your computer.. And you can see the logo has been added.. Now, if you want to remove
this site title, all you have to do is disabled this option, and it will be removed now, to save our changes. just click publish. Now, if you go to our site and click refresh You can see that the logo
has been added successfully.
Okay. Once you have added the logo.. Now If we look at our site, you can
see that we have a default menu here Now, instead of this menu, What if you want to create a menu like this?. So when it was clicks on the menu, it will take them to that section. Which makes it easy for your visitors
to find the topics on your site. Okay. So next let's see how you can create a menu like this. So to create a new menu, let's
go to customize, Then click menus And click create new menu. Now to create our menu First, We need to enter a name for our menu So I'm going to call
this menu as main menu Next, here We need to choose where
our menu needs to appear.. If you want your menu to appear in
this area, just choose primary menu. and then click next. You can see that the default
menu has disappeared.. This means you can no
add items to your means. To add your menu items,
here, just click add items.
And here you can see the is which we
have on our site Now to add the sections to our menu, click custom links. Now, I'm going to add
this section to the menu.. So just give a name here, I'm going to enter about. And here, you need to give an ID
to your section, Just enter # and then type the name of the menu item. Once you're done click add
to menu And it will be added. Now in the same way, you
can add all the sections here. Okay.
Once you're done, You can see
that our menu has been created.. Once you have created the
menu, just click, publish. Let's go back to our site and click refresh You can see that, we have
got the menu on our site.. So this is how you can create a menu. Okay. Once you have created
the menu for your site.. Now, if you click on the menu item. you can see that it does not take us to that section.
So to make it work. You need to link the
menu with the section.. So to do that, just
click edit with elementor Now, scroll down to the section, which you want to link to the menu. If you want to link the about section
to the menu, just click here and then go to advance. No here, you need to enter the
id of the menu item, which you have given while creating the menu. So let's enter the ID without #. Once you have done that,
just scroll down to this page And like we did before you can
link the section to the menu So let's click here and go to advance And then enter the ID of the menu. We don't have #. Okay. now the same way you can link
the other sections to the menu. Once you're done just click update And the menu will be linked
with the sections we created,. So to check it, let's go back to our site. And click refresh now, if you click on any menu item, You can see that it takes
us to that section..
So this is how you can link
the menu with the sections.. Okay. Now if a visitor scrolls down this page. You can see that our menu is moved
up, So every time, our visitor needs to scroll up to see the menu, Now, instead of scrolling., What if you want to make the menu fixed Like this next, let's see
how you can make a fixed menu. So to do that, let's go to customize And then click additional CSS. No to make them in your fixed. We need to enter the code here. So to get the code just go to the
video you're watching right now here, you can see that we have given the
code, which will make them in a fixed. So let's copy this code, then go back to customize. And paste the code here, once you have done that, just click publish, now, let's go to our site, click refresh. And now if you scroll down the page, You can see that our menu is fixed. Okay, So this is how you
can make your menu fixed..
Okay. Next let's say you want all
of your customers to contact you when they need any help. How can you do that? So next, let's see how you can add a
contact form to your site like this. Now, to add a contact form, we
are going to do three steps. The first step is to install
a plugin in wordpress.. So to install the plugin, let's
go to our WordPress dashboard. Now go to plugins And click add new. now here. Search for WP forms And you will get this plugin. Now, this is the plugin, which will
help us create a contact form To install the plugin let's click install. then click activate And it will take you to this page So now we have successfully
installed the plugin.. Once you have installed the
plugin, we can now go to step two. Which is to create a form. So to create the form, just click create, and you will find different types
of forms, which you can create As we want to create a contact
form, I'm going to choose this. So let's go here and click create And as you can, see, our
form has been created.
Now click save. Okay. So now we have successfully
created the contact form. once you have created the form,
we can now go to the final step. Which is to add the form to our site. So to add the form to our
site, let's go to elementor And then go to the place where
you want to add the contact form Now, let's say you want to
add the contact from here.
So just go here
and search for WP forms And you will get this form, now, just drag this form and drop it here, then click here, And select the form, which we created. And as you can see, the
form has been inserted. Once you're done click update. Now If we go back to our site And
click refresh, You can see that the form has been added to our site.. So this is all you can add
the contact form to your site. Once you've added the form to your site. Next, let's see. how, this form works. Now, if a visitor fills up these details, click submit, You can see that the form has been submitted..
So now, if we go to our inbox, You can see that we have got an email.. Now if you open it. You can see the details of the
details of the visitor who has filled in the form And now if you have any issues with
receiving emails from your visitors, you can click here and watch our video. Okay. So that's the guys, This is how you can
create a one-page website in wordpress. Now, If you are ready to make your
one-page website, just click here and it will, take you to the page which
we saw in the first step, which is choosing the name for your website.
So just choose your name and
start building your website. And also make sure you
subscribe to Website learners. to get more videos like this one. Thanks for watching. I'll see you in the next video. Take care. Bye..