Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed WordPress Basics!
You have completed WordPress Basics!
Preview
Create the main pages for your website and organize them using a navigation menu. This establishes the structure visitors will use to explore your site.
This video doesn't have any notes.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
Now that our website is fully set up,
0:05
we're ready to move into the next stage
of the course, building our website.
0:07
In this stage, we'll begin
0:11
creating the pages that make up Mike
the Frog's portfolio site.
0:12
For this project,
we're going to keep things simple
0:16
by creating two main pages,
a homepage that introduces Mike
0:18
and showcases projects, and a contact page
that allows visitors to reach out.
0:23
In this lesson, we'll create these pages
instead of our home page
0:28
so visitors see it
when they visit our site.
0:32
Okay, let's start
by creating our home page.
0:36
In the WordPress sidebar, click Pages,
then click Add Page up top here.
0:38
Give this page the title Home.
0:43
This opens it in WordPress's
default page builder again,
0:46
so don't let this confuse you.
0:49
For now, we don't need to add any content,
we're just creating the page structure.
0:51
When you click publish, you're making
the page officially part of your website.
0:55
Right now, the page will exist
but it won't contain any visible content yet
0:59
and that's completely
okay. Go ahead and click publish.
1:03
Now it gives us some options for visibility
and when we want it published.
1:07
Let's leave the defaults of public
and immediately selected
1:11
then confirm by clicking publish again.
1:14
Awesome.
1:17
Next let's create our contact page.
1:18
It's actually giving us the option
right here
1:21
which is convenient
so let's click add page again.
1:23
Name this page contact.
1:27
Later in the course,
we'll add a contact form
1:29
and some additional information
to this page.
1:31
Cool, let's publish this one as well.
1:34
Creating pages before designing them helps
1:37
keep our site organized
and makes navigation setup much easier.
1:40
Let's get back to the dashboard by
clicking the WordPress logo up top again.
1:44
Right now,
1:49
WordPress is still set to show
blog posts on the homepage by default.
1:50
Let's change that so visitors
see our homepage instead.
1:54
Let's go to Settings and Reading.
1:57
Under Your Homepage Displays, select
2:01
a Static Page.
2:03
For Homepage
2:07
select Home. We don't need to set a
post page for this project
2:08
since we're not building a blog.
Cool, let's save.
2:12
Next, let's create
our site navigation menu.
2:17
This is what visitors will use
to move between pages.
2:20
Let's navigate to Appearance, then Menus.
2:23
Let's name it Main Menu.
2:30
I won't be adding any new pages
to this project, but if you're going to,
2:35
this could be helpful to automatically add
your newer pages to this menu.
2:38
Here we have options on where we want
our navigation menu to appear,
2:42
in the header up top
or the footer at the bottom, or both.
2:46
Let's see how it looks with both first.
2:50
Let's click Create Menu.
2:53
Now we'll add our pages to the menu.
2:55
Click on View All here, then check Select
2:57
All, then Add to Menu.
3:00
Now we have these pages here and
we can click them for further settings.
3:04
Here we can change the text
to be displayed and the order they appear
3:08
If you have a large navigation menu
with submenus,
3:12
Menu Parent is where you structure
those. Let's just ensure our home
3:16
page is order 1 of 2 and contact is 2 of 2.
3:20
Perfect. Let's save our changes.
3:25
Let's preview our website
to make sure everything is connected.
3:31
Let's go up here, hover over our site
name and select visit site.
3:35
This is our home page currently.
3:40
It might look confusing
because there's no content,
3:42
but this top section is the header
3:44
and this is our footer.
3:48
Clicking our new navigation
links changes our pages perfectly.
3:51
Sweet!
3:54
Let's hover over our site name again
and go back to the dashboard.
3:56
At this point you've successfully created
the core structure of your website.
4:01
This is an important milestone
because every website begins
4:05
with organized page structure
and navigation.
4:08
In the next video we're going to open
our home page inside Elementor
4:12
and finally begin designing the layout
and content for this portfolio.
4:15
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up