In this single page website tutorial, I’m going to be going over how to create a one
page website step by step from start to finish. I’ll be showing you how to access professional
pre-made WordPress website templates to make Creating your one page website an easy process.
No matter what template you want to use I’ll Be showing you how you can easily turn it into a
single page website. I’ll also be going over how To create your one page website using one of the
most popular drag and drop editors Elementor page Builder so you can build a professional looking
one page WordPress website via drag and drop. The great thing about this single page
website tutorial is it is extremely easy to Follow along with even if you have no experience
in starting and creating a one page website. At the end of this video, you will have your
WordPress one page website successfully created. The first step I'm going to cover is
how to choose and register your own Domain name for free. A domain name is
the name of your website. For example, The website name for youtube is youtube.com. Step 2 I'll be going over how to choose a hosting
provider. An easy way to think of hosting is it's Like the physical storefront of your website.
To have a WordPress website, you have to have Hosting. Step 3 is going over everything WordPress
and creating your WordPress website using Professional pre-made templates and building your
site using the most popular drag-and-drop editor. Let's get started with the one page
website tutorial for beginners video. The first thing you want to do to create your site
is to click the link in the description below to Be taken to Bluehost so you can take advantage
of our exclusive Bluehost discount, where you Will be getting a free domain name and up to
73% off web hosting for your WordPress website. Make sure you click the link in the
description to get this great deal. A little disclosure. The link is an affiliate
link, meaning I'll receive a commission from Bluehost at no extra cost to you. Plus,
you'll get an awesome Bluehost discount. A little about Bluehost. Bluehost powers over
2 million websites worldwide and over 850,000 Blogs around the world. They are also
recommended by WordPress.org since 2005. Installing WordPress is a quick and
easy process that makes creating a WordPress website that much easier.
They provide 24/7 support via chat, Email, and phone. And they have
a 30-day money-back guarantee. If, for any reason, you are unhappy, you can
cancel and get a refund within the first 30 days. Once you click the link in the description
below, you'll be on the Bluehost page. Click the get started button. You'll now
be on the Bluehost plans page. You'll see Four different plans you can choose from. The
Basic, Choice Plus, Online Store, and Pro Plan. You’ll see the Bluehost hosting
terms you can choose from are 12
And 36 months. You’ll get the $2.95
pricing with the 12-month term. The Basic plan is a great plan if
you are going to have just one site. This plan comes with one
website, and 10 GB SSD Storage. The Choice Plus plan allows unlimited websites and
comes with 40 GB SSD Storage. The Choice Plus plan Comes with free domain privacy, free automated
backups for 1 year, and malware scanning. Domain Privacy protects your personal information
from the public and will show Bluehost’s default Contact information instead of yours in the public
whois database. The automated backup will backup Your site daily and will allow you to restore
your site to a previous backup with a click of A button in case something happens to it like
a website crash or an editing mistake. Malware Scanning will scan your website for malware on
your site and notify you if malware is found. The Online Store plan comes with
unlimited websites, 100 GB SSD Storage, And everything the Choice Plus plan comes with.
This plan is good if you are going to have an Online store as it comes with a bunch of extras
like an exclusive store theme, store analytics, And $450 worth of e-Commerce plugins for
your online store like unlimited products, Secure online payments, bookings and appointments,
shipping labels, product search and filtering, Gift cards, wishlist, and
customer account creation. Something I want to note is you can
have an e-Commerce site with the Basic, Choice Plus, or Pro plan as well. You just won’t Get the extra e-Commerce features the
Bluehost online store plan provides. The Pro plan comes with unlimited websites, 100 GB SSD Storage, and features such
as the domain privacy, daily backups, And malware scanning. The Pro plan also includes
a free dedicated IP and optimized CPU resources. With a dedicated IP instead of
your site sharing the same IP Address with others, you’ll have your own IP.
Optimized CPU resources is good for high-traffic Sites or resource heavy sites. The Pro plan
provides more speed and power for your site. For most, the basic, choice plus, or online
store plan is what you’d want to choose from. You can always upgrade to the Pro plan as
your site traffic grows to a high volume. I’m going to choose the
Basic plan for this tutorial. Once you decide on a plan to
choose click the select button. You’ll now be on the domain page where you can
choose your free domain name for your site. You can type in and search available
domains under the create a new domain. If you already own a domain name you can enter
it in where it says use a domain you own. If you can’t decide on a domain name you
can click the create my domain later link And you can choose your free domain name
at a later date in the Bluehost dashboard.
Click next to proceed to the next step. You’ll now be on the create your account page.
You now want to input your account information. Next, is the package information section. You’ll see domain registration free as well as
the Let’s Encrypt SSL Certificate being free. Next, is the Bluehost package extras section. What you see here can vary on the plan you
chose as some plans come with some of these, Or if you didn't choose a free domain
name Domain Privacy won’t show. All of these Bluehost package extras
are completely optional and up to you Whether you want any of them or not.
First is Domain Privacy + Protection. I do recommend domain privacy + protection as
it'll keep your personal information private so That spammers and telemarketers won't have access
to your personal information and contact you by Phone and email with offers of their services.
When you register a domain name no matter what Company you choose the domain goes into the public
whois database as domain names are regulated. If you select domain privacy + protection
it'll show Bluehost’s default contact Information instead of yours. Highly
recommend domain privacy + protection. Next, is Site Backup also known as Codeguard
Basic. This will backup your site daily and you Can restore your site to a previous backup with
a click of a button with their one-click restore. An example of where this package extra can
be good is if your site gets hacked into or You mess something up while creating it,
or editing it you can restore it to the Version right before whatever happened took
place and everything will be back to normal. The next addon is Yoast SEO Premium.
Yoast is the #1 WordPress plugin for SEO. Something I want to note is Yoast SEO is a
free plugin you can download in WordPress. Yoast SEO Premium comes with additional features
such as full access to Yoast SEO academy that Helps you learn about SEO, 24/7 Premium
support, it’ll save time and spot ranking Opportunities with Yoast SEO workouts, prevent
your visitors from ending up on dead links, Content quality and link suggestions as you write
your content, you can view your blog posts and Pages as they would show on search engines and
social media posts to help you optimize better. In my opinion, the Yoast SEO
free version is all you need As it is super helpful in guiding
you to optimize your site for SEO. Next, you’ll see Single Domain SSL.
Bluehost does come with a free SSL Certificate for your site so this add-on
isn't necessary unless you want to upgrade To a Positive SSL Certificate which will
allow you to show a site security badge On your site if you'd like and with the
positive SSL Certificate you'll have a $10,000 limited guarantee warranty by
Comodo which protects your customers.
Next, you will see Sitelock Security
Essentials. This add-on checks your Website daily for malware and protects your
site from hackers and malicious attacks. It will notify you if your site has been hacked
into and malicious code has been placed into it. Sitelock Essentials also
removes malware automatically. This add-on can be beneficial and
give you peace of mind if your site Were to get hacked into and malware is
placed on it. It isn’t necessary though. The next add-on is Google
Workspace Business Starter. This package extra provides you with an email
address ending in your domain name along with Other features provided by Google workspace
such as Gmail, calendar, chat, cloud storage With drive, video conferencing with meet, and many
more Google workspace features. I do want to note That Bluehost does come with free email addresses
ending in your domain name so this add-on isn't Necessary unless you really want to utilize
all the added features with Google workspace. Next, enter your payment information
in and click the submit button. Bluehost will now email you your Bluehost receipt. Next, enter your payment information in and click
the submit button. Bluehost will now email you Your Bluehost receipt. You are now directed to a
page where you can create your Bluehost account So you can login to the Bluehost dashboard
where you can begin in building your site. Click the create your password button. Enter a password to be used for logging into
Bluehost. Accept the terms and conditions. Click the create account button. Your
Bluehost account has now been created. You’ll now be on this page where you want
to click the create your website button. You’ll now be on a page where it’ll ask you
how much help you need with building your site. Feel free to click the one that you want.
You can also click skip this step. I’m going to click skip this step. The next page
it’ll ask you the primary purpose of your site. You can select one if you’d like. If you click into the other tab a dropdown
will show giving you more options. Under this you can also click
skip this step if you’d like too. I’m going to click skip this step.
You’ll now be on the create a website page. You can select what type of website it is and
who you are creating the site for if you’d like. Click the continue button or skip this step. You’ll now be on a page where you can name your
site along with putting in your site’s tagline. You can always fill this out later so no
worries if you aren’t sure on this yet. Click continue or skip this step. You’ll
now be on a page where you can select a Theme for your website. There’s a bunch
of pages of themes you can go through.
You can also choose a theme in the WordPress
dashboard. I’m going to be showing you pre-made Professional WordPress themes you can use
and create your site via drag and drop. Feel free to choose a theme now if you
see one you want or click skip this step. You’ll now be in the Bluehost dashboard. You’ll
see the log in to WordPress button in the top Right click this to go to the WordPress dashboard
so you can start creating your WordPress site. You can also click my sites in the left side menu. Click manage site. Click the log in to WordPress
button in the top right. You’ll now be in the WordPress dashboard where you can begin in
creating and building your WordPress site. Now we want to pick out a theme to begin creating
a site. To pick out a theme for your site. On the Far left, you will see tabs. Find the Appearance
tab and hover over it. Click themes as this is Where you can pick out a theme for your site.
Next, Click add new theme. You'll now see WordPress themes you can choose from. There’s
thousands of free themes to choose from. Now I want to show you how to access free
professionally designed WordPress themes And how to edit them easily with a drag
and drop editor and how to make any of These themes a one page website.
Type in Astra in the search field. Click the install button. Once it is done
installing click the activate button. Once it is done activating the theme you want
to find the plugins tab in the side menu. Click add new. In the search field type in starter
templates. You want to click install on it. Then click activate. Hover over the appearance
tab in the side menu. Click on starter templates. You now want to click the build your website
button. Choose Elementor for the page builder. It’ll now showcase a bunch of WordPress themes
you can build your site with using drag and drop. You can type in the type of website you want
to create to pull up templates based on that. You’ll see a bunch of categories you can
hover over and select to build your site. If you click a theme it’ll show you what
it will look like so you can preview it. Click the x button to go back to the themes page. I’ll be walking you through the steps on how to
make any of these templates a one page website. Most of these templates
link out to separate pages. This can easily be changed as I’ll show you. Something I want to mention is any of
these themes can be changed and edited To what you’d like when creating your
site. Just find a template you like and Then you can start making it your own no
matter what category the template is in. Now let me walk you through the steps on
how to choose your theme and build your One page website with the drag and
drop editor Elementor page builder. Select a theme you want. I’ll choose this
one. You can upload a logo if you’d like.
You can do this at a later time so
if you don’t have one now no worries. Click the skip and continue button. You now want
to choose the colors and font for your site. You can update these at a later time
or change them whenever you’d like. Click the continue button. You’ll now be
on the tell us a little about yourself. You don’t have to fill this out if you
don’t want too. Just make sure under Advanced options you have each one selected.
Click the submit and build my website button. It’ll begin building your website. Once it is
done you’ll be on the congratulations page. Click the view your website button. It’ll now
take you to your website and what it looks like. You’ll notice the template
links out to different pages. We will be changing this in this tutorial
so the site is a one page website. Before we begin editing. We want to turn on some
features in Elementor to make the editing process Even easier and improve your site performance.
Up at the top you’ll see your site title name. Hover over this and click dashboard. Find the
Elementor tab in the left-side menu and hover Over it. Click settings. Click features. Select
activate all. This will activate an easier editor For creating your site along with performance
features to help your site load faster. Now let’s go over how to make
edits to the WordPress theme And how to use the drag and
drop editor to create your site. To make edits to your site click the edit
with elementor tab on the top of the page. It’ll now bring you to the drag and drop editor
where you can create your site quick and easy. To make edits to a part of
the page just click where You want to make edits and start making edits. I can change A Wonderful Gift to My Demo Website. If you want to make edits to the background image
right click on the section. Click edit selection. Click style. Hover over the image and click the
trash can icon if you want to remove the image. Click over the image and you can upload a
photo to place here or click media library To upload images already uploaded in WordPress. I’ve uploaded an image into
WordPress for this tutorial. I’ll go ahead and select it to be uploaded.
You’ll now see the image uploaded on the site. I’ll scroll down a bit on the page. You can select What you want over on the left and
drag it in wherever you’d like it. If you right click on an area you can delete it
if you don’t want it. By right clicking you can Duplicate something if you need to duplicate
it. If you click the plus icon here at the Top in the editor it’ll bring you back to
the elements you can drag in to the page. You can drag something over to somewhere
else on the page by selecting it
And dragging it over to where you want it. I’ll drag a text into the page.
If you click to edit the text, You’ll be able to make edits to the text like make
it bold, you can link out a text to somewhere. If You click the settings icon you can choose to
have the link open in a new tab if you’d like. If you click toolbar toggle it’ll give you more
options like changing the alignment of the text, Changing the text color, you can undo and redo
changes here. If you click style at the top you Can then make more changes to the text. If you
click the pencil icon where you see typography. Where you see Family from the dropdown you
can select different fonts for the text. Where you see Size you can
change the sizing of the text. Next, let’s go over editing the button. I’m going to click into a button. You’ll
be able to change the name of the text. You can link the button out to where you’d like
it. If you click the settings icon next to the Link. You can choose to have the link open in
a new tab and make it no follow if you’d like. You can change the alignment of the
button, the sizing of the button. Where you see icon you can select
to not have an icon with the button. Where it says upload SVG you can upload
an icon. If you click icon library you can View icons you can add to the button. You can
change the positioning of the icon, and more. If you click into an image on the page.
Click on the image to change the image. You can change the image size, The alignment, a caption if you want to include
one, and link out an image if you’d like. If you scroll down to the next
section and hover over the section You can click the plus icon then click the
plus icon showing again to add a new section To the page. I’ll select this one. You can
now drag in something over into the section. If you click the middle icon with the
dots you can then edit that section. If you click the x button it’ll completely remove
the section from the page. If you click into a Section you can drag it up or down to move
that section to somewhere else on the page. If you scroll down to the
drag widget here section. If you click the Starter templates icon. You can click blocks in the menu and then
it’ll give you lots more page design ideas You can choose from. Up at the top, you
can select categories for blocks to show. I’ll choose a block to add to the page. I’ll click this one and then I’ll
click the import button to import It to the page to then start adding your
own content and editing it how you want it. Now I want to cover the contact us
form to show you how this works.
I’m going to click the plus
icon in the drag widget section. I’m going to click a structure for
the section. I’ll choose this one. I’m just going to drag over the WP Forms. You can select a form. If you want to make
edits to the form click edit the selected form. You can click the create a new form if
you want to create a new form. I’m going To click edit the selected form. It’s now going
to bring up the builder for the contact us form. You can hover over an area to delete it or
duplicate it. You can click an area and drag It to wherever you’d like it. If you want to add
something you can drag it over from the side. If you click Field Options you can click on a part
of the form and then make changes from the side. You can select to make this part of the form
a required or not required part to fill out. If you click advanced you can click the
part of the form you want to change and You can select between the size of the
form field for that area and then change If you want anything to show in the form
field where they input their information. You can click preview to preview the
form. Click save to save changes. When You are done click the x button and you’ll
be taken back to the editor for the page. Before we go over making your website
a one page site and editing the menu Let’s get to know the drag and
drop editor Elementor better. You’ll see publish in the top right. Click
this when you want to publish changes you’ve Made to your site. If you click the arrow
you can save the page as a draft or save The page as a template to then use as
a template for another page you create. To view changes you’ve made to your site click
the eye icon and it’ll show you a preview of your Site. If you click the desktop icon it’ll show you
what your changes look like on desktop devices, The tablet icon will show tablet devices,
and the mobile icon will show mobile devices. If you hover over the site
settings icon and click it You can change things like the colors of
your entire site, fonts used, and more. If you click the Elementor
menu icon and click history And then click revisions it’ll list out all the
revisions for your site that it has pre-saved. If you click one it’ll bring your site edits
back to how they were at the time of that edit. If you click the Elementor menu
icon and click manage website. It’ll take you to the WordPress dashboard. Now let’s go over making your website a one
page site. I’m back in the Elementor editor For the page. The top section you don’t
have to worry about linking in the menu. I’ll scroll down to the next section. Hover
over the next section and you’ll see the 6 dots. Click this. You now want to click advanced. Where
you see CSS ID type in the name of the section.
It’ll be different depending on what you have
listed on your website. For this section, I’ll name it testimonials. Next, click into
the next section. Click the 6 dots at the top. Click Advanced. Where it says CSS ID change it
to what you want. I’ll change this one to events. You can keep moving down to each section of
the page that you want to link to like about, Services, contact or whatever
is needed for your site. Once you are done make sure you click the
publish button to publish your changes. Click the preview button
icon to preview your site. Now we want to replace the current menu tabs
with new ones that link to each section we Just created making our site a one page
website. At the top you’ll see Customize. Click this. We now want to click
menus in the left side menu. You’ll see Menu and currently set to:
Primary Menu. Click this. It’ll now List out the current menu tabs. We want
to remove all of them. I’ll click Home And then I’ll click remove. I’ll do this
for each one until they are all gone. You’ll see here at the top in the menu they are
completely gone. Next, click the add items button. You want to click custom links. Where it says
URL you want to put a hashtag with the name of The section you put in the CSS ID. For the first
one, I put testimonials. I’ll put #testimonials. The link text field you can put what you
want the name of the menu item to be. I’ll Put Testimonials. I’ll click add to menu.
You’ll now see it showing in the menu area. Let’s add the next one. I’ll add #events.
I’ll name it events. I’ll click add to menu. I’ll go ahead and complete adding the rest of
mine. I’ve now added the rest of them in. Click The publish button to save the changes.
Now I’ll click each section in the menu And you’ll see it’ll take me to each section of
the page. Your site is now a one page website. Now let’s go over if you want a button on
your site to link to a section on your page. I’m back in the Elementor editor for the page.
I’ll click the button. Where you see link you Want to have a # and the name of the section you
created like earlier in the tutorial. I want this One to go to the about us section of the site.
I’ll put #about. I’ll click the publish button. I’ll click the button. It now takes me
to the about us section of the site. Now let me show you how to make
edits to the footer area of your Site along with uploading a logo,
favicon, and other customizations. From the WordPress dashboard, if you
hover over the Appearance tab in the Side menu and click Customize
you’ll be on the customize page. Click the footer builder. You can then click
an area in the footer area where you see the Pencil icon to start making edits to
that section over on the left side. If you click the plus icon you can then add
whatever you’d like to the footer area in
That section. You can then design things like the
alignment, title, content, and link colors, title And content font size, and more. You can click
the x button to remove that area from the footer. If you click the pencil icon here on the left-hand
side you can then choose how many columns you want Your footer to be. You can then click the plus
icon to add sections to that part of the footer. I’m going to click the back arrow twice. If
you click Site Identity you can then upload a Logo and a favicon which is the site icon for your
site. Click select site icon to then upload your Site icon also known as the favicon for your site.
If you click site title and logo settings you can Then change the logo to your own and make other
customizations to the logo area for your site. From the WordPress dashboard,
if you hover over the pages tab Click add new to add a new page to your site. If you click all pages it’ll showcase all the
pages on your site. If you hover over the media Tab and click on library it’ll show you all
the images you have uploaded in WordPress. If you click add new at the top you can then
upload or drag in an image into WordPress. If you hover over posts and click add new
you can create a new blog post for your site. If you click all posts, it’ll pull up
all the posts you have on your site. If you click the comments tab you will see
all the comments you have on your blog posts. You can easily reply, mark it
as spam, or trash the comment. If you hover over the plugins tab and click
add new you can then search for or browse Plugins to add to your site. Any feature or
customization you might want on your site, More than likely there is a plugin for that. You now know how to access pre-made professional
templates, how to create a one page website with WordPress and making edits to it using the
drag and drop editor Elementor page builder. That is my single page website
tutorial going over how to create A 1 page website for beginners step
by step. If you have any questions, Get in touch in the comments as I'm
here to help you with anything you need. Give this video a thumbs up and leave
us a comment letting us know if the Tutorial was helpful or not as the
comments help improve our tutorials. Be sure to subscribe to our channel
for more website tutorial videos.