How to Turn a Blank Website Template into a Landing Page

Author 
Chipo   59

Updated on April 19, 2024

Do you want to know how to transform a blank website template into an eye-catching landing page?

Keep reading.

Creating a compelling landing page isn't just about filling space—it's about building a design that captures attention and encourages action. A well-designed landing page is what you need to convert visitors into leads or customers.

If you've got a blank template that's stressing you out, don't worry. We've got you.

We've put together an easy-to-follow step-by-step tutorial on how to develop an impressive landing page from a blank template, so you can engage your audience effectively and boost your conversion rates.


Building From Scratch Doesn't Have to Be Difficult


A lot of small business owners and entrepreneurs stress over the technical details and design needed to create a landing page that grabs attention and converts visitors into leads.

There's often a fear that starting from scratch requires deep expertise in both graphic design and marketing to get professional results. Thankfully, with today’s easy-to-use web design tools that come with simple drag-and-drop features, these challenges become much more manageable.

One of the great things about starting with a blank template is how much control and customization you have over your own website.

Especially when using the right no-code website builder.

There’s nothing there that doesn’t fit your brand or meet your goals—you get to make all those decisions yourself. You choose your fonts, page layouts, contact form placement, and more. All website design decisions go through you.

Using the right tools and a clear plan, you can transform a blank canvas into a high-converting marketing asset that not only looks good but works hard too. The trick is to focus on elements that make your website layout easy to follow and engage with, like catchy headlines, clear navigation, strong call-to-action buttons, and great visuals. These can all be tailored perfectly to meet—and even exceed—your marketing goals.

Let’s dive into how to pick these elements and craft a landing page from scratch that really draws people in and gets them interested.

How to Customize a Blank Page Template from Scratch (Step-By-Step)

After you’ve purchased a custom domain and set up WordPress, it’s time to build your first landing page.

This tutorial shows you how to create a stunning page with one powerful tool.

1. Download & Install Thrive Architect

Thrive Architect is the tool you need to create high-quality, landing pages that make people want to read, scroll, engage, opt-in, and buy.

Thrive Architect Sales page

This landing page builder makes building (pages) from scratch easy – really easy. Saving you time in learning so you can focus on generating leads and sales for your business.

This plugin gives you access to hundreds of customizable templates to create stunning webpages that leave your audience going “Wow. I want to learn more about this business”.

Landing page templates in Thrive Architect

Landing page template sets in Thrive Architect


Every page template was built with conversion generation in mind, so you’ll find all the crucial elements you need to guide your site visitors to buy or sign up.

Want to make changes to a template or build a page from scratch? No problem. And no need to know HTML or CSS.

Ideal for WordPress beginners, the Thrive Architect editor comes drag-and-drop functionality and a large selection of block templates and design elements you can easily add to your pages to create a custom design. Web development made easy.

A selection of block templates from Thrive Architect

A selection of block templates from Thrive Architect


Like we said – easy building.

All our templates are also tailored to create a responsive design, so your audience can easily open, read, and engage with your pages from any device.

In terms of integrations, this plugin works seamlessly with most Google analytics plugins and the best SEO tools to help you track your metrics and optimize your content for search engines

You can also connect your pages to your checkout tool of choice if you run an eCommerce website.

Thrive Architect doesn’t have a free version, but this pro plugin offers a 30-day money-back guarantee — allowing you to give this tool a try, risk-free.

Think of it as a free landing page builder trial.

But for now, get the tool, and continue with this tutorial to learn how to make pages that actually generate conversions.

2. Create a New Page in WordPress

In the WordPress Dashboard, select the "+ New" button at the top of the page and select "Page" from the dropdown menu.

Adding a new page in WordPress


When taken to the next screen, name your page and select the bright green "Launch Thrive Architect" button. 

3. Select a New Landing Page Template

After you launch Thrive Architect, a menu will pop up with four options:

Choose a landing page type in Thrive Architect.


1. Normal Page

2. Blank Page with Header and Footer

3. Completely Blank Page

4. Pre-built Landing Pages


Usually, we’d recommend choosing the "Pre-built Landing Page" option since it’s the faster option. You get to choose from hundreds of professionally designed templates that are designed to convert.

Landing page templates


Since we’re building from a blank template, you have two options to choose from:

  • A blank template that includes your site’s header and footer (perfect for homepages or other core site pages)

  • A completely blank template that doesn’t have any headers, footers, etc – this is better suited for landing pages that aren’t connected to your site (sales pages, lead-gen pages, etc.)

We’re choosing option 2 because we’d like our page to have the header and footer included.

Let’s carry on.

4. Add a Hero Section to Create a Great First Impression…

“Building from scratch” doesn’t have to mean using code, or piecing one individual design element after the other.

Remember, you’re here to build fast and save time without compromising on quality. And that’s why we created block templates.

These building blocks (pun intended) help you create your own landing page templates that you can customize and use over and over again. 

To get started, just hit the “Block” button on the blank page.

In the block template library, search for the “Hero tab” and scroll through your options until you find the perfect hero section that’ll grab your audience’s attention and keep them scrolling.


Add an attention-grabbing headline to address your target audience’s pain point – or pique their interest –and use the supporting headline to briefly mention your solution the problem.

For your CTA button, avoid using generic prompts like “Click Here” or “Buy”. Use power phrases like “Sign Me Up”, “Tell Me More”, or “Join the VIPs” to compel your visitors to convert.

Also, make sure that you use a high-quality visual for your hero image.

5. Next, Add a Testimonial Section to Immediately Build Trust

You’ve got your audience’s attention, now you need to show them they can trust you. 

Testimonials are a great way to show your potential customers that your products or services are the ones to use.

6. Guide Your Audience with a Compelling Story

Right after that initial "hello" from the hero section, a your landing page needs to keep the conversation going with a compelling story. 

This is where your page really starts to speak to your prospects, heart to heart. Build a connection by addressing your target audience’s pain points to show them you understand their struggle.

You don’t have to be too fancy here. A multi-purpose text block works quite well. See below:

Use the pre-placed subheadings and text boxes to add your copy and build that connection.

7. Features & Benefits Section to Showcase the Value of Your Services

Use this section to paint a picture of how your product can make your potential customer’s life better. 

In your landing page copy, don’t just tell them what your product entails, describe how each feature will help improve your reader’s situation.

8. Include an About Section to Share Who You Are

Adding an “About Us” to your homepage helps your audience get to know you better.

This is the place to mention who you are.

Include details that add to your credibility – certifications, work experience, academic achievements, awards.

You should also add a high-quality photo of yourself (and your team members) to further build trust.

9. Don’t Forget Your Call to Action Sections to Prompt Conversions

The goal of your landing page is to get your audience to take a specific action. 

If you have a primary service you offer, you should have a CTA section that prompts your site visitors to buy it. 


Thrive Architect also provides conversion-focused design elements like pricing tables, countdown timers, widget areas, and lead-generation forms. 

Just click on your element of choice and drag-and-drop it onto your page template.

10. Connect Your Landing Page to an Email Marketing Service

If your landing page requires your visitors to sign up to a mailing list, you’ll need to connect your opt-in forms to your chosen email marketing service.

Next, you’ll need to connect your email service through API. You will only need to do this once for the first opt-in form you set up.

You can find tutorials for all major email providers here, including MailChimp, ConvertKit, ActiveCampaign, and Drip.

11. Test and Publish Your Landing Page

Once you’ve finished customizing your landing page, be sure to test it on different screens (desktop and mobile devices).

Hit “Publish” and start sharing links to your page.

We also recommend running regular A/B tests on your landing page, to ensure you’re presenting the most conversion-optimized version possible.

Next Steps: Start Driving Traffic to Your New Landing Page

Building an effective landing page is one step. Getting it in front of the right eyes is the next.

Here are 4 free resources/tutorials to help you drive the right traffic to your website and increase your conversion rates:

Build a Stunning Website that Generates Conversions

Now that you know what a landing page is – and how to build one – it’s time to make sure that the rest of your website is just as impressive (and conversion-focused).

Thrive Architect is your go-to for creating hassle-free pages that are designed to convert visitors into quality leads and customers – helping you grow your business.

This tool simplifies the technical side of things, freeing you up to concentrate on what you do best: connecting with your audience and delivering standout content that drives your business forward.

So if you’re ready to level up and create funnels that boost your conversion rates — and snag more potential customers — you know what to do.

Get Thrive Architect today.

by Chipo  April 19, 2024

59

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. We only recommend products that we believe will add value to our readers.

Enjoyed this article ?

You might also like:

Leave a Comment

  • YES. YES. Keep chipping away at that time expenditure, that’s exactly the way to go for me. I care much less about the “fancy” stuff and much more about perfecting the very basics, the gestures that you need to repeat over and over, so that they come as natural and as quick as possible. Smoothen the workflow.

    You know what, even if you’ve built these, it would still be nice to have a video that details your process in setting up a landing page from scratch. Until now, unless I missed something, we have only seen you doing that at the start of videos on other topics. What I’d like to see is a video on just the setting up process, focusing on the small details of the most “radical”, global settings, and how to make sure you spend as little time as possible creating a page by setting it up correctly in the first place. I want to understand the principles behind it all, so that I can master the “roots” of ANY page, and not just the ones that flow naturally from these blank templates.

    In fact, I would like to see more video about workflows in general. Which is to say, not about the many things you can do (which is always appreciated), but about the PROCEDURE that lets you do them most EFFICIENTLY.

    I always get the feeling that I could use Thrive much more efficiently and avoid more mistakes if I only knew the right procedure right from the start. The software itself is pretty awesome already, what I need are “smarter” and “deeper” instructions to learn how to work with it faster and more “correctly”, if that makes sense.

    In fact, I would gladly pay extra for a course to learn how to do that, as long as the price is affordable. Time saved is money gained.

    Also: time for a SNEAK PEEK at the next few months!

    • Thank you for your suggestion, Lorenzo! This is very helpful for me.

      Yes, I can definitely do a tutorial on this setup process. And I’ll think about what else I can do in terms of workflow tutorials.

  • Nice! I’ve watched almost all of your webinars/videos since my agency license purchase over 2 years ago!

    I was wondering when you were going to make a template like this for us.

    May I request a variety artist/entertainer business set of pages. I have a lot of clients in the family entertainment business, a nice group of testimonials/videos and a few “boxes” with fun fonts templates would be nice.

    Thank you!

  • It looks great indeed!

    But please make this styled section element available within Thrive Architect so that we can use it for blog post and make easy color sections without heavy CSS customizations. I would be very happy about it. 🙂

  • Amazing!!! work once again. But I think it is time to release the new versatile and highly customizable theme that we have been hearing about for the past 6+ months 😉

  • I learn something new every time. It’s the examples you use when demonstrating new features (or even simple templates like these!) that make it come to life.

  • As always Shane, cut away the rubbish and provide useful additions to the portfolio that we can adapt and save us time and effort.

    Keep up the great work.

  • I hardly use these landing pages. I use TA to build normal web pages with a menu. I know I can add the menu to landing pages, but that is not what I want. I want to use and see the default header. But I recognise that I have to do these initials setups all the time. Can you please add the option to use landing page templates on normal pages!?

      • Would be great to have TTB (Thrive template builder) to actually build the “shell” that all that great TA content can go in.

    • I don’t know if you use Genesis themes or not, but there is a plugin called “Genesis Dambuster” that lets you knock out any or all of the common sections/elements of a Genesis page. I’ve used it to knock out everything but the header on pages, and then use TA for the rest of the page. Works great.

  • Hi Shane! Thanks a lot, very useful.

    I got 2 hints, which obviously are not reported to you from support:

    1.) There are repeatedly issues with custom menue element on mobile (cannot be seen, Z-Index issue etc.), which come back after an update though they had beeen resolved before.

    2.) Some sites and their pages cannot be edited in mobile view any more.

    And finally an idea for a new blog video: It would be good,if you can dedicate a whole video to text editing (spacing etc. on the space settings page) including spacing with a focus on the latest feature to define them for a complete page before you start.

    Thanks.

    Lars

    • Thank you for your comment, Lars!

      I’m aware of the problems and limitations with the custom menu element. We’re hard at work on a completely new version of this element. The mobile editing I’ll look into as well.

      And thank you for the suggestion for a video on typography. I like that idea. 🙂

  • I have created a page from scratch, and always see a white patch & disappear during loading. I guess with the new blank templates, will resolve such issues. Good job.

    • Hm, that’s something I’ve never seen before. If the problem persists, please post about it on our support forum, so our team can help you out.

      • Thanks for reply. This issue already raised to your support. They mention something to do with how the js is loaded on that page and to set background section full width, which I have already set. Anyway, I will tried out the new blank template to see if this white patch will go away.

  • Hei Shane,

    Great to see new features. I have a question… because I think I misunderstood 2 things.

    Will we have the A/B test feature this month?

    Will we have a new theme this month?

    Just ask because I was kinda saving.. some moves let’s say for those 2 things but I might got it wrong about the launch dates.

    Thanks

    • hello Raul,

      A/B testing will be released to members this week. Public release is happening a week later.

      The theme won’t be ready this month, though. We don’t have an ETA for that yet.

      • Hi Shane, will the new theme have an integration with buddypress ‘out of the box’ or will it be easy to implement the functionalities. I think like themes from buddyboss, Kleo, Woffice e.g.

  • Great pages that will be useful and save lots of time.

    Could you consider doing some tutorials on bold landing pages / home pages for sites in the IT sector and even some for offline businesses like car servicing / repair etc where the usual elegant sites look a little out of place.

  • Thanks, Shane!
    Templates are nice for landing pages but landing pages don’t include keeping your logo menu at the top. You lose your menu and footer when using a template. This creates work trying to reproduce your menu to look uniform on your site. Is there a solution? I’m sure many would like to use templates for main pages of their website.

  • Hi Shane,
    very nice – I enjoy simplicity and clean uncluttered designs. I am still looking for the ability to have an image on the screen and that the image has links on top of them in specific areas to lead you on the trail through pictures instead of the typical drop down menu’s.
    For example the picture of an airplane has areas of interest such as the wings and motor or cockpit or tail. It would be nice to have a link over those details that pop up with options and then clicking on them leads to the links offered. Very visual and intuitive. Just some food for thought…
    Thanks for all that you do.
    Sincerely, Gerhard

  • Love it Shane! As someone else said, this little time saver is VERY helpful.

    I really appreciate the direction you are heading with Thrive Themes. This is my second year as a subscriber at it is well worth the money. I felt trapped by ClickFunnels.

    Thank you!

    • You made a great chocice Jason. I left FFunnels (as I now refer to them) 1 month ago after 12 months of investment of time particularly and endless problems. Wrote off all our work and started again from scratch with Thrive. Have not looked back. Now migrating other sites.

  • Hey Shane,

    This isn’t directly related to Thrive Architect, but I thought it might be the best way to get your comment on something.

    In Thrive Leads, is there any plan to not require opt-ins be part of a Lead Group? It’s caused some issues, and support basically said ‘deal with it.’

    Let’s say I want to implement a sitewide ribbon – meaning it gets shown on every single page and post. Let’s also say that I have 10 different Lead Groups.

    The only way to have this ribbon truly sitewide is to create it 10 different times for each Lead Group. And every time I make a change, I need to edit it 10 different times.

    I understand Lead Groups are convenient for testing opt-in types against each other, but right now it’s preventing some basic functionality.

    If we could have ribbons, exit popups, scroll mats, screen fillers and slide-ins still follow a priority, but not be required to be in a Lead Group, I think that would solve the issue.

    Alternatively, you could allow Lead Groups to stack on top of each other, and if there is a conflict (ie. 2 exit popups), the higher priority group wins.

    Your thoughts?

  • Thanks fro the update, very useful and will increase the creation of pages.
    When you might show examples for pages from scratch, can you do an example for a home page with Woo commerce integration? Looking forward

  • Truly a great example of “less is more.” I’ve been so behind on all the new Blog content that I’ve got so much catching up to do! Just tried Thrive Architect again today for the first time in around a month or so and couldn’t believe all the improvements you’ve added.

    My favorite so far: removing the annoying text formatting box to the top of the page! I hated how that thing got in the way of trying to type all the time! A close second: making the More tag an element. Genius!

    Keep up the good work, guys, and I’ll keep singing your praises!

  • Would love to have a blank page with the header section set up with logo placement and menu design (including burger stack menu for mobile).

  • I built a website using only Thrive Architect. Not a Theme. I used symbols for the header and footer (since those areas are global) and now I want the Blog layout to have the same header and footer. Since I’m not using a theme, how would I make the Blog layout use the symbols I created for header and footer? I can follow a tutorial on creating a blog layout and activating it in WordPress but I’m specifically looking for a way to pull the HTML and Code from the header and footer symbols I created so that I can add them to my blog layout. It’s very annoying how WP has a separate blog layout. Who does that anymore? Don’t you want the website to look the same except the blog content would change in the body section? I also LOVE designing my web pages with Thrive architect and just bypassing using a theme altogether. Especially now, with the Symbols integration, I can make those global elements and only edit them one time. Just wish I could overwrite the BLOG layout. Any advice or specific instruction you can provide me??

  • {"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
    >