How to Build a Conversion Focused Website From Scratch In 55 Minutes | Thrive Theme Builder Tutorial

 In this review, we'll walk through how to build a conversion-focused WordPress website starting from zero, and before I go into WordPress and start building pages and stuff. Let me just quickly


define what I mean by conversion focus. This is the differentiating factor here. This is what makes this tutorial different. You see most websites and most website building tutorials most

themes and WordPress plugins. 

Soon we are basically concerned with making a website that looks nice but a website that looks nice that's really secondary.

Of course, we want our website to look nice but the real job of our website is to convert visitors. So the website serves some kind of a business goal may be. You want to build a mailing list of subscribers.It may be you want to get customers for your product members for your membership site coaching clients whatever it is the website has some kind

of a goal, some kind of a conversion goal.

That a good website does a good job of moving people towards that conversion goal and most websites quite frankly. Do

a terrible job of doing this so in this tutorial we're not just talking about. How to make a website period and we're not talking about how to make a website that looks nice.

We're talking about primarily how to make a website actually serves your

business.We will pass four different conversion checkpoints these are like the main checkpoints  We will pass and sometimes revisit as we go through the site those four points are first of

all clarity readability and structure. So your website has to be clear and easy to

understand people have to be able to easily read the text on your website and understand.What can they get where can they navigate to to get what they're looking for and so on that is clarity

readability and structure and right

there that's where most websites already fail so we'll make sure that we have that the second point is speed optimization

nobody likes using a slow website so

we'll take a look at how to make our

website as fast as possible the third

point is calls to action we want to have

explicit calls to action throughout our

pages throughout our content to

basically tell people hey sign up to my

newsletter or hey

check this thing out you know call me to

shed you a coaching call or something

like we want to call people to take a

conversion focused action and finally we

have what we call conversion pages where

the entire page has the purpose of

driving people towards a conversion goal

such as a sales page to sell your

product and we will hit on all of these

points in rapid succession in this

tutorial now let's get started with that

I am in my wordpress dashboard and as

you can see this is basically empty is

nothing going on here yet and we will

start with some very basics one thing in

the basic settings that I would

recommend you check is go into

permalinks that's settings permalinks I

recommend using the post name permalink

so that is when your URLs will simply be

your website comport slash post name

instead of having dates and categories

and so on and there as well or IDs or

something like that those are basically

the neatest nicest looking URLs that is

one factor that can make your website a

little more user friendly in general

good news is in WordPress basically all

the basic settings are good and you

don't have to worry about tweaking

things very much next let's look at

plugins so if we go to plugins right

here you can see I've already installed

the Thrive product manager which we'll

get back to later but there's nothing

else and we can go on add a new and here

we can add some plugins now here are

some recommendations first of all don't

install too many plugins right that's

one of the mistakes that a lot of

WordPress users make is they fall in

love with you oh I can add this thing I

can add that thing and so on in the end

you've got 50 plugins and your site is

super slow and breaks all the time

that's not a good idea so try to keep

your plug-in list lean but here are just

a couple of simple recommendations if

you're going to have blog posts with

comments active I recommend this plug-in

right here

the Akismet anti-spam plugin so you can

install that directly from here and then

also activate it from here another

plugin i recommend is an SEO plugin of

some sort and the recommendations there

are either

Yoast SEO or SEO press so if we go here

and we type Yoast for example this will

show us the search results and this is

the one plug-in I recommend

and the other one is SEO press and both

of these are very very similar but you

should have one of these two plugins

which will take care of your site's SEO

settings and give you a better chance of

ranking in search results and then one

of the things we're going to do is we're

going to build the basic structure of

our website right away so before we

start fiddling with themes and pages and

so on we will build the basic structure

of the website and here's something that

can help you do that

first if you type in faker press you see

that there is a plug-in called faker

press and you can use this plug-in to

generate some dummy posts so if you have

a completely new installation with no

content yet it can be difficult to work

with your theme design with your website

design because there's no example

content you can look at the get an idea

of what does a blog post look like this

here is the solution on a brand new

website install faker press and generate

10 to 12 blog posts they'll just have

like dummy content and some random

featured image and you can use that to

make it easier to design your website

before you have any content another

thing I recommend is if you type in

privacy policy you'll see that there are

various plugins that can help you

generate legal pages such as privacy

policy disclaimer page Terms of Service

and so on and one that I can recommend

here is this one here although I'm sure

I haven't tested all of them right

probably many of them are good but this

is one that you can use to generate your

basic pages that you have to have on

your website such as privacy policy

disclaimer and so on so that is another

step install one of these plugins

generate the basic legal pages that you

need on your website and then let's go

into pages so for this I'm going to go

to pages and add new and here we can add

pages I'm going to create a page called

about and we're just going to give that

the title about and then I'm going to go

ahead and publish this page this empty

page right away so I just want to have

that page because I know that eventually

I'm gonna make it about our page I'm

gonna fill this with content but I want

to have it already and I'm gonna

continue adding some pages like that I

can make this bit easier for myself by

unchecking the full

screen mode here so I get my menu back

here that makes the whole thing a bit

user friendly so I'm gonna click on add

new again and I'm going to create

another page that I will call lead gen

page and in this case what I'm going to

do is we just save the draft here and go

to document permalink I'll call this

something else I'll call this free guide

so as you can see here this changes what

the actual URL of this page will be and

I don't want that to say lead gen page

so free guide is better again I'll go

ahead and publish that so I want to have

a page where I simply send people to my

mailing list give them a people give

them a reason to sign up to my mailing

list then once more let's hack hit add

new again

and I'm gonna call this the sales page

and same idea I'm gonna save the draft

that gives me a permalink setting here

and I want to give this a nicer URL as

well now the demo site I'm gonna build

here is gonna be a photography themed

website so on a photography themed

website maybe I'm selling something like

a photography course or something like

Lightroom presets filters things like

that so I'll just call this Lightroom

presets and again publish this page now

once we've done all that if I go to all

pages right here you can see we have

about disclaimer Lee Chan previously

polished sales page and the sample page

is the one that was already there in the

new WordPress installation this is a

very basic structure of the website the

other thing that I have here that you

can create using faker press is a bunch

of posts so as you can see I've made

some photography themed posts here to

match the the demo of the site this is

what I start with this gives me kind of

the skeleton of the site that we're

gonna start to build now the next step

is I'm going to be using thrive theme

builder and thrive architect as the

plugins for building the theme and for

creating conversion focused pages and to

do this let's go into plugins and I'm

gonna activate my thrive product manager

plug-in so at this step you would want

to log into your thrive themes account

download the thrive product manager and

install it and then activate it as I

just did when you

click on drive product manager once

you've activated it you will be asked to

connect it to your thrive themes account

and that will then automatically give

you access to all of the thrive themes

products you can access and like I said

what we want is thrive architects I'll

check this and the shape shift theme

which is the first thrive theme builder

theme so I'll install this and simply

wait for this process to finish and then

I get this success message right here

and I click on the blue button go to

theme builder dashboard this takes me to

the beginning of the thrive theme

builder setup process and we'll walk

through this together and another now

you can see here in the sidebar we have

thrive dashboard that is added once you

install a thrive themes product so

that's how you can get back here it's

thrive dashboard thrive theme builder

now this here's the good news this is a

setup wizard that walks you through step

by step everything you need to build

your website so really you can just run

through this wizard and without even me

explaining anything about it you'll end

up with a pretty good website but as we

go through this I will add some notes

with the idea of conversion focus in

mind so let's get started so I click on

get started and it asks me to upload a

logo for my demo site I've already

uploaded one here you can simply upload

any kind of logo image file and that

will be used in the header and

everywhere else on your site where the

logo make sense so I'll click on choose

and continue the next question is what

is your main brand color now don't worry

about this if you don't already have a

specific brand color you want to use you

can use anything you can keep this blue

and decide later you can always change

this later and you can also kind of just

wing it so I'll just go with you know

some kind of an orange tone because

again doesn't matter that much I can

always change that later so I'll just go

with this choosing continue and you see

right away why it asked me about the

brand color first because as we go into

the setup wizard you can see that for

example this button is already using

this orange brown color that

selected so as we build outside we

already see our own colors applied now

what you can do here is basically we're

gonna start choosing components of the

sides step by step and there's two

things you can do you can either use

your keyboard keys left and right to

scroll through different examples or you

can click here to load different header

examples in this case or you can click

on this item here to open a whole menu

of or a gallery that you can choose from

and as you can see there's all kinds of

different headers here that we can

choose from I'm gonna go with one that's

pretty simple we'll click on that it

gives me an idea of what it actually

looks like that looks good I'll click on

choose and continue that moves us down

to the footer where the same rules apply

I can scroll through different examples

or footers and see them loaded in like

this or I can click here to see a

gallery now for my footer I want

something really simple to begin with I

don't have that many pages or anything

you know at some later point if I have a

website with loads of pages maybe I want

to have one like this with lots of links

and things but right now I want

something very simple for example this

here so let's insert that choose and

continue and now we get to the home page

and this is one of our first really

important conversion checkpoints so by

default in WordPress your home page will

simply show a list of blog posts with

the latest one at the top and then going

down in chronological order and you can

still have that you can choose this

option here to get that but from a

conversion standpoint that is not a good

idea because really you should think of

your home page is an important landing

page on your website and if you think

about what does the home page need to do

it should communicate what your website

is about and who it's for and what to do

next and if you simply show your latest

blog posts it's very hit and miss kind

of depends on what the last thing you

published is someone could land on your

home page and see something they're

really interested in and then there's a

chance that they become you know they

read your post they learn more about you

they become a future customer but

there's also a chance that the latest

few posts just don't appeal to them that

much

and then you've lost them forever that's

really not a good kind of roulette to

play on your home page so instead we

should have a specific landing page as

our home page that's independent of the

blog page and that's what we're gonna do

so in thrive the milder we can generate

a home page and it gives us the same

approach right here so I can scroll

through different home page layouts and

here this this is really handy because I

can actually see directly what this home

page layout looks like with demo content

right there so we can scroll through

these different options and see what we

have and as you can see this is the kind

of home page you're talking about at a

home page where you can clearly

communicate with text and imagery and

these elements like this grid here you

can communicate what your website is

about who it's for and give people a

clear thing to do next and also we can

click here to see a whole gallery here

of available pre-made layouts and again

you can edit all of this later so I'm

gonna go with this personal branding

home page to start with and here again

you can see that it's using my brand

color right it's using this orange that

I chose for the icons for the text

highlights and everything like that so

that's really cool all right

let's stick with this for the moment and

click on choose and continue next up the

single blog post so here when you write

a blog post you publish a blog post the

question is what does that look like

when someone lands on that individual

blog post and same idea right you get it

by now

we can choose from different pre-made

layouts and I'm going to choose one of

these more or less at random because

we're gonna get back to this let me just

choose this one maybe and that looks

good enough let's choose and continue

then we come to the blog post list so

this is what does the page look like

that lists all of your blog posts and

again we can choose from different

layouts right here now in terms of

conversion focus and in terms of clarity

and making your website easy to navigate

here's a simple rule you can follow we

have some layouts with with kind of a

great layout that tend to show a lot of

posts on very little space so here as

you can

see if I scroll down a bit basically

seeing nine posts all at once and this

can be great if for a website where I

publish frequently this kind of layout

can make sense if I only publish like

once or twice a week then most of the

times if someone comes to this page

they're seeing the same thing again so

having a layout like this is probably

less ideal so for a slower publishing

schedule or also if you think about if

you if you write loads of little news

articles then a great layout is a good

idea if you write epic posts every once

in a while then a layout like this might

make more sense which kind of gives

every single post a bit more weight I'm

gonna go with this click on choose and

continue and then we finally have the

page layout so that is what does a page

not a blog post look like and once again

same idea we click here and we choose a

layout that we like I'm gonna keep this

very simple I just have a page with

content and we'll get back to that later

all right

choose and continue and then finally we

have the question of menus so if we have

existing menus already on our site we

can choose which one is the header menu

which one's the footer menu but in this

case we don't have menus yet so I'm

gonna continue without choosing a menu

and that concludes our run-through the

initial setup wizard so right now if we

actually just go and look at the website

as you can see this is already coming

together we have a home page where we

can start editing the content we have a

blog page and we have basically all our

basic templates set up so that's a

pretty good start now let's continue

down the side here so we've completed

the basic setup wizard we also have a

branding tab right here we can change a

few things we have already set a color

but you can always come back here and

change that color and that will just

kind of change the color accent across

your whole website we have a logo option

and here as you can see we can actually

see this in our footer here this logo

here doesn't look quite right because

it's on a dark background and while this

one looks fine because it's our light

background and we actually have a

function for this so we have a dark

version and a light version of the logo

so

click on this here and I can choose a

light version of the logo that's made to

look good on dark backgrounds and then

that will be automatically used in

places like this so that's one of the

things we can do in branding plus you

can upload a favicon and the favicon is

the little icon that you see next to the

browser tab in a browser so you can

upload an image it should be a small

square image and the most important

thing is it has to be scalable so you

can upload an image that's let's say 200

by 200 pixels but it should have ideally

a transparent background you could use a

PNG for this and you have to make sure

that it looks good at a very small size

because again just look at how small the

icon next to a browser tab is that's at

that size and she still needs to be

recognizable so you can't have a text

logo or something like that basically

won't be readable at that size but here

is where you can upload that next we

have typography and this is one of the

ways in which you can change the overall

look and feel of your website let me

just quickly show you how this works so

we have this set here we can expand this

this gives us an idea of what the

typography looks like across our whole

website and I can go ahead and edit this

and editing typography works in groups

so I can click on any individual

typography element and create a rule

that basically says the h1 heading looks

like this on my website or the paragraph

text the default paragraph text looks

like this on my website but I can also

edit this in groups so if I click here

for example you can see that there's a

breadcrumb navigation that says heading

one is part of all headings this group

here and that is part of all elements

all right

so let's do all headings and here I can

change what I want this to be so I can

choose let's say open sounds and I can

choose what the regular font weight is

and what the bold font weight is so

maybe I want the bowl to be a bit bolder

and then apply that and as you can see

this has changed all of my headings all

at once so I don't have to click through

each one if I want to update this font

in general and this is how we control

the fonts on our way

sighs I'm just gonna go ahead and save

this change I just made and then head

back here so this is how you can change

the typography across your entire

website next we have templates and we

will get back to this in a bit this is

where you can control and edit all of

the templates we've already chosen and

created so far and next let's go into

site speed as I said the speed of your

site is a pretty significant factor for

conversions because if your site is slow

people generally won't stick around now

speed optimization on website is

massively complicated and technical and

we have made this as easy as possible

for you so we have these three steps

available let's just start with the

first one

unification and caching we have two

caching plugins that we recommend and

directly integrate with with recommended

configurations this is going to do a lot

of the technical heavy lifting to make

your site faster so the way this works

is we can choose one for example WP

fastest cache install this activate it

and then once its installed and

activated it says configure for optimal

caching with thrive simply click on this

click on yes and this will Auto

configure the plug-in to work as

perfectly as possible with thrive theme

builder that's it your whole caching and

this right here usually takes easily

half an hour or longer but it's done

your caching setup done next up we have

image optimization so images on your

website generally would slow down a page

much more than other elements because

you know a bunch of text is very small

in terms of file size but an image can

easily be half a megabyte or and

megabyte or even more so how do we fix

that again we have two recommended

solutions one is optimal which is an

advanced image optimization plugin for

WordPress which we recommend it has a

free plan but for a certain amount of

visitors or a certain amount of usage

you will have to pay and it's worth

paying for this it's a really good

solution if you want to keep your budget

lower and not pay for a solution we have

Smosh as the alternative this is a free

plugin that you can use completely for

free

so that's the alternative but I

recommend that you activate one of these

two I'm gonna go ahead with optimal

again basically the same thing we made

it as easy as possible I'm gonna install

this this will send you to the optimal

page where you can either register if

you don't have an account yet or if you

already have an account you enter your

key we can register directly inside the

interface here we'll get an email with

an API key which we enter here and then

we click on connect and then once we've

done that we see a status update here it

starts optimizing the images on the

website and before you start fiddling

with the settings here let's go straight

back to thrive dashboard and thrive

theme builder so once we've made this

connection let's go back here and go

back into side speed and image

optimization so this is where we started

and here once again once the plug-in is

actually installed and activated you can

see that there's a button that says

configure for optimal use I click that

click yes and we're done ok so again

we've done all the work for you here

that's possible to do to get image

optimization set up as perfectly as

possible and finally we have accelerated

mobile pages as I'm recording this this

is in beta this is a way for you to have

a special amp version of things like

blog posts which are basically more

speed optimized buzz but have fewer

features it's kind of a restricted but

even faster way to build pages and we

have amp features you can click on this

link to learn more about it and decide

whether you want to activate this on

your site or not ok there's one more

kind of basic structural step that we

need to do before we go into further

details let's talk about menus we can go

to appearance and menus right here

because in the wizard as you remember we

skipped that step and what WordPress

does is it generates a menu

automatically which just has all your

pages and that's not great obviously so

we're going to edit this I'm going to

call this main menu and we'll change the

label of the generated homepage that's

the home page is thrive theme builder

generator for us we'll change that to

then blog is good about is good

disclaimer doesn't belong here let's

remove that lead gen page here let's

also remove that previously policy let's

move that sample page we don't want to

remove that sales page yes why not but

let's change this to you know a call to

action get my thing by now app whatever

so I'm gonna call this again Lightroom

presets if we assume that's my product

let's just call it that and then I'll

click on create menu so now I've got a

menu called

main menu with these four menu items

let's create a second menu create a new

menu menu name footer menu and here I'll

click on create here we want basically

disclaimer privacy policy and that's it

these two pages we want in here we can

rearrange them like this let's save that

and there we go okay so now we have

these menus generated and with this we

have all the basics on our website so we

have taken care of readability clarity

and structure with the menus as well and

readability and clarity by the way a lot

of that is already baked into everything

that you find and thrive theme builder

so everything we do especially when it

comes to typography and readability

everything is already optimized to be as

clear and readable as possible and then

the other aspect of clarity is gonna be

your messaging the actual words you use

on the pages now let's move into the

next level of conversion optimization

which is about calls to action and lead

generation and things like that now to

do that let's go into the Thrive

dashboard and set some things up here

here one of the most important things

you can set up is you can go to API

connections and you can connect your

website to different email marketing

services and other marketing services so

for example if I go into add new

connection you can search for things by

name or you can scroll through all the

services we integrate with and as you

can see there's a lot of them so if I

type in MailChimp I can choose MailChimp

and I can add my API key here

and connect to the service and this is

all I need to do to now start connecting

my opt-in forms on my website to my

mailing lists in MailChimp and the same

goes for many other apps so if you use a

webinar app like webinarjam

and you want to use forms on your site

to sign people up to your webinar events

you can do that and as you can see here

we have we integrate with all kinds of

marketing solutions so that's a thing to

do right away whatever marketing tools

you use integrate with them on this page

then let's go back to these five

dashboard and another useful thing to do

is to go into analytics and scripts we

want to manage our scripts right here so

here we can add things like tracking

scripts analytics scripts and so on for

example Google Analytics tells us that

we should add the script they give us a

tracking script and they say that we

should add this script to the before the

head before the end of the head section

as you can see as soon as I pasted this

script in here

it recognizes this is Google Analytics

it knows where to put it and I can say I

want to insert this in thrive themes and

in landing pages and I click on continue

and that adds my script here and

similarly you can add any script you

want so that can be tracking scripts

like hot jar it can be Facebook pixels

anything like that that you need you can

add them here if a script isn't

automatically recognized you can just

use manual settings and one of the great

advantages of using this is that at any

point you can also just turn them on and

off so if you have a certain script that

you maybe want to use to do heat maps

you can turn it on for a while but you

don't have to add up running all the

time so you can just come in here and

sleep it off and the great thing about

that is that you don't have to then you

know delete the script and the next time

you want to create a heat map you have

to come back and you have to find the

script again and paste it again and so

on you just sleep a switch on and off

and then one final thing in the Thrive

dashboard is let's go to a smart site

where here we can have some central

settings that can be useful all across

the website for example for your company

you can you can set your company name

address and so on you can automatically

fill those in in certain places if you

need to

you can link to your privacy and other

legal pages and you can set your social

links so for example just to show how

this works

I can go YouTube that would be the link

text and then the link to the channel

save that and now the the great

advantage of this is that whenever I

want to link to my YouTube channel or my

social account or whatever it is I can

use the dynamic link feature to do that

and in the future if at any point that

link changes if I change the URL of my

YouTube channel or something like that

instead of having to go down hunt down

every single link on my website I just

come here change it here and we're done

so that is the purpose of the global

fields settings here in the smart site

settings now with that that is basically

as you can see there's more that we can

do here that there's more powerful

features to choose from here but those

are the basics with that let's go back

into thrive theme builder and start

making some more detailed edits to our

website so so far we have all the basics

now let's look at how you can tweak more

it is in a more granular way so this is

everything that we've already set up in

the wizard as we went through and let's

go and look at how to edit templates so

here we can see these labels says this

is the homepage the default post video

post audio post we have an error 404

page default page and then archives so

let's go into the default post let's

click on this I'll just click on edit

and this will open up in the thrive team

builder editor here's what the default

blog post looks like right now and this

is a drag-and-drop editor where you can

basically change and edit anything you

want and we've tried to make this as

intuitive as possible so the rule that

we use for editing is what we call click

to edit so if you see this image here

when you want to change something about

you can click on it and then you'll see

a range of options for this so I can

change the size of this and I can do all

kinds of things I can change where it

links to I can also just delete it if I

don't want it that's the basic idea I

just click on

something and I see the options I have

and you always have extensive options

for whatever you want to change about

anything you see so let's say these

sharing buttons here maybe I don't like

these we just get rid of them and I can

also add new elements so you can add

anything to the page that you want

including dynamic elements for example

what we have up here is the post title

this will be filled out with whatever

the current posts title is and if I

don't want it up here I can get rid of

it here and if I want it somewhere else

I can grab the post title element and I

can bring that in wherever I want

now it was definitely better before so

I'll put it back up here and what we can

also see is this will dynamically change

so I can choose my content here I can

say I want the I want some other post

content to preview my layout and this

will switch to a different post and show

me what this looks like

this also means we can change things

like the sidebar we can also change the

proportions between the sidebar and the

post content by just clicking and

dragging

and here's another element of calls to

action so in the sidebar here we have an

example call to action where we can just

change the text and we can change where

this button links to and this is one of

the ways in which instead of just having

people consume our content we can think

about well how do we want to let people

know about offers that we have about our

mailing list about coaching calls

whatever it is and the sidebar of a blog

post will be one of those places where

you can decide here I'm gonna make sure

that everyone who reads one of my blog

posts will see a call to action that

leads them towards my conversion goal

now an important thing to understand

here is that what we see here in this

box here this is the post content and

this is dynamic so this will be for the

specific post I'm looking at this is the

text that will or the text and content

and the images and so on that will

appear here what's important to realize

is that everything I did here on the

template level this is the post template

this will appear on all my blog posts so

for example if I say you know what I

don't want this call to action here in

the sidebar I can delete it but I

haven't just deleted it on this

Eric post with this title I have deleted

it on all posts so if I change to a

different post here you can see that it

loads different content it loads a

different title different featured image

and so on but the call to action thing

is still missing so that's something to

be aware of and as we do the editing

here we are changing a template that

effects many pages we also have some

global elements such as the header and

the footer and we can also edit these

and get them to look different across

our whole website so if I click on edit

section right here the changes I make to

the header now are going to affect

everywhere where they had with where

this header is showing which is

currently if we were on my website now

what I want to do is the menu here I

want to change this menu so if I click

into a menu item again we have the

breadcrumbs that help us navigate

through elements we can see that this

menu item is part of the custom menu

element that we have here and I want to

change the menu source because right now

this isn't the real menu so since we

have now created a menu in the last step

I can change this to my main menu and

now it goes home blog about and

Lightroom presets now this is great

I can I can change the templates as well

so I can change the the entire template

of this menu here and we have various

templates to choose from and of course

you can also always click on something

so let's say I want to click on this

here and I can go to something like

borders and corners maybe I want this to

have rounded corners so I can click and

drag here to change the bottom corners

the rounding so I can make it a pill

shape button or a square button I could

change whatever I want here but the

important thing is what I would

recommend you do is that in your menu

keep it simple we want we don't wanna

have an overloaded menu with tons of

things we want to make it easy for

people to make a choice and so few menu

items is one way to do that and also

highlighting a menu item is again a

conversion focused thing to do so

instead of just saying hey here are four

equal options I say this one is

important

check out my product right I want to

drive people towards my conversion goal

so with that update done I'm gonna click

on

and that will update the header with the

new menu across my whole website and we

can do the same with the footer so let's

just edit the section again and when you

have this orange frame here that tells

you that you're editing something that

will have an effect on more than in more

than one place or you're editing like a

global element and right now I can't

edit anything outside of it right I'm

basically in footer editing mode that's

it so we're going to custom menu again

main options menu source footer menu now

we change that save that there we go

let's look at another important

conversion element that will be on our

website which is what we call the bottom

section and right here you can always

see this overview over kind of the basic

structure of a page right we have a

header we have a top section we have the

content and sidebar we have the bottom

section and we can also edit right from

here so if I click on the sidebar I can

untuk all the visibility and I can have

a full width blog post but again this

effects all blog posts that use this

template so always be careful about

changes like that that you make and the

same is for the bottom section so I can

say hey I don't need the bottom section

let's just get rid of it no problem but

we can also bring it back so here you

can see this eye here can click on that

and that brings the bottom section back

and I can choose different templates

here so if I click on replace here this

brings me a gallery of bottom sections I

can choose from and as you can see we

have bottom sections for different

purposes for example we have ones that

link to other posts where the main goal

is ok you've read this article go read

another one we have ones that are with a

contact form where we want people to

contact us we have ones that have an

opt-in form and ones that advertise and

offer so we can use all kinds of

different calls to action and all kinds

of different ways of trying to drive

people towards a conversion goal here

I'm going to choose a very simple opt-in

form here and because I want to

demonstrate how to actually get people

on your mailing list so let's say

someone comes with this blog post they

read all the way down

here we write something that convinces

them to get on our mailing list you know

maybe we say get my free report whatever

by signing up and then we have the lead

generation element and here's how we

connect this to our mailing list when I

click on the lead generation element you

can see that there's the option here add

connection and from here I can choose

what I've integrated with in this case

MailChimp so I choose MailChimp and then

it gives me a couple of options that are

taken from my MailChimp account so I can

choose which mailing list to add someone

to and I can also add things like groups

and choose whether it's single or double

up then I can add tags so it's not tag

one like this and apply basically choose

what exactly happens when someone signs

up on this form I can also change the

form fields and add form fields I can

add hidden fields and we have other

tutorials that show you all the advanced

lead generation features for now one

more thing that's important is we can

choose to either send people to a URL so

when they've signed up we sent them to

another page that says thank you here's

your report or we can choose to show a

success notification so I can just keep

people on the same page and I can say

you've been successfully signed up check

your inbox

okay and I can preview that here this is

what it looks like

when someone signs up there we go again

here we're taking something that can

often be quite complicated and we're

making it as easy as possible right

we're taking the idea of how do I get an

opt-in form onto my website that looks

good that matches the design of my

website and that you know tags people

correctly and so on all this can usually

be so complicated and we've made it as

easy as possible for you to get this

important conversion element onto your

website so let's leave it at that for

now I'll save my work here this is my

default post and then of course we can

do the exact same thing for all the

other layouts the other thing I want to

show here is the list templates so you

basically have two of these templates

one is the blog page and another is any

category page at hag page anything like

that even a search results page will

have a certain look where it lists

multiple posts so that is the blog page

and default archive is category search

results and so on here's an important

thing to note how to edit so if we go

into our archive page for example here's

what that looks like and as you can see

we have a search bar at the top and we

have a list of posts here and like with

everything you can always edit something

by clicking on it so you want to edit

the search bar you want to hit it what

it looks like what it searches how big

it is and so on you can do all of that

here and with the post list so at least

a post that is actually a super powerful

element that we have and thrive theme

builder and thrive architect and you can

change a lot about what exactly this

looks like first of all we can go in

here and we can go to the template and

again we have a gallery of a huge number

of templates here to choose from the

right way we can make all kinds of

changes and we can do something like

this that's let's change its choosing on

here this is like a simple post layout

so we can take this and even here I can

go into edit design and I can make

further changes so if I want to bring

back the featured image I can bring that

in here

I could say okay let's add a featured

image here and that will dynamically add

the featured image to each one I can

choose this text here I'll go to text in

the breadcrumbs I can make this larger I

can go to layout position and change the

alignment of everything so everything

you see again everything you see is

fully editable and you can make this

page look any way you want so another

thing you can do one more thing I want

to show that we haven't really looked at

is you can also use dynamic images as

backgrounds so if this is too big for me

I can go in here and I can go to I'm

going to search for content box let me

insert a content box here and I can give

this a certain height

and in background style for the box I

can go to image and I can say I want

this to be the featured image of the

post alright and I can even choose the

alignment of this so maybe I want to see

like the top left or the middle or the

bottom of that image to change that and

apply this and now I have a way to show

my featured image but I can choose how

tall this is so I can make it use up

less space so as you can see it's quite

difficult for me to actually even give

you a good overview of all the things

you can do here because there's so much

to cover and I don't want this video to

go on for hours and hours but I think

you get the idea by going into our

templates here and by clicking on edit

and by just basically clicking around

and looking at the options you can see

how you can usually find new templates

to choose and you can basically edit

every single detail of every template in

every page on your website with

drag-and-drop simplicity so with that

let's go to the final component of a

conversion optimized website which is to

have specific conversion pages we're

actually going to start with the home

page the home page like I mentioned

before let's click on edit here like I

mentioned before the home page think of

your home page is an important

conversion page on your website now when

I'm editing a page like this and this is

important to realize now I'm editing the

content of this page so the home page is

a landing page and we can also see up

here this is the Thrive architect simple

drive architect is there to edit the

content of a page and thrive theme

builder is there to edit everything

around the content okay so everything

we've looked at before a header or

footer side bar bottom section top

section all this stuff this is what's

around the content of a page or post but

now on the home page we're editing the

actual content of this individual unique

page that is thrive architect and that

gives us similar options to edit

anything we see but here I'm only

editing this one individual page what's

already happened here is that we have

the header with the changes we made the

footer with the changes mean

we made which is not surprising right

because as we were editing this we knew

this is going to affect the entire site

so this is a home page layout that we

can use to to make a really nice kind of

neat short and conversion focused home

page obviously I changed this in this

case it doesn't even need to be like a

personal branding thing so I can choose

an image like this here and put that in

and I can maybe change the size

disappear I can also go into portals and

corners

maybe round this off a bit and then I

would here want to write about okay

what's my website about so I could say

something like learn how to create

kick-ass pictures using cheap camera

gear and then maybe I wanna give this

bit more space for the text here but as

you can see it's all just like drag and

drop I also want to go into my columns

here and maybe central-line this and

then let's see there's basically too

much space here somewhere this here's

too much let's get rid of that and let's

go into this page section let's add a

bit of a bottom padding here there we go

so that could be my basic setup here we

have an email opt-in form that's a good

idea to have let's connect this to our

MailChimp again and again I'm not going

to go through this again you already

know how this works so I connect this

form it's another form here I'd also

connect this to my MailChimp here we

have another author image I could

replace that with an image with me like

this one another powerful thing we can

do here is we can actually extend this

page with what we call page blocks so in

between the sections of the page you can

see this plus icon appearing and it says

plus page block when I click on this it

gives me a whole gallery of elements

that I can choose to insert for sales

pages landing pages of home pages

so on and it's also easy to navigate

through these so as you can see maybe I

have a product highlight section where I

want to get people to buy my ebook so

how about this one I insert this and it

gives me this pre-designed section plus

it uses my brand colors automatically

and then the rest of this job is really

just I go in and I click and I change

the text right I change the text to

match my brand and my product here we

have a post based we've already seen

that I can choose if I want to show

different posts here I can go into

filter posts I can say you know what

instead of showing just the latest posts

I want to create a rule and I want to

create a rule that says I want to only

show posts that are in a specific

category such as photography tutorials

saving clothes and then it will show the

latest posts from this category and it

does that automatically so I have

dynamically updated post lists on my

homepage and again with the so you know

maybe I don't like this section here so

I can get rid of it and I can click on

the plus here and I can simply insert a

different section that I think is more

fitting for my business so again

whatever that is you can very rapidly

customize exactly what you want to see

on your homepage using these features

for now let's leave it at that and save

our work here the important thing on the

homepage is again communicate clearly

what your website is about so we're

using text and a picture to say here's

what this is about and call people to

action and give people an easy way to

navigate to the important parts of your

website so this here is a bit of a mess

here but the idea behave check out these

posts these are the important posts and

check out my ebook right this kind of

thing makes for a conversion focused

homepage next let's build a sales page

so we already have the page right if we

go into our pages here we have currently

a empty sales page if I go here and I

click on edit with thrive architect it

will load up thrive architect

can start building this page now I've

got good news and bad news bad news is

if you want to sell your product you

need a great sales page and it's really

difficult to make a good sales page the

good news is we've also solved this

problem for you one of the ways in which

you can do this is if you load up this

page here and you click on this cloud

icon you can choose a template and I'm

using the shape shift C theme and as

you'll see I can get a couple of

pre-made pages here and I can also use a

blank page and I can even use all of

these other pages so all of these other

page templates so I can either create a

sales page that uses the exact same

design language and style and so on from

the rest of my website or I can even say

me I want to have a different kind of

template for my sales page and we have

all kinds of templates to choose from

and we have all the features you've

already seen on these templates as well

so if I click on this one here for

example we have a sales page example

here so let's choose that and right here

first of all I can go into this tab here

and let's change the accent color to our

theme color it so right away the entire

sales page is updated to match our theme

color and this sales page here there's

two things first of all this is a

tutorial on sales page so the sales page

itself will explain what you should

write where and how you should use these

different sections kind of the do's and

don'ts of you know how to write

testimonials how to structure your sales

page where to put what so it's almost

like a fill in the blank go through this

to create an awesome sales page and it

also has the page blocks feature so if

you go through this and you think okay

this is good but I want a different way

to show my product you click on plus and

you'll have all these different page

blocks to choose from which also follow

the same idea that if I insert anything

here this automatically takes on the

font and brand color settings and so on

for the rest of the page and so very

rapidly you can mix and

such an effective sales page and of

course you can simply follow the

template and it will tell you put this

here right fill in testimonial here do

an about the author section here and so

on this is all this is not arbitrary

this is based on our experience of how

to make a high converting sales page so

this is the easiest way to get a high

converting sales page for your product

and then one more page that is a

must-have on any conversion focused

website is a lead generation page so

again we have an empty page here and the

lead generation page is simply a page

that is there to advertise your

newsletter or to advertise a free

product that people get in return for

signing up to your newsletter and again

you can use all these features that we

looked at to very quickly make an

effective lead generation page so if we

use our theme templates here I can

choose a blank page I can also choose a

premade already conversion optimized

lead generation page template of course

or I could use this blank page which

actually in this case shows the header

and footer I don't want to show the

header because this is a fully

conversion optimized page I don't want

navigation on here just have the message

that tells people get on my mailing list

so we would have probably some kind of a

hero area that explains here's why you

need to get on my mailing list so

perhaps this one here this looks nice

and simple here I can change this image

to something that represents my free

guide or something like that and then we

already have this background section

that has like an arrow pointing down so

maybe we can add a second section here

with a lead generation element that

looks maybe something like this and

that's clicking this that I think the

background should just be white and then

since the arrow kind of this this subtle

background our seems to point the wrong

way now and what we can do here is we

can go to this section and we have

what's called decorations and we can

choose the different decoration so we

can choose what that what that bottom

looks like and as you can see we have

many shapes choose from and we could go

with this one

here and we can also change the height

of this so now this kind of more

naturally points towards our email form

and again I'd connect this with

MailChimp and then we're good to go

we save this we have got a functional

and nice-looking lead generation page on

our website alright so that's it as

quick as possible tour to help you get

from zero to a functioning conversion

optimized website as you can see these

tools for our theme builder and thrive

architect are massively powerful and

it's quite difficult for me to give a

tutorial where I'm even just scratching

the surface of what you can do without

it going on for too long but here's the

thing don't be intimidated by all the

things that can be done with these tools

as you can see we've made this as easy

as possible to get started and I highly

encourage that you start simple I don't

worry too much about all the little

details starting out walk through the

wizard and you'll be amazed at how great

your website already looks just by the

end of that and then one by one you can

start building out these pages you can

make your home page you can make your

lead generation page or sales page or

about page and so on and take it step by

step and as your website grows and as

your business grows you will encounter

new needs you will see like oh can I

also do this can I also do that and more

often than not you'll find that the

answer is yes indeed you can do this

with rival architect with thrive theme

builder or with one of the other plugins

in the thrive themes suite so don't be

afraid of of overwhelm you don't have to

do everything all at once get started

we've made this as easy as possible and

enjoy the process of building out your

website and making it better and better

over time thank you for watching this

tutorial I hope you've enjoyed it and I

hope you'll build something truly

awesome with our tools




No comments

How to Build a Conversion Focused Website From Scratch In 55 Minutes | Thrive Theme Builder Tutorial

  In this review, we'll walk through how to build a conversion-focused WordPress website starting from zero, and before I go into WordPr...

Powered by Blogger.