Step by Step: Create a Visually Stunning Homepage From Scratch

By popular demand, we continue the landing page from scratch series and this time we'll create a visually stunning homepage.

As usual you'll see all the steps from start to finish and discover some insider tricks on how to use Thrive Content Builder like how to create a beautiful blog post grid that updates automatically (at 15:33).

In this video, we replicate the homepage from Craftsy, an online learning platform for handy crafts. Their homepage design reflects the creative vibe of the website by using full width images but is also highly conversion focused with highlighted promo codes, links to important content and an opt-in form.

This is exactly the type of homepage we like: original, good looking AND conversion focused. Check out the video to see how it's done.

More...

Discover All the Details

In this video, I don't go into detail in how to discover the exact colors or how to copy the images from the original website (because this is stealing!), you should use other homepages or landing pages as inspiration to create your own, original design.

That being said, if you want to discover the exact color or font on a website, you can check out this video. At 2:11 you'll see how to use the page inspector to discover the exact color used on the page.

Full Width Template Vs. Full Width Blank Landing Page

​In the video at 0:58, I'm talking about the difference between a full width template vs. a blank full width landing page.

If you're using a Thrive Theme you'll be able to choose the "full width" template to start designing your homepage but unfortunately, not all themes have this option. 

If you're using a theme that doesn't give you this possibility, you can start from the "Full width blank" landing page template that you can find in the templates cloud.

Using this template will strip out the menu on the top. To recreate the menu, check out this video. At 8:13 you'll learn how to add a menu to the top of the page. 

Also, when using this landing page template you'll have to copy sections instead of placing new section elements on the page. The page section element is part of the options that will only be available if you're using a Thrive Theme but by copying the sections that are on the blank full width landing page, you'll get the exact same result.

Lead Generation Element Vs. Thrive Leads Forms

The last section of the homepage is an opt-in form. In the video at 20:44 I'm briefly talking about the difference between a Lead Generation element and a Thrive Leads Forms element.

Out of the box, Thrive Content Builder comes with a lead generation element built in. You'll be able to create a simple opt-in form (like the one shown in the video) and you'll be able to connect this to your email provider. 

We integrate with tons of services through API and if your favorite service is not in the list, you can integrate through HTML.​

Now, if you're a Thrive Leads user, I highly suggest you use the Thrive Leads Forms element rather than the Lead generation element. This will allow you to:

  • ​Get detailed statistics about the number of people who have seen the opt-in and the number of subscribers.
  • Run A/B tests to make sure your opt-in forms are converting as high as possible.

To use a Thrive Leads Forms element, you will have to create a short code opt-in form within Thrive Leads dashboard first so that you'll see the opt-in form in the list of elements to choose.

Your Turn!

Now it's your turn to create a visually stunning homepage. 

Any questions about this homepage or suggestions for layouts you would like to see in future videos? Please let us know in the comments below!​

Author: Hanne Vervaeck

Hanne knows exactly what companies have ever retargeted her (she keeps an updated file). And when she’s not busy discussing high-level funnel design over cocktails with the equally geeky, you’ll find her discovering a place for the first time

  • Thanks Hanne! Wow that’s using lots of elements and covering about anything we could imagine. One thing I’m working on is creating full funnels with one click upsells and downsells. You recently posted a video on How To Create a Webinar Funnel. I think it would be similar but just with buy buttons on the funnel pages. I would use either paypal or stripe. Any suggestions?

    • Hanne says:

      Hi Martin, thanks for your comment.

      Indeed for the upsell and downsell pages, I would use buttons with a link to the payement processor and make sure that the page people see after the first sale is the upsell and have a link on the upsell page that goes to the downsell if they choose not to take you up on the offer.

  • Craig Connelly says:

    These have to be the most helpful videos of all. I learn something new every single time …great work

  • Jay H says:

    That was an excellent tutorial, I really learned alot. I usually just use the premade homepages that come with the themes but they have some restrictions. I never really used page sections before.. this is brilliant. My homepages are going to be awesome now. Thanks again Hanne you are awesome!

  • Craig Connelly says:

    One question I have if I do this is using thive theme and woo Commerce is there a way to display The Checkout alongside the menu at the very top please

    • Hanne says:

      Hi Craig, sorry I don’t know if this is an option in Woocommerce… A quick Google search came back with specific plugins for this or changing code so this might not be a possibility with Woocommerce right out of the box…

  • Sam says:

    Thanks for the video. One question: how will this look on mobile? Will the background image page sections be chopped for mobile or scaled to fit mobile screen? Thanks

    • Hanne says:

      Hi Sam,

      Background images are scaled on mobile.

      • Sam D says:

        Hmm…. Cant see how to do this? whenever I use an image as a background in a page section it always cuts the image and never scale. is there a trick to this? Is the site you created live somewhere so i can look on my mobile device? thanks!

      • Hanne says:

        Hi Sam,

        Did you check the box “full height image”?
        And sorry the page is not live (because I copied all the elements shamelessly ;) )

      • Laurent B says:

        Hi,

        Your tutorial is great but my image doesnt scale on mobiles at all, even though I’ve checked full height.

        Any hints ?

  • Joinal abden says:

    Hi,
    It’s very nice video, will try it soon.

    Thanks!

  • Joinal abden says:

    Hi,
    It’s very nice video, will try it soon.

    Thanks!

  • Adrian Iacob says:

    Congratulations Hanne and many thanks for that tutorial! It’s very wellcome but unfortunly, you forgot to build the Meniu section!
    In other way, I want to ask you if is it in library any tutorial for a ecommerce site? Or maybe you have some recomandation for how to use woocommerce with thrive? Also, can you recommend a special theme for?
    And a last question … how can we make a carousel with image or video in page?
    Thank you very much and best regards all of you!
    Adrian

    • Hanne says:

      Hi Adrian,
      I didn’t exactly forget to build it ;-) As you can see, I’m using a full width page template so my top menu is still on the page.

      I don’t think we have specific tutorials for woocommerce but if you have questions you can ask our support forum.

      And to answer your question about the carousel, I suggest you read this article and you’ll understand why we think you should not be using them :)

    • Adrian Iacob says:

      Thank you very much, Hanne!

  • Hanne, this was a brilliant tutorial! I wasn’t aware I could put together a post grid layout like the one you made. I’m swiping that for my home page!

  • amy says:

    Where is the video you’re referencing in the opening paragraph/header? The very first link doesnt work, and the rest go to other videos…

  • Christine says:

    Hanne,
    Thank you very much for a succinct yet detailed video tutorial on creating this home page. Brilliant! I love, love, LOVE it! Your teaching style is methodical, organized, easy to understand, and a pleasure to watch and listen to! I am building my home page this weekend, so your video comes at the perfect time. Thank you again!

  • David says:

    Hello Hanne- I see more and more traffic coming onto the site from mobile devices. Would you be able to show what the mobile experience is of the homepage you created in the video above? Also, are you able to provide a mobile first design video? Thanks!

    • Hanne says:

      Hi David,
      Image backgrounds are not the best for mobile experience. You would have to make sure that the text over the image stays readable on mobile.
      We’re working on some big changes for TCB and mobile will be very important so keep your eyes open for that :)

  • Nick Ritchie says:

    Great tips. Especially the blog post grid! Would love to see you guys tutorial a fitness page too…

  • DrGeorge says:

    Thank You… That was awesome!

  • David says:

    How would you take their page and make an AMP version for mobile?
    Here’s an article I just read with an interview from google on AMP http://rocksdigital.com/mobile-web-amp/

    • Hanne says:

      Hi David,

      For the moment I wouldn’t and in general I don’t think that’s the way to think about AMP (taking a page and making an AMP version).
      This is still in the very early stages and there is not a lot we can do with it yet, so most of the elements on this page would simply not be possible in an AMP version of the page.
      We’ll have to see how the AMP project evolves and what elements they’ll make available to use :)

  • Bonnie says:

    Es wäre gut eure Seiten in deutscher Sprache zu lesen, da der Text von
    google nur schlecht übersetzt wird.

  • David says:

    Hello, nice as usual. One question : how to get rid of the underline below the links ? I run a thrive theme template (pressive).

    • Patrick says:

      David, to remove the underline on a link in your theme you will need to modify the CSS. In your Chrome browser, depress Shift+Crtrl+I to bring up the “Element Inspector”. Then, click on the icon that is a square with an arrow pointing to the top-left corner.

      This will allow you to select any element on your page and will show the respective CSS in the right box of the inspector window. It will most likely look something like this:

      .cnt article a {
      text-decoration: underline;
      }

      To remove the underline, you will need to log into your WP dashboard, click on the “Thrive Dashboard”, select “Theme Options”, then select “Style & Layout Settings”. Near the bottom will be a box labeled “Custom Css”. In this box, copy the existing CSS code and change the “text-decoration: underline;” to “text-decoration: none;”. It should look something like this:

      .cnt article a {
      text-decoration: none;
      }

      Click the “Save All Changes” button at the bottom. Go to your home page or whatever page you were on, refresh and verify that the underline on the link is removed.

      If you need further help, feel free to reach out.

    • Hanne says:

      Hi David,

      Like Patrick so kindly explained you would need to use some CSS.
      If you have any trouble, you can ask our support forum for assistance.

      • David says:

        Hello Patrick and Hanne, thanks a lot for precise answers. I am awfully bad with css so this spoon fed comment is nailing it :)
        Thanks !

  • Sachin B says:

    Awesome tutorial Hanne, my wife do have a craft related site and this will be really helpful for her and other sites too.

  • Mark M says:

    Thank you for this demo! Thrive Themes is the best! Your latest lessons on building from scratch have been very helpful! I am still confused about one thing. I see you are dragging a paragraph/text element onto a background image. I see you do it, but when I try it, it doesn’t work. It wants to place the text above or below the image. In this video you performed the drag and drop twice onto an image and just can’t seem to make it work. Is there a way you can describe this better or slow down on how you are doing it. I’ve stopped the video and played it over and over and can’t see how to make the paragraph text element stay on the image.
    Thank you.

    • Hanne says:

      Hi Mark,

      To make sure this is working you need to add a page section on the page first (if you’re starting from the full width blank landing page template you’ll have to copy a page section).
      Next you need to apply a background image to the section (click on the page section and on background image)
      Now you’ll be able to add text onto the image.

      From your explanation, it feels as if you’re putting an image on the page rather than putting a page section and applying a background image to it.
      When you put an image element, you will not be able to put text over it.

      Hope this helps!

  • Dante says:

    Not a bad tutorial but I would have liked to see you resize the screen to a smaller size in order to see how it looked responsively. So many times I make something that looks great on desktop, but not so much on mobile. I wish you would add more features for responsive design such as easily being able to hide/show elements depending on device.

    • Hanne says:

      Hi Dante,

      Full width background images are not the best choice for mobile, it will still look good (I mean the image will scale) but you can not really control where the text will be so you have to make sure the text stays readable.
      We’re working hard (behind the scenes) on improving TCB and mobile design is a huge part of that!

  • Thanks Hanne.
    Excellent tutorial for setting up a home page. I really like what we already have but I have lots of opportunities to create landing pages so this will be very helpful.
    Best, Leelo

  • Kelly E. McClelland says:

    As always, you are very clear and helpful in your video tutorials. Love the step by step instruction and promise it will be used! Thanks!

  • Brent says:

    Very well done. How did you get the very top bar menu again? Is that there automatically because you chose a theme?

    • Hanne says:

      Hi Brent,

      The menu bar is part of the theme I used (Squared) and to make the homepage I used a full width template.
      This is an option in a Thrive Theme, not all themes offer this possibility.

  • Avinash says:

    Awesome Tutorial Hanne! :) I became a fan of you now!

    You made it so clear to understand the whole concept!

    Thanks! Expecting more tutorials from you! <3

  • Joseph H says:

    Hanne, great video. I learn a lot just by watching the steps and techniques you use. Thanks.

  • Alison says:

    Hi Hanne, your tutorials are awesome :) l learn a new Thrive trick each time & lets face it there are so many Thrive goodies that refresher tutorials are an excellent way to keep on top.
    Keep these coming!
    Cheers Alison

  • Jay says:

    Great tutorial! I noticed that you didn’t do the navigation at the top or the footer at the bottom. it would be great to understand how you would style these too. Are there any issues that you would encounter with these sections?

    • Hanne says:

      Hi Nhut,

      I didn’t do the tutorial on the menu because I used a full width template so the top menu is still there (no need to recreate) and the bottom menu is just a four column layout with text links, I didn’t think this would be very useful to show.
      But in this video at 8:13 you’ll see how to do it.

  • Bob B says:

    Really outstanding. Thank you so much for these tutorials. I get so many of my questions answered by watching you folks zip through these. Keep up the good work

  • Sarah M says:

    Great tutorial! Thank you!

  • Mark Sceats says:

    Hi Hanne – as with all your stuff that was helpful, thanks. I wasn’t aware before about how to set up the blog post grid which I’m now going to use.

    One thing you did which, from an SEO perspective, I suggest not doing is using header tags for styling purposes. Whilst not as important as it once was, ideally the document hierarchy should feature just one H1 for the primary page heading with H2 – H6 tags be applied to secondary and sub-headings as appropriate.

    Cheers, Mark

    • Hanne says:

      Hi Mark,

      You’re 100% right for the headings. I did use the heading 2 as being a real heading 2 on the page but I shouldn’t have used the second H1 ;)

  • Andrew H says:

    Great content Hanne. Thanks heaps. The question I have is around your themes. With the flexibility of the Thrive platforms is there any benefits or differences that you get with one theme over another? From what I have seen in this tutorial and others you can pretty much make the pages look however you need them, unlike other themes where you are locked into the items and elements that the theme makes available.

    • Hanne says:

      Hi Andrew,

      Indeed you can make the page look exactly as you want it to.
      The difference between the different themes would be more visible in the blog options (eg. how the featured image will look).
      And it will always be easier to choose a theme that is as close to the final look you want for your website but for all of your pages you can pretty much to anything with Thrive Content Builder :)

  • Johan C says:

    Thank You Hanne ! As always awesomeness…

    I liked especially The Post grid with the automatic shuffling to get the most recent post on the left.

    But overall an eye opener for me.

  • Donna Woolam says:

    Always Awesome! Thanks for the help you give us.

  • Stan J says:

    Great tutorial – Thank you
    This has clarified a number of issues.

  • Stephen P says:

    Hanna… MANY THANKS!

    As a Newbie to Thrive, I’ve just learnt more in 20mins watching your vid, than in three days messing around myself & trying to gleam info from the “Members Knowledge Base”.

    Let’s have some more….

    :-)

  • Susnanne Benzing says:

    Thank you Hanna for the interessting Tutorial!
    I like to fix the Menue on the Top, so that I can see it also when I scroll.
    Is this possibel? Wen yes- how I can do it? Or can I do it with an other Templet from Thrive Themes?

    Best Wishes
    Susanne B.

    • Hanne says:

      Hi Susanne,

      If you’re using a Thrive Theme you can find the option in the Thrive Theme options under “Style and layout settings” and choose for floating navigation.
      If you need help, you can ask our support forum for assistance.

  • Joan says:

    Thank you Hanne, you have a hypnotic voice and a fabulously simple way of teaching the steps at just the right pace. This tutorial was very helpful. Not sure if this is the right place to ask but I have re-designed all of my pages with TCB on a non-Thrive theme. If I purchase a Thrive Theme will the transition be simple or would I need some tech help? I’m reasonably WP savvy.

    • Hanne says:

      Hi Joan,

      Thank you very much :)
      For the transition, all your pages designed with Thrive Content Builder should stay exactly as they are (what might change is the top menu) but the page content shouldn’t move.
      What might change is your blog layout depending on the theme you were using.

  • Thomas says:

    Woah. The page section is great, but the post grids are badass! Didn’t know that it was possible to layout the posts as in the magazine themes. This shows that the limit of design is bounded by your imagination. :)

  • Betsy says:

    Great tutorial! Thanks so much! Is there a way to add a 3D effect to an element in the opt in (as seen at therisetothetop.com) using Thrive Content Builder?

    • Hanne says:

      Hi Betsy,

      Thanks. For the 3D element. Are you referring to the book sticking out of the section?
      In that case, you can do this by applying a negative margin to the image so that it “sticks out” of the section and overlaps the previous section.
      Hope this helps

  • Donald Obii says:

    Superb tutorial Hanne, you made it look so simple and swift.

    BTW, what theme was that you started off with??

  • Elisabeth H says:

    Thank you! I created a ‘template’ along with your video. What a great help.

  • Randy Cromar says:

    I believe I built a beautiful site using all your products. But now Google is telling me it takes way too long to load and docking me points from getting indexed. I think I may have to start over with just a simple theme and leave it at that.

    • Hanne says:

      Hi Randy,

      All our themes and plugins are optimized for speed so they should not slow down your site at all.
      Two things that come to mind when talking about optimizing a website for speed are:
      -Images: Are you using a lot of heavy images? Make sure to check out this article about image optimization.
      And the second one is hosting. If you’re on a slow hosting, no matter what your website will load slowly…

  • Lee S says:

    This is AWESOME, I just redid my home page and it looks great.

  • Peter French says:

    Hi Hanne, great post, can I ask you; why do you have a page section at arbitrary places in the page. I use no sections – is that a disadvantage?
    The, by trial end error, I find that text and images “stick together” better in mobile view in a content container, you seem to just drop text elements into the background image; what are the advantages/disadvantages of the two approaches?

    • Hanne says:

      Hi Peter,

      Page sections are useful when you want to have different backgrounds on different sections of your page.
      So if you want to have a page with a background image, a colored background, a background image again and so on you’ll need to use page sections to get this effect.

      For content containers, I use them when I want the text to be smaller than the full width of the section I’m in. I would have to see an example of when you use them to keep text and image together in mobile because I can not really think of a use-case of when this should be better :)

      If you want to learn more about mobile responsiveness with Thrive Content Builder, you can check out this video that goes more into depth about the different principles to apply to keep a page mobile optimized.

  • Thanks for another very useful tutorial, Hanne!

    Great use of the Grid-function.
    Could have thought of it myself.
    But I didn’t. :-)
    So thanks for showing that as well!

    • Hanne says:

      Hi Renée,

      I only thought about using it like this when I saw the Craftsy homepage and figured it would be cool to teach you how to do this too :)

  • Rebecca C says:

    Wonderful tutorial, thank you!

  • Luana M says:

    Another great tutorial…thanks Hanne. These are always a fantastic source of inspiration and knowledge and I love that we can access them at any time and follow along:)

  • Tony Blum says:

    Thanks so much for doing this. I love Thrive Themes and all of the other programs that go with it, but knowing HOW to create a great looking page and which elements are used to accomplish that was a shot in the dark. This really helps clear all of that up. I’d love to see more tutorials like this in the future. Great job.

  • Esta M says:

    This is so timely for me. Thank you so much!

  • Hans says:

    Hanne, I noticed you use MailChimp as your email client. Is TT still using ActiveCampaign, or have you switched to MC?

    Thanks for the tutorials. They’re very helpful–please keep them coming!

    • Hanne says:

      Hi Hans,

      This is a demo website and the first API in the list was MailChimp :)
      We still use and recommend Active Campaign!

  • David says:

    Hi Hanne,

    Thanks for a super tutorial. These page construction videos are really useful. I liked the Post Grid section; I didn’t realize you could separate the posts in that way. Cool.
    One observation. I noticed you multiple ‘H1’ headings on your page. From an SEO point of view would it not be better to just use one ‘H1’ at the top, and then use ‘H2’ afterwards, even if you adjusted the size?

  • Raj says:

    How to include the “check box” Send me useful tips… at the bottom of the page. https://www.craftsy.com/
    There home page is slightly different from the video.

    • Hanne says:

      Hi Raj,

      Yes this is different because the opt-in form they have is to create an account (and not to subscribe to a mailing list) that’s why they have an extra checkbox.
      If you’re using a normal opt-in form you do not need the extra checkbox.

  • Mike says:

    Great tutorial. I have one question though:

    If I have a theme (not a thrive theme), can I create a homepage just like you did and use it as my homepage instead of my theme’s actual default homepage ? If so, how do you overwrite the theme’s default homepage ?

    Many thanks for taking the time to do this.

  • Sylvia v says:

    Hi Hanne,

    Great tutorial as usual. However, as I want to build a new homepage for my existing site (and keep the current theme). I’m not getting all the options. I did not get the page section option if I kept my own page (with the menu) so I switched to a Thrive landing page. However, my options are still fewer than what you have in the video (as you’re using a thrive theme) and the one I am missing (and that is essential) is the post grid element.

    How will I be able to incorporate the latest posts in my homepage now?

  • Thomas says:

    Hi Hanne,
    I try to go the same steps like you, but…
    On my website I dont use thrive themes, only the thrive content builder. My first step was to get a page section and fill it with a picture. I use “Full height image”. The pictures size ist 960 to 300. But I can not see the hole picture, only if I change the desktop size in my browser. What can I do, to fix the visibility of the full picture? What ist the best size for a full width picture? Thanks Thomas

    • Hanne says:

      Hi Thomas,

      I’m guessing here, but probably your theme does not have a “full width template” in that case the page section will always take the width of the theme options.
      To overrule this, you can start with a blank full width landing page (you can find this template in the thrive templates cloud).
      For the size of the full width image, I would choose an image that is 1920px wide.

  • Hi
    Now, I learned how to play with content container. I would like to learn some tricks with event manager and how images appear suddenly when scrolling down the homepage.
    Thank you!

  • John N says:

    Thanks so much for your tutorial Hanne. I learnt so much that I can apply to future projects. Your teaching style makes it easy to follow the method. The training videos on the website are good, but showing how to reproduce an actual layout is really helpful. Looking forward to the next tutorial. Keep them coming.

  • Amitoj says:

    Wow. I have been working in thrive themes since last 2 years but still your blogs make me learn new things everytime.

    Keep posting such posts to keep your users updated :)

    Thanks

  • Nomi says:

    Nice information. I hope, i will try it soon.

  • Erik says:

    Hi Hanne

    I liked your tutorial and learned a few things too – thanks! In the blog posts section is there a way to display a custom filed (like a price for example) from the post – and a custom link as well (formatted into a button) so that the section becomes a place to display products. Thanks again,

    • Hanne says:

      Hi Erik,
      In the post grid, adding custom fields is not an option. If you’re using Woocommerce you could choose to display “products” instead of “posts” (in the edit query) but this will not give a price and button.

  • Bob J says:

    Hanne great presentation skills! Nice voice and voice inflections! You kept it upbeat.
    This was exactly what I needed to update my old website with a fresh new look. I admit I’ve been slow to use Thrive’s great advice and tools. Thanks TT team!!!

  • Hielke says:

    Do you support Dutch?

    • Hanne says:

      Hi Hielke,

      Not sure what you mean with “do you support”. All our products are fully translatable at the front end so you can use them on a non english website.
      Our plugins, support and tutorials however are in English.

  • Nic says:

    Left Justify Content Container … that one tip alone was worth watching for … always learning something and I forward these to my design team to keep them up to speed. We all love using Thrive because for complicated stuff, I get them to do it, and for easy stuff, I can just do it as quick as it would take me to ask them.

  • Robert says:

    Is “original” better than “proven” when it comes to conversion? How do we get more “proven” designs related to specific genre/fields/niches?

    • Hanne says:

      Hi Robert,

      When it comes to conversion there is not definite answer, you will have to test.
      One of the problems with “proven” is that you have to be sure that the designs you use as inspiration are actually “proven” to convert.
      What I mean by that is that you can easily use a design because you like it but without knowing the numbers, you can not 100% be sure that it is working.

      If you are getting inspiration from big websites that you know are conversion focused and do a lot of testing, I would say it is worth using them as an inspiration because it will allow you to piggyback on their expertise.

      To pull off “original” you really need a lot of knowledge (good design, conversion optimization,…) to make it work.

      If you’re starting out or your main expertise is not in conversions/design I would suggest proven over original :)

  • Bob R says:

    Great video, I’m trying to follow along and build a site but I can’t figure out what theme you started with?
    I’ve tried Pressive but the default page layout has a featured image, how do I get a blank page?
    I don’t want to import a landing page template as we will need the menu.
    Thanks!

  • Robert Jastrzębski says:

    Hi, Hanne. Great tutorial as always. I am going to “copy” the home page layout of the Shane blog (imimpact). Is it possible using TCB to obtain an “video hidden effect” which Shane used on his home page? How?

  • Kevin J says:

    Wow! Wow! That was an amazing demonstration of skills and technology. I was playing it back at 1.5x, and the new webpage just grew like magic, right before my eyes. It makes me feel like a whole new gorgeous website could be built within an hour. I’ll have to practice now, seriously!

    • Shane Melaugh says:

      Thank you very much, Kevin! Yeah, you can definitely get quite a lot done with TCB and one hour of time. :)

  • Hans says:

    Hi, Hanne.

    This question may not be directly related to this post; however, I don’t know of another way to ask this question. And I thought you would be able to help me, so I’m posting it here. Please let me know if there’s a better way/place to ask this. Thanks, Hanne.

    I’d like to know the effect of a multi-page blog post on conversions. Does the Thrive Team have any experience and opinions on them?

    Specifically, is it more effective for conversions to have one continuous blog post, or a post broken up into pages, which the reader has to advance through by clicking a “next page” button at the bottom of each post. Breaking a post into multiple pages could be a good way to gauge the reader’s interest and where that interest breaks down.

    Finally, how about the “progressive” blog post? I’ve noticed that either Thrive Themes or Authority Hacker (or both?), I don’t remember, added on to a post after publishing the first part; the second part of the post was not a second page, it was simply added on to what was published before it, making it a part of the same post. It’s a nice strategy, if you want to write a comprehensive post, but in smaller chunks. Again, does publishing a progressive post have any advantages or disadvantages, when it comes to conversions?

    Thank you!

    • Hanne says:

      Hi Hans,

      About multi-page blog posts, the only reason (to my knowledge) why blog posts are broken up in pages is to get more “page views”. This is interesting for websites that are paid by advertising on number of views per ad.
      I think it is very bad practice for user experience. It is annoying to have to click again and again just to get the information and it for sure will not help conversions.

      This is not the same as multi-part articles though. If you have a big topic and putting all of it in one long article would become impossible to read, you should split it up into multiple parts to make it more digestible.

      So splitting up an article so that each page only contains a few words and a picture and the reader has to click 3 or more times to read the thing ==> bad for conversions.

      Splitting up a 10 000 word article in 3 parts ==> good practice to improve readability.

      The progressive blog post is a whole other beast.
      We recently did this with the Why Sliders Suck post and the 7 Examples of Brilliantly Effective Opt-in Offers post.
      We used this strategy because the posts were very popular when we published them and kept getting a lot of organic traffic. Updating those posts, allowed us to show them to new subscribers (who might never have seen these posts before) and also shows Google that these posts are still relevant.

      Will this help for conversions? Well, it helps to get more traffic, more shares and eventually more opt-ins so I would say yes :)

      Hope this answers your questions!

  • Jamie H says:

    That was an incredibly valuable tutorial. Thank you Hanne.

  • Glenda says:

    Oh my, this is awesome! I learned so much. However, I still have the problem of all of my images not sizing correctly in the grid post section of the tutorial. I also have this problem with the images over my category archives post excerpts on my website. Are there specific dimensions I should use to avoid this problem? Or is there a Thrive theme that handles image size better. I am using the Rise theme.

  • Lorraine E says:

    Wow – what a fantastic tutorial Hanne. Thank you so much!

    I have just switched to the Performag theme and love the style of the homepage layout, but find the lack of options to use TCB elements alongside it quite limiting. With the information I have gathered here on how to style the 2 column blog grid, which will be automatically updated, I am confident I can create just the look I really want. Many thanks :)

  • SAL says:

    Thank you for this video, Hanne! So very helpful.

    Being able to “look over the shoulder” while someone is creating is so helpful for this visual learner. =)

  • Gareth says:

    This was absolutely hands down the best video from thrives so far – and all your videos are great. I applied this and made a great homepage. So I want to say thank you so much. You should have seen my homepage before. Thrive themes is one of the best investments I’ve made on the internet.

    • Hanne says:

      You just made my day Gareth! I’m always happy to hear when somebody applies our tutorials and gets great results :)

  • Nalin Wickramasuriya says:

    Viel Danke Hannah! That was so helpful. You commentary on your thought processes and decision making was probably the most helpful aspect as it allowed me to learn new techniques and how to apply them in a very practical way. Thank you so much for your time and thought.

  • Elana D says:

    Because I just have lead pages and not thrive themes, I don’t have the menu bar. You mentioned that you could recreate that. Can you explain how or is there another resource where I can learn how to do that?

  • chaitanya says:

    nice video with great tips…..

  • Jamil H says:

    Thanks for the great video tutorial, Hanne! I was wondering how to apply this to my existing site. After creating a new homepage, how does one assign this new homepage over the old one?

    Also, I have a bunch of old posts up and was wondering how to most efficiently add Thrive content builder aspects to older content. Is there a way to do this easily? Or do you have to just go back and start from scratch and copy and paste older content into a new post built with TCB?

    Thanks!

  • Glen G says:

    Hi Hanne,

    This is such a helpful post! Do you know of a website where I can use to get Color combinations for my homepage designs?

    Thanks in advance!

    Glen

  • Scott B says:

    Such a helpful and informative video, Hanne!
    Thank you so much for putting these together for us!
    They make a world of difference! :)

  • >