As a consultant, having a website that clearly communicates your unique offering is a must.
This new bonus template will allow you to use a good looking, conversion focused homepage for a service based business.
You'll discover:
- ​How to make your most important call-to-action stand out.
- How to create a case study grid that will make your visitors want to click and read.
- How to create a social proof section to boost conversions
And if you don't feel like building the page form scratch, simply use the template that's available in Thrive Architect and start editing.
More...
A Fresh Homepage for a Consultant
We asked our designers to make a fresh and modern homepage for a service provider and build it from scratch in Thrive Architect.
As you can see there are many well designed and conversion focused elements on this homepage:
1. A multi-layer content box with a "Start the Quiz"-button
A quiz is an excellent way to engage your visitors and to capture valuable insights.
With Thrive Quiz Builder, you can create a quiz that will be fun to take and help your visitors learn something new or discover how they can improve their business. In the meantime you capture targeted leads and segment those leads to focus on those most likely to do business with you.
If you're looking to learn more about how to use quizzes in your business, check out our free Thrive University course: How to use quizzes to boost conversions
To create the multi-layered box, we're actually using shadows.
- Add a drop shadow with the lightest color and set the distance to 8px, the blur to 0 and the angle to 90°
- Add a second drop shadow with the darker color and set the distance to 16px, the blur to 0 and the angle to 90°
2. A 2-column layout created in just a few seconds thanks to the duplicate "hack"
Hover over the element to copy and click on the green duplicate button in the upper right corner
The duplicate feature in Thrive Architect must be one of my favorite features because it makes building landing pages so much faster!
When you duplicate an element, it keeps all the settings such as margins, paddings, font size, links...​ This means that whenever you took the time to customize the settings of an element, you can simply duplicate that element and save precious minutes.
3. A fresh, attention grabbing About-section that creates trust
Your visitors might not know you. Your homepage might be the first time they hear and learn about you and your service. That's why having an about section that generates trust is important.
On this homepage, their are two elements that create that feeling:
- A professional photo of the consultant to give a personal touch to the homepage.
- A "handwritten" signature to make it look a bit more human​.
4. A social proof-section with a Case Study-grid and a testimonial slider
Social proof is ridiculously powerful to boost conversions. Everyboy likes to know that other people already trusted you and got the desired results before taking a leap and hiring you.
On this homepage we used 2 elements of social proof.
The first one are case studies. As a service provider, you might not have a regularly update blog or be super active on social media, but one type of content that can really boost conversions are case studies. These case studies show potential clients that you know what you're doing and also show the type of businesses you're working with and the type of results you can obtain for your clients.​
Now, in this template we use a blog grid to create this layout. This means that you'll have to create your case study posts or pages before adding the grid to the homepage.
Once you've created those posts or pages, you can simply select the "case study" category or tag in the grid element to show only case studies.
The second element is a testimonial slider. This element was created with Thrive Ovation our all-in-one testimonial plugin.
As a service provider, I'm sure you know the importance of word of mouth advertising and getting referrals from satisfied customers. Online, the closest you can get is with testimonials.
If you are thinking "I know I should ask for testimonials but I have no time for that!", check out how to set up a testimonial capture system that will allow you to get testimonials on autopilot.
Both of these elements (the case study grid and the testimonial slider) rely on other elements already being present on your website.
This also means that when you upload the template, this grid element and the slider might not show or tell you something is missing because the linked elements are absent from your website.
You'll have to hover over the place where the element is supposed to be and click on it to add your own case study posts or pages.
5. A Blog-section to link to your latest articles that will update automatically
This section is optional, if you don't have a blog or your last article was published months ago, simply delete this section. But if you do publish regularly it's a great way to show off your latest articles and to keep your homepage fresh and up to date.
For this element, the same rules apply as for the case study grid... If you're building this page from scratch you'll need to publish the blog posts before seeing them show up on the homepage and when you import the template, this element will be empty. Simply hover over it and set the filter settings to show what you want on your homepage.​
6. A final call to action at the bottom of the page
If a visitor scrolled all the way down on your homepage, that's an indication they were interested in what they saw. Even if they haven't clicked on anything yet, scrolling all the way down is a significant engagement signal. That's why we should give them something to click on by adding a final call to action to the bottom of the page.
Get the Landing Page Template
In order to be able to use this and the full library of 444 landing page templates you need Thrive Architect
Want to get started with this exact template right away?
- Create a new page on your site and edit the page with Thrive Architect.
- Go to Page Setup and choose "Choose a Landing Page Template"
- Select the "Bonus" set and pick the "Consultant Homepage"
If you want to know how to make this page your homepage, follow the tutorial here.
I hope you like this new template!
Thanks Hanne! As a Thrive Themes user the past 2 years I am enjoying these type of posts and the included templates we can implement on our own sites. I’m very much looking forward to the revamped TCB as well!
Hi Andrew,
Thanks for the comment. I’m very happy to hear that you’re still enjoying these and that you’re looking forward to TCB 2.0 🙂
Hi Hanne
I always look your tutorial and try to learn new things can you give me an idea for my new blog site home page, pls you have similar video tutorial let me know, Thank you!
Beautiful and elegant design.
And, as usual, a great tutorial.
Thanks Hanne.
Thanks Detlev. I agree, I really think our designers did a tremendous job with this one.
OMG, OMG, OMG…this is so kewl (love seeing this kind of “trickery”). Who knew you could use the post element that way! Love your tutorials and the Thrive Team… Hugs&Blessings. MamaRed.
Hihi I love to sprinkle some Thrive Magic MamaRed 🙂 Glad you like it!
Hanna, why do you start with a Landing Page to build the home page instead of just using the content builder? Thanks.
Hi Tony,
The reason for this is twofold
1. This allows us to give you the full template
2. Not all themes have the options to have full width content and only Thrive Themes allow you to use the page sections in TCB so to make sure this is as helpful as possible for as many users as possible, I start from a landing page.
Plus for this type of homepage, I also believe that a landing page is a good choice because the main CTA is to take the quiz (so you do not need a header and breadcrumbs etc.)
Will this template in the Thrive Themes Landing Pages..?
Hi Bryan,
This template works in Thrive Landing Pages, but you’ll have to upload it (by following the instructions in this post) the template will not be available in the templates library.
And again…..what a fantastic item! Very well explained and easy to follow. Thank you Hanne.
Thanks Johan!
Great work! I love this page and will start using it on one of my consulting sites this weekend! Thank you for building this 🙂
Glad to hear Jim
This is awesome, Thanks for sharing will download ASAP.
You’re welcome Muhammad
Well done Hanne! Even after using the content builder quite a lot I still learn new things from videos like these. Keep up the good work!
Hi Daphne, happy to know I could still teach you a few tricks 🙂
Great stuff, as always.
Thanks for everything!
Thanks Nenad
Great video!
What’s the ETA on the new Version 2 Builder?
Thanks
Hi Peter,
Sorry I can not give you an ETA…
Hanne – I love your new design! I’m in the process of redoing my consulting website and will use your efforts as the foundation going forward. Could you please post the individual color names (Hex) that you have saved as favorites?
@glen : use a plugin for Firefox/Chrome called colorzilla, another is colorpicker. A software tool you might find useful is: Art Director’s Toolkit, only for Mac systems though.
https://www.code-line.com/artdirectorstoolkit/
Thanks for sharing David, I’m using colorzilla 🙂
Hi Glen,
That would be:
Quiz button peach: #fc916d
Author section blue: #4e64d4
Blog section purple: #4f4792
And darker orange for the grid: #e86d66
Love you Hanne. )You really show how flexible Thrive Themes is. Thank you for sharing.
Thanks David, that’s the goal 🙂
Very nice tutorial! Thanks 🙂
This helps me a lot to understand the content Builder better 🙂
Thanks Hendrik
Great as always, Hanne!
Thank you Steven 🙂
Very cool Hanne! Thanks!
You’re welcome Sam
Are you planning to build an ecommerce thrive theme?
Hi Kevin,
What do you mean exactly with “an ecommerce Thrive Theme”?
Thank you Hanne, its a great job you’v done. I got a lot of new ideas to use tcb…
Thanks Thomas 🙂 I accomplished my mission then 😉
Hi Hannah, love the concept of having this as our home page. However, when I tried to upload it, got a message:
UPLOADING
tve-lp-consultant-homepage-1.zip
Sorry, this file type is not permitted for security reasons.
Please advise.
Thank you,
Hi Tamara,
Sorry to hear.
Did you follow the instructions in the post (import it as a landing page)?
This message seems like something from your hosting providing you to upload zip files…
If the problem persists, please open a ticket in the support forum so that we can check it out.
Awesome! #MarketingMouseTrap
Thanks David
Superb presentation and design. I saw it twice to grasp it all.
I have recently re-joined as member and just sent a message on support asking where I can see all your past presentations and templates.
I am changing the theme to thrive for four sites so I have a lot to do and need lot of help to create different home page for each one.
Really learn a lot from your tutorials, Many thanks
Hi Kas,
Welcome back 🙂
The best place to find all of our teaching material is in Thrive University
Great timing. Just what I needed! Nicely done.
Happy to hear Robert!
It’s an Outstanding Homepage Hanne. Is it possible to use this page as a regular Homepage?
Hi Elizabeth,
If you’re using a Thrive Theme with a full width template (such as squared) you can build this on your “normal” homepage.
But you can also simply set this landing page to be your homepage by following the instructions in the post.
Thanks Hanne!
You’re welcome Andre
I think it’s great. I must do something myself with the quiz builder 🙂
Hi Eleanor, give Thrive Quiz Builder a try 🙂 You’ll see that it’s fun to get visitor insights!
I don’t like to play everytime with margins. Could you solve to be real drag and drop the TVB? I mean I drag the box where I want to be and there will be. I think the Instapage use this method.
Hi Tamás,
That’s not something we’ll be able to do, sorry.
Another superb tutorial from the best team on the planet. Thanks Hanne.
Thanks Quentin 🙂
Oh my god. That negative margin was a killer! I’ve always been wondering how those boxes in between the slides are made in the landing page templates. But alas, at least I know now it wasn’t hard-coded in HTML. 🙂
Yep Thomas, negative margins can be pretty magical 😉
Hello Hanne, very nice how you used the overlapping boxes and I saw a lot of opportunity for the use of the blog grid too, really interesting, thanks!
Hi Antoine,
I think the blog grid is probably one of the most underused elements in Thrive Content Builder! You can do sooo much with it, the filtering options are almost infinite.
you make the web design look easy with your amazing themes and tools, thank you for this tutorial know i have an idea on how to design home page of my new saas website
Thanks fleurshi
That’s Great!!! Thanks Hanne!!!
You’re welcome Maurino, happy you like it
Great job and tutorial, as always. Thank you for all the value you and the rest of the team at Thrive Themes deliver to all of us.
Hanne,
I would really, really love it if you could do exactly the same thing you just did in this video/blog post but for John Lee Dumas http://www.eofire.com, as I think his home page looks really great and conversion focused.
I also have some other ideas you guys might think of doing, if you believe they are worth it:
1- Develop your own membership site WP plugin. I know you would build the best one available in the market; it would supersede every-other one in the market right now.
2- An automated funnel building feature or plugin. Sort of what Click funnels offers,but on steroids.
These are just some ideas I have and I apologize if they are not suitable, but I thought there could be some value on them.
Lastly I´d like you to take a look at a new tool called http://convertbar.com/
When I saw it, I could not help but think about the focus areas in the focus blog theme. Look at it, maybe it´s worth comparing the functionality.
Thank you very much for your time and attention.
Luis
Hi Luis,
Seems like the top of the homepage would be rather easy to make (3 column layout, buttons linked to an opt-in page, etc.) it made me think of the upside down homepage tutorial I did a while back. But the combination of the homepage with the blog page is hardcoded I guess.
To answer the rest of your questions:
1. This is something that is on the road map, but don’t count on it any time soon. Because the plan is to make it AMAZING and that takes time 🙂
2. We’ve been playing around with the idea, but haven’t found the exact angle for such a product yet.
3. Seems like the convertbar does some basic stuff that you can put on steroids with our plugins, the list building with Thrive Leads and the countdown timer with Thrive Ultimatum.
And thank you for the suggestions 🙂 Even though we can not do everything all of our customers wish for, we appreciate it a lot and take notice of each and every one!
Thanks, Hanne, Great job as usual… I have no use for a consultant page, however, watching you and your fantastic ability shows me “stuff” that I had no idea how to use or was even there. The biggest eye opener was the use of page sections vs. content containers in a previous video. Thanks again!
Hi Sherwood, I’m happy to hear that even though this exact template is not for you, you still found value in the video!
Hanna, I got so much out of this video and great new Consultant template. I wanted to figure out the ideal image size for a blog post and the best font and font sizes too. Do you have a tutorial on that too? I would think that relevant for pages as well as posts.
Hi John,
Those sizes will mainly depend on your theme…
For the image size there is really not good answer.
For the Font size, make sure that you respect the visual hiearchy for the headings (H1 is biggest size, H2 a bit smaller, … ) with the Paragraph being the smallest element. For the paragraph size, I would not go under 16 px to keep everything readable (font size for paragraphs on our website is 19 px…)
If you find a design you like, you can always use the inspector element (CRTL+SHIFT+I on Chrome) to find out what the actual size is of the font.
Very beautiful! Thanks for sharing!
Will the effects with negative margins work on mobiles too?
Thanks a lot in advance.
I’m always unsure when it comes to mobile frienliness
Hi Stefan,
You should always verify on mobile, because the negative margins can overlap with other elements, but as long as you only use top and bottom margins (and leave enough space in between elements) you should be ok.
Thanks Hanne, your tutorials on how to build pages from scratch are very helpful and help to show the true flexibility and power of Thrive Themes.
Thanks David 🙂
Hi Hanna, thanks for the great Video and the template. At the moment I’m working on a website like this, so it was a great help! But I have a problem with Quiz, could you help me with that? How can I link a Quiz to this button that it appears in a lightbox / popup ? I already created a Quiz and have a short code, but I’m not able to put it into the button link. I think it is not that easy to put in the short code as a link… But when I click on it there is an error page. Best regards Fabian
Hi Fabian,
I see what you’re trying to do but you’re missing a step 🙂
The shortcode will show the quiz, so first you will have to put that shortcode on a page (best solution) or in a light box (not really ideal).
Then you can link from the button to that page or to that lightbox.
Hope that helps
Hey Hanne,
thanks a lot! Yes, this helps. I didn’t try thrive leads yet with all the light box potential, but I think this is right why how I can realize my ideas 🙂
Hi Hanne, just about to build a new site, perfect timing! I’m wondering which Thrive Theme to use – are there any which would fit better or worse with this home page?
Hi Shakya,
my personal favorites are Squared and Rise because of the full width design 🙂
I love the template. The zip file won’t load. I get an error message too: This archive does not seem to be generated from Thrive Visual Editor – unable to find the config file
Hi Katerina,
Sorry to hear. Is you plugin up to date? Please make sure it is and to follow the exact instructions. If the problem persists, please open a ticket on the support forum so they can have a look 🙂
Thanks Hanne, this is just perfect!
I’ve been searching high and low how to add menus to a landing page… so glad I stumbled on this.
Also, I really loved the overlaid boxes and the surprising post grid use.
Going to implement right away!
Happy to hear you got some actionable advice Maayan!
Thanks, Hanne! Great tutorial. as a new thrive theme convert, I really enjoy your practical tutorials. looking forward to Ramping up my theme adoption path for all my clients
Thanks Simon and welcome to the fam 🙂
Hanne, what tool or where do you get your color palettes for websites? I notice you always have beautiful groups of colors.
Any tips?
Hi Tommy,
I’ll be very honest here… we have designers putting the palettes together… but you can use https://color.adobe.com/ to get colore suggestions based on your favorite color 🙂
Excellent as always Hanne, you give so much value in these posts.
I’m really no designer so these templates are a huge help!
Thanks Seán!
Aloha Hanne,
When making the “start the quiz” content box you changed the background color of the box by going to the content-box-options. When I go to the content-box-options I do not see the place where to change the background color.
Am I doing something wrong?
Do I have to update something?
Your help highly appreciated
Best regards,
JuanPedro S
Hi Juan,
Make sure to pick Style 6 for your content box 🙂 That’s the one that gives you all the option!
Great video, thanks! Where do you guys get your background images? I love the simplicity of them. Thanks.
Hi Richard,
I think this is a background image that our designer created but if you go to pexels or pixabay you might be able to find images searching for “background” or “texture”
What would be the best way to add the menu and logo on the top to make it look like the rest of the template?
Best would be to add a background section and then add your logo to the side and make text links for the menu.
Hanne again awesome work…. ! You explain that you need to link the button to the quiz which you setup without splash page. Any idea where I can find the url pointing to the quiz questions. I know there is a shortcode but that can’t be embedded in a url. Or am I wrong.
Hi Johan,
That’s right, you have to embed the short on a page, publish the page and link to that page from the button.
You can see a tutorial on how to do that here
Hanne,
Great video and very clearly explained
Looking forward to more tutorials like these.
Maybe you can explain the best way to convert an existing Genesis themed website into a full Thrive website based on a Thrive theme and the Thrive plugins:)
Good Work Hanne