skip to Main Content
HostGator’s New Tool For Building Websites

HostGator’s New Tool for Building Websites 2021 launched

what’s going on guys so recently
HostGator has launched a new website
builder and it’s called the gator
website builder and I’ve tried it out

HostGator's New Tool for Building Websites
once and it’s pretty cool so in this
a website I want to walk you through how to
make a website with the Gator website


building and from my experience playing
around with it so far I’ve seen that
it’s a lot like quicksand Squarespace in
the sense that it’s very beginner
focused with a really easy to use
interface so with that said let’s go
ahead and make a website with the Gator
website builder oh by the way new Mike
new sound quality new & improved
tutorials oh yeah all right let’s do
this
so first things first just open up your
browser and we’re gonna go up to
hostgator.com and then from here just go
ahead and click on website builder and
as you can see they’ve got a few
different packages so they’ve got a
starter a premium and an e-commerce so


it’ll all just kind of depend on what
you want this website for but in most
cases you can use the starter package
and that’s got free hosting domain name
drag-and-drop builder templates all the
good stuff SSL certificate which is this
little lock symbol up at the top that
lets everyone know that this website is
safe and secure so we’re gonna go ahead
and click on buy now for the starter
package and so from here we can get our
domain name so if you click on find a
new domain name and type one in so I’m
just gonna go ahead and do my dope
domain name we’ll just do my dope domain
and buy dope I mean you know dope isn’t
cool not dope as in drugs so let’s go
ahead and click on get domain and look
at that it’s available awesome so now
we’re just going to scroll down and make
sure our plan says starter right here
and then here is where you can choose
your billing and these prices that you
see here are actually going to go down
because I got Hostgator to give me a
custom coupon for all my visitors here
at creative Pro websites YouTube channel
so that you can get an awesome discount
on all this stuff so it’s gonna go down
by about 55% so obviously the longer
that you commit to so say two years here
it’s
to be cheaper and if you do monthly
it’ll be a little bit more expensive but
it just depends on how long you want
this for honestly my recommendation is
to do the yearly because you got your
domain name for a year no matter what so
you might as well have your hosting for
a year as well and my recommendation for
starting an online business is to give
it a good years try don’t just do it for
one month and then kind of back out so
it didn’t go the way you thought
honestly my first online business took I
think about eight months it’s about
eight or nine months it was in a while
so that’s why I recommend doing the
build yearly option okay so now we’re
just gonna scroll down and put in an
email and a password for our account so
I’m gonna do my email and a password and
now here is where you can put in your
billing info so I’m just gonna do that
really quick all right and scroll down
and here is where we’re gonna put in
that discount code to make this a bit
cheaper so you can just replace this
code here just delete that and just type
in Themeprobably and then click
Submit and what this will do is give you
a little bit better discount and give
you a fifty five percent discount so
would normally be around 110 but this is
knocking off a good sixty dollars and
it’s gonna make it a solid 50 and this
coupon code is my affiliate link so I do
get a little bit of Commission off of
this and it kind of helps fund these
free YouTube tutorials that I put out
and it’s at no cost to you and it
actually makes your price cheaper so
it’s kind of a win-win for both but if
you don’t like me and you don’t want to
use it then that’s totally okay I’m
still gonna do this tutorial so now all
you have to do is click on confirm
purchase and it’s now setting up my
account
awesome so our orders being processed
now and it’s going to ask you if you
want to use some of these social media
marketing services you can just click on
continue and ignore that and then it’s
going to give you your order summary
which looks right so we’re just gonna
click on done awesome so here is where
the fun part begins so we’re gonna
choose a template and then we’re gonna
replace all the text and images and so
on and
get our own it’s always a good idea to
start with a template because you’ve
already got the foundation laid for you
so you don’t have to worry about
starting from complete scratch so I’m
gonna scroll all the way to the bottom
and I’m gonna choose this spa one I
don’t know why just the layout of it is
pretty cool so if you want you can just
click on preview and this will allow you
to see what the website is gonna look
like so I really like this cool parallax
effect going on that’s why I wanted this
one I really like the text here so I’m
gonna pick this one so what you can do
is just go up to start editing and
they’re gonna offer you this free tour
so they’re gonna say hey let’s give you
a nice 15 second tour I mean I got 15
seconds so I’m gonna click rock on and
see what that does so it tells you where
your pages go and you can switch between
pages it’ll show you how to add a page
I’m just gonna click Next because I’m
gonna kind of show you all this stuff
anyway it’ll show you how to edit from
mobile up here and how to add different
elements to your website so images text
social feeds etc next we can add buttons
so that’s pretty cool and that was 15
seconds so I’m going to end the tour and
then just click on close cool
so like the tour said if you want you
can add some pages here by clicking on
pages and you can add some new ones you
can edit these current ones so right now
I’m on home if I wanted to go to
services I could just click on services
and it’ll take me to that or the contact
page but I’m gonna go back to the home
and you can just add pages by clicking
on this button right here and you can
edit all the different sections on your
website by clicking on sections and then
you can just click on whatever you want
that you want to edit and it’ll kind of
drag you there or if you want to add
something like a new element to your
website you can just click on elements
and all you have to do is drag and drop
these in so if I just wanted a simple
button I could just drag and drop that
button in like that and just kind of
place it wherever you want it so that is
awesome and if you want to delete
something you can just click on the
little trash can that says delete but we
started with the template so we’ve got a
lot of the foundation already laid for
us really all we want to do is replace
these images replace the text and then
we’re pretty much good to go and of
course like it said in the tour as well
you can click on the little
mobile button up here and that’s gonna
show you what it looks like on mobile so
we’ll just click on okay let’s go and as
you can see this is what it now looks
like if we were to scroll on mobile so
we got a few things to fix here this is
kind of out of whack but the rest
doesn’t look too bad
so let’s go back to desktop okay so let
me show you how to replace this image
all you want to do is click on it and
this little menu will pop up and all you
want to do is just click on change style
and then you’ve got this new menu here
so you can add a background that’s a
color you can add a border to that and
overlay so if you drag on the little
border slider over here it’ll add a
border you can also change the roundness
to give it some rounded corners and you
can change that border color up here but
what I want to do is just replace this
image so if I just click on the image we
can now upload our own so you can add
your own image or if you go up to stock
images then Hostgator has provided you
with a bunch of royalty-free images that
you can use but I’m gonna go to add
image and upload my own so just go to
upload images and you’ll see a bunch of
dog images and this is because I’m just
gonna create a fake dog grooming
freelancer page let’s just say I’m a dog
groomer which I’m not but let’s make one
because it’s Monday when I’m recording
this and who doesn’t like a good boy so
let’s put a bunch of good boys all over
this page let’s let’s do this guy right
here and then click on open and now all
you have to do is select the image to
make it checked and then just go over to
place and then there is there’s a good
old happy boy on my home page so now if
you go up to this little ruler section
here that says size and position and
just click on that you can change the
height of this entire thing so I’ll show
you at the bottom if I just change the
height and just start – in it like that
the whole thing is gonna move up so if
it’s really big and I wanted it to be
smaller I’ll just change this to say a
450 and now it’s you know really small
which I’m not going to do so if you want
to undo anything just click on control Z
and that will undo that cool so
we’re gonna go up and hit the X on this
and what we’re gonna do is edit this
text here so instead of spa for the soul
I’m gonna say what I do so let’s say
professional dog grooming and I’m going
to edit this little subheading as well
so all you have to do is just double
click it’s that easy and I’m gonna
change this subtitle to something catchy
and if you want to make it smaller all
you have to do is highlight all of this
text and just change the font size so
I’m gonna change that to say like a 30
looks pretty good and if you want to
change the actual font of this to a
different type of font all you have to
do is highlight it and then you can go
up to the font family and you can just
go down to more fonts and that’s gonna
open up this entire menu of all
different types of fonts which is really
cool so all you have to do is click on
one and it’ll change but for now I’m
just going to keep the basic font that
it’s got so with that said I’m also
gonna go up and change this as well so
the heading text so this could normally
be a logo or your name whatever you want
to put so let’s say I’m a freelance dog
groomer I’m gonna put my name and I’m
going to double click that and I’m gonna
change that to a different font so just
do more fonts and I’m just gonna pick
one of these that looks pretty good
alright so now we’ve just gotten this
autosave so it’s gonna come up with name
your site it wants us to save our site
so I’m just gonna call mine by my domain
name so I’m gonna do my dope domain and
then just click on save my site so
another cool thing about this is if you
just click on the section so just click
anywhere you know around the text this
menu will be here and all you have to do
is click on animations and you can add
these cool animations for the text to
come in so you can just do a simple fade
like that so if you hover over these you
can see them all so I’m just gonna do a
simple fade and then just click on
finish so I’m gonna scroll down and edit
this section as well and if you want to
add a section between these two let’s
say you forgot something and you want to
put something in all you have to do is
click on this little plus button and
this will allow you to add a new
section so you can make a blank one you
can get double images videos text and so
on so you would just click on it and
then it’ll add just kind of a filler one
there and if you go to this menu on the
left you can change that to any type of
layout that you want and of course you
can replace all the text all the images
and so on so let’s just say I wanted to
put something like that there I could
just click on it and it’ll show up and I
can replace all of that and then
whenever you’re done you just click on
apply but for now I don’t want this
because I like what we had so I’m just
gonna go ahead and click on the delete
button and then it’s gonna say do you
are you sure that you want to delete
this of course yes
so delete so from here I’m just gonna
change this person’s name to my name and
of course I’d want to write a bunch of
stuff in here about me and my business
but for now I’m just gonna leave it and
I’m gonna replace these images over here
so these images have transparent
backgrounds that’s why you’re able to
drag them around and they kind of
replace the text without showing any
sort of background so if you just click
on the image and then just go up to
change image we’re just gonna upload a
new image and I’m gonna put in these
scissors cuz it’s a dog grooming website
so just click on open then select it and
then just go down to place and it looks
a little crazy right now so what we’re
gonna do is drag it in the middle and
get this thing resized so if you just
click on a corner and you drag it out
and you kind of drag it up you can
almost kind of whip it back into shape
there I don’t even know how to describe
what I’m doing you just kind of drag
around until you get it in the spot that
you want like a rough size and then all
you have to do is right click in the box
and then you can just say fit frame to
image and that’ll kind of make it
perfect so then we can just grab this
little rotating tool right here and then
we can kind of rotate it however way
that we want so I’ll do something like
that and I’ll drag that over to
somewhere about there that looks pretty
good
and I’m gonna replace this one as well
so I’ll do that really quick
and now I’m just gonna go ahead and
replace the images and the text for
these sections below as well because I’m
gonna speed up this process now that
I’ve shown you how to do it also if you
want to move anything all you have to do
is hover over it until you see these
four arrows like that a little symbol
right there it’s usually on the outside
edge of whatever element that you’re
dragging around and you can just click
on it and drag it around anywhere that
you want and it’s got these cool rulers
so if you snap to something it’ll kind
of turn like pinkish purple and it’ll
kind of get stuck in that one spot so
that’s allowing you to keep everything
within reasonable constraints so that
nothing gets cut off when you’re viewing
this on mobile or maybe a tablet or so
on so I’m gonna keep replacing
and here while I’m on this video section
so I’ve just added this video and kind
of dragged it around or resize
everything and if I want to replace this
video all I have to do is click on it
and then just click on change video
goodbye
mmm and let’s put in our own so it’s
asking you to put in a YouTube URL so
I’m just gonna go to YouTube and I’m
gonna find a video of dogs getting
groomed so I’ll just say say dog
grooming and let’s just grab this little
pup err right here copy that URL up at
the top and we’ll just go back over to
the change video section and we will
highlight this and just delete it and
we’re gonna put in our own so just right
click and then click paste and then from
here just click on OK
and now we’ve got our own little pup err
here so let’s drag this to resize it
cool so we’ve pretty much got this
entire website ready to roll
looks more like a dog grooming website
now mainly just an example to show you
how to use this website builder so if
you’d like to preview what the website
is gonna look like
all you have to do is click on preview
up here at the top so this is what its
gonna look like – the gray area up here
that says Gator by Hostgator that’s not
going to be there but the rest of it
will be and it looks awesome so if you
scroll down everything seems to be
looking pretty good and you can select
your video and that’ll kind of pull it
up and you can play it which is really
cool so I’ll click on the X and this
contact form already has your admin
email hooked up to it
so whatever email that you signed up
with for the Gator builder is where this
email is going to go so it’s gonna get
sent over to your Gmail or whatever it
might be and you’re gonna get a
notification in your inbox so let’s just
go all the way back up and we’re just
going to go up to finish preview and you
can edit all of your other pages so
we’ve got a services page and a Contact
Us page that are separate from this one
so if we wanted we could just go to
pages and you can manage them here or
you could go up to current page
and change that from home to whatever
page you want to go to so services you
can edit this the exact same way so I’m
gonna go back to home and if the
template that you selected maybe doesn’t
have some things that you do want to put
in you can just go up to elements and
you can find them all here so you’ve got
buttons
you’ve got other contact forms Maps and
so on and all you have to do is drag
them in so let’s say I wanted to put in
this map I would just scroll all the way
to the bottom and I could just drag that
in anywhere I wanted so obviously it
looks a little crazy here we’d have to
resize this box and put it in so I’m
just gonna delete that because I don’t
really need that map but if you go back
up to elements they’ve just got so many
awesome tools in here
so feel free to plunk around try some
stuff out they’ve got live feeds so if
you want your Instagram live feed in
here you could just drag that in so it’s
asking if you can authorize your
Instagram account so if you want you can
just go down and click on the green
authorize button and there comes up my
Instagram feed so let’s just say I
wanted to add this real quick so let’s
just go up to the plus button and we’ll
add a whole new section just for my
Instagram feed so I’m gonna click on
blank to add a whole blank section and
what I’ll do is just go over to change
style and then go to the size and
position ruler and I’m gonna make that
height more like a 500 not 5500 there we
go and I’m just going to drag this
Instagram feed up into that section just
like that but there’s our little rulers
so we’re gonna snap to that just like
that and what I’m gonna do is also go to
elements and then go down to text over
here in the left-hand menu and I’m just
gonna select a heading text so I’ll just
do a heading 3 and then I’ll just drag
that towards the middle and I’ll replace
it with follow me on insta and then I’ll
put my Instagram handle so I’ll just
drag this over to resize that give you a
little more just like that
there we go I’ll drag this up it just
takes a lot of dragging around to get
things where you want it so the sections
still a little big so I’ll go back to
change style and then back to the ruler
and then I’ll just change that height so
there we go so I’ll just click on the X
and now we’ve got a little Instagram
section so that’s a cool tool so
anything you need to find is in the
elements section and also while I’m here
since I have a blank background on this
section you can also go over to design
and you can change the background
textures and colors of the background of
your website so I could just select
different colors and so on which is
really cool different patterns there’s
lots of fun stuff that Hostgator is put
in here but I’m a fan of simplicity so
I’m just gonna go back to white and then
just click on the X ok so finally we’re
just gonna publish our website and make
it live for anyone to see so all you
need to do is just go over to the
publish button and click on that and
it’ll say is your site ready to go and
of course it is and it’ll say that it’s
available at my dope domain Gator dot
site but we’re gonna actually change
that to my dope domain.com but for now
we’re gonna leave it as is and just
click publish my site cool so next we’re
just going to go up to this little
hamburger symbol at the top left and
then we’re just gonna go down to manage
sites so this is where we’re gonna
handle our domain name so just click on
that awesome so it’s going to give us
this little message right here that says
you have a free domain name included in
your subscription and we’re just gonna
click on a claimed domain and now our
domain name comes up so it says my dope
domain.com which is awesome and if it
doesn’t just type that in and you will
find your domain name so in that case
mine is right here so I’m just gonna
click on the free button everybody loves
a free button and it’s gonna tell you
that your first year is completely free
right here and it’s gonna say after that
it’s just 1995 a year which is pretty
standard so just go down to the next
button and click on that and then it’s
going to tell you that it’s got domain
pride
see protection included so what this is
is it protects your information so it
doesn’t matter what hosting company
you’re going with your information will
go to a public record if you don’t have
domain privacy protection and this means
that spam people are gonna be able to
contact you and say things like oh I’m
gonna help you build your website and
we’re gonna market it and this and that
it’s super annoying so trust me this is
the best thing to have included and it’s
free so we’re just gonna go down to next
and then just simply click on confirm
purchase awesome so now our new domain
name has been sent and is now pending
approval so now all we need to do is
click on the finish button and now if
you go over to my sites again and then
you just go right back over to the
domain section this Auto refresh and
you’ll now see your new domain name show
up right here and now if we just simply
go up and open up a new window and type
in our new domain name our site will now
show up boom awesome and our site is
looking good okay guys so that was a
walkthrough of how to make a website
with the Gator website builder and I
would say that it is just as easy to use
as wicks or Squarespace or any other
drag-and-drop website builder so it
really is perfect for beginners and I
highly recommend playing around with it
especially if you’re just getting into
making websites alright guys so feel
free to give this video a like if you
really enjoyed it and if you want more
tips tricks website tutorials for making
awesome websites then please feel free
to subscribe to my channel I’m posting
out new content almost every week and
rumor has it for every new subscriber
that I get another clownfish finds his
long-lost son in the open ocean alright

This Post Has 0 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

Back To Top