Let me quickly show you how a page is
put together because once you understand
that, you'll be able to edit pretty much
anything you want. Every page is built
out of containers and the easiest way to
picture those is as the big sections
that stack down your page. Then inside
the containers are the elements, which
are the actual things you see. That's
stuff like your text, images, and your
buttons.
Let's see how that actually looks on our
home page here. On the right side, let's
take a look at our structure panel. This
is basically like a map of your website.
We'll click on this container at the
very top of the list here.
And you'll see it highlights the section
in pink. This is indicating that we're
currently looking at this container at
the top. Now let's click on the arrow
next to it to expand it.
Now inside of this container, I see two
elements. There's a text heading and a
button. And I can actually see those two
elements within the container right
here. Back in the structure panel, I can
click on the eyeball button to hide the
element.
Click it again to reveal it. And I can
also drag and reorder these elements as
well.
Just by dragging them up and down.
You can do the exact same thing with
your containers as well. If you want to
hide the entire container, just click
the eyeball.
And if you want to reorder the
containers on your home page here, just
drag them and move them into a different
position. This works for every single
page on your website. And if the
structure panel ever gets in the way,
you can actually move it around just by
dragging it or you can press control or
command I to hide it.
And then control or command I again to
bring it back. Now let's actually start
changing things. Let's start by learning
how to change the text on our website.
To change out your text, simply hover
over the text that you want to change
and then click into it.
And then from here, you can simply
highlight the text and then type
whatever you want. And then you can also
change out the text here on the
left-hand side. Once again, just
highlight this text and then just type
what you want it to say.
It's really is easy as that. On this
left-hand side here, you'll also see the
style tab.
This is how you change out how your text
looks. You can change out your fonts
here, your text stroke and shadow, and
then the color of the text as well. For
example here, I can change the text from
white
to a red color.
And if you ever make a change like this
that you don't actually like, it's super
easy to undo it. Just press control or
command Z on your keyboard.
And that's going to undo that change.
Now, how do we change out the images on
our website? Well, it's just as simple
and it works pretty similar to text.
Let's scroll down and find an image that
we want to replace. I'll replace this
one right here. To replace it, simply
click on it.
Hover over choose image, click in here,
and then you'll just drag and drop in
the image that you want.
Once your image is done uploading, go to
the bottom right and click select.
And you'll see that image is replaced
here. And with your image selected here,
you can change out the resolution, the
caption and link. And if you go to the
top and click into style,
you have some other options here for
resizing your image. So, just in case
your custom image doesn't look right on
your website, you can adjust it here.
Next, let's learn how to change out the
buttons on our website. For my website,
my button is all the way up at the top.
And to customize this button here, just
go ahead and click on it.
And check out these settings here on the
left-hand side. You can start by
changing your button type. You can
change out the text here as well. For
example here, I'll change it from get
started to say
contact me.
You can also change what page the button
links to. So, for example here, I'll
delete this hashtag
and I'll type contact.
And I can link this to my contact page.
Then at the top, you can click into
style,
and you can change how the button looks
on your page. Next, let's talk about
adding in new elements because you're
not just stuck with what the template
gives you. To add in a brand new
element, let's go to the top left and
click on this plus button here.
Let's scroll down.
Here you can drag in containers and
grids and you'll find your elements down
here as well. You have stuff like text,
images, videos, buttons, and some other
cool elements here as well. To drag one
in, simply hover over it, drag it into
your container, and drop it in here.
Now, if you want to delete this element,
simply right click on it,
go down, and click delete.
And you can do this for containers as
well. To delete an entire container,
just hover over it, go to the top and
find the X, and you can delete it here.
You'll also notice these icons here at
the top. We're currently looking at our
website in desktop view, but you can
also check how your website looks on
tablets
and mobile phones as well.
Your template will already adjust itself
pretty well for tablet and mobile, but
it's worth a quick look and anything
that you tweak in the phone view will
only change the mobile version. So, it's
not going to touch your desktop layout.
Once you're happy with everything here,
go to the top right and click publish.
This will save your work and push it
live for the world to see. And if you
haven't gotten started just yet, don't
forget to go to this link on screen
right here or click the first link down
in the video description to get access
to the lowest price available for your
hosting. Thanks for watching this video.
If it helped you out, make sure to leave
a like and subscribe for more tutorials
just like this. With that [music] said,
I'll see you in the next video.