Disclosure: This post contains affiliate links. We will receive a commission if you make a purchase through our affiliate link at no extra cost to you. We are a participant in the Amazon Services LLC Associates Program, which is an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon.com. As an Amazon Associate I earn from qualifying purchases. This website is independently owned and operated. We are a website which receives compensation from the companies whose products and/or services we review. The opinions expressed here are our own. Please read our full disclaimer here.
If you read my earlier post, you saw how to download and activate the Thrive Themes Suite to your WordPress dashboard. Today we are going to be taking the next step in the process and setting up your theme in the Thrive Theme Builder.
What is the Thrive Theme Builder?
As a part of their suite subscription, Thrive Theme Builder allows you to create a consistent theme (or brand) across your site. It provides the ability to easily make changes across your site in one place, instead of having to edit each individual page.
Thrive Theme Builder works with the Shapeshift and Ommi Themes by the same developer, and often gets mistaken for Thrive Architect. While it’s true that both products complement one another, Thrive Architect functions as a page builder –to edit a single page on your website– as opposed to changing the design of it as a whole.
Think of it this way: as part of your branding, you might want to have the same, consistent structure, design, colors, and visual elements throughout your site. If you choose a pink header menu with bold, white font hyperlinks, Thrive Theme Builder will provide the ability to have that same header throughout your site. However, your About Us page and your Shipping Information page will likely have completely different content on it. Perhaps one of those pages even has a “Contact Us” form element on it, or you want to include a video on how your company is changing the industry on the About Us page– this is where Thrive Architect comes in.
How Do I Use Thrive Theme Builder?
Open the Builder in WordPress
- First, log into your WordPress site.
- Make sure that the Thrive Themes Builder has properly installed by clicking on Thrive Dashboard in the main WordPress menu, then scroll down in the submenu and click on Thrive Theme Builder. If you do not see either of these menu options listed, please check out my post to guide you through activating and installing Thrive Themes.
Choose a Theme
- Clicking on the builder may automatically redirect you to the Site Wizard section. If you click on Themes in the left menu within Thrive Themes Builder, you can see which theme you currently have activated.
- If you do not see either the ShapeShift or Ommi themes listed, or want to change which one you are using, click on Add Theme.
- A pop up window will give you the option to either Load from the Thrive Cloud, or Import from File.
- Click on Load from the Thrive Cloud, hover your cursor over the themes to see more options, and then click the Download button on the theme you want to install. You can select Preview if you want to see the theme prior to downloading.
- Once you have installed a theme compatible with the Thrive Theme Builder, click on Site Wizard. Then click on Get Started.
Complete the Steps in the Site Wizard
- At this point, you have the option to upload a logo for your site. An image of 250px by 40px is recommended. Click on the image to upload your own logo.
- You can either drag and drop or click on the Select Files button to upload the image.
- Once the image has uploaded, click on Select at the bottom right hand corner of the window.
- Click Choose and Continue to complete the setup of your logo.
- The next step in the Site Wizard is to select a brand color. Click on the blue square to select your brand color.
- A global color gradient will appear beneath the square. You can alter the shade and opacity either by dragging the color selector and sliders, or you can type in your specific HEX value if you have one. Keep in mind that just as the warning beneath the selector states, this is a global element. Which means that you are setting the theme color for the entire site.
- Click on the Apply button to select your theme color, then click Choose and Continue to save.
- Now there’s two ways to view different header options. The first method is by clicking on the dropdown menu in the top right corner. This will open a new window for you to visually select from several options at once. Click on the header you want to select, and it will load as a preview. The second method is by using the arrows to the right and left of the header itself. I personally prefer to look at all the options at once so I have a visual comparison.
- Click on Choose and Continue if you want to save this as your main header template. You will be able to customize the details at another time, so if the menus do not look exactly how you want it, just know you can edit it later.
- This process works similarly to the Header section in that you can select your options via the dropdown or by clicking on the arrows. Once you have made your selection, click on the footer to load as a preview.
- Click on Choose and Continue to save. Just like the header section, you can edit and tweak the details at a later time.
- When you click on the Homepage section in the Site Wizard, you will be presented with three different options. Now you can choose from ready-made templates, display one of your existing pages if you have one already set up, or display your most recent blog posts as your homepage.
- So what is the difference among these three?
The ready-made templates give you a complete starting point if you have not set up anything at all on your site. Clicking on this will give you a handful of homepage options to choose from. You can either use the preview mode, navigating with the arrows as before, or you can use the dropdown menu to view all the homepage options at once.
Displaying one of your existing pages may come in handy if you already have some content on your site, and want one of those pages to be what people see when they first go to your site. Perhaps it is a storefront, an introduction to what your business does, or a landing page for a special offer. When you choose this option, you’ll see a standard sample page at first. Click on the dropdown menu to select the page you wish to appear instead. If this is a brand new site, however, you likely won’t see anything listed other than the sample page. You’ll be able to customize the template of this page in section eight of the Site Wizard, and you can select the specific page at a later time once you have that information up on your site.
If your website is a blog, the third option to display your blog as a homepage may be something to consider as it will feature all your recent blog posts on the main page. When you select this option, you won’t be given templates to choose from; instead, you will be able to change the template for the blog page in section seven of the Site Wizard (the Blog Post list).
Click Continue after you have selected which option you prefer. If you accidentally selected any of these three and want to go back, click on Previous Step at the top left of the page.
Single Blog Post
- This page works the same as many of the other templates you’ve already encountered. You’ll either select the option using the preview mode, or you can view all templates at once by clicking on the dropdown menu.
- Click on Choose and Continue to save once you have selected which template will work best for your individual blog posts.
Blog Post List
- This is where you edit the page where your recent blog posts will appear. Even if you do not have this set up as your homepage, if you are running a blog site, it is a good idea to go ahead and select how you want your posts displayed. As in previous steps, either use the arrows or dropdown to select your preferred template.
- Click on Choose and Continue to save.
- As with the previous options, select the arrows to preview different templates or click the dropdown menu to view them all.
- Click Choose and Continue once you have selected the template you want.
Pages and Blog Posts
These features are not yet available in Thrive Themes, so I won’t be covering these options in this tutorial.
- The last section in the Site Wizard is the Menu option. For this, if you have set up a menu already in WordPress, then you should see the menu name listed in the dropdown for the header and footer options. If this is your first time setting up your WordPress site, you can select I Will Choose Later and then come back to select these options once you have created the WordPress menus.
- Click Activate Menus on My Site if you want to move forward with choosing your template options, or Continue Without Choosing a Menu if you do not.
Go through the Branding Options
- After you have finished the Site Wizard setup, you are given the option to preview your site, watch a video on next steps, or go to your Dashboard in Thrive. You will also see your menu options to the left of the Thrive Theme Builder. Click on Branding.
- You may remember in the Site Wizard section the option to choose your primary brand color. Here is where any other global theme colors will be listed once you have created and saved them. You can edit these in this section by clicking on the color box and using the sliders or HEX field to enter in the new color. Click Apply to save.
- The logo can also be edited in this section. You can alter the light and dark versions of your logo by clicking on the image, uploading your image to the Media Library, and selecting the image. Once you click Select, your image will automatically save. If you want to link your logo to a specific page, enter the URL in the Logo Links to field, then click Save URL.
- Finally, you can upload a Favicon in the same way you would add a logo image. Click on the big X or on the Change Favicon link, upload to the Media Library, and select the image. Clicking Select will automatically save the Favicon.
Select Your Brand’s Typography
- In the Thrive Theme Builder menu, click on Typography. If your company has specific typography branding, or you have a font preference for headers, paragraphs, etc. this is where you’ll be able to set those fonts as default. To edit the current typography selection, click on the Pencil icon at the bottom right of the typography set you wish to edit. Alternatively, you can click Create New Set at the top right of the page.
- A new window will open, and you will see a list of example fonts for headings, paragraphs, lists, hyperlinks and more. To the left of the page, you are given the option to change the font, color, and if there is a shadow on the font. Caution: if you change the font selection here, it will change the font for ALL of the text options..
- To edit each text type individually, scroll over the list to highlight the section you want to change, and then click on it. Now, the options over to the left of the window will be a bit more detailed. You can change the font type, color, and shadow option as before, but now you will also be able to transform, align, and format the text as well. Additionally, you can alter the sizing of the text, the spacing between lines, and even the space between each letter.
- When you are done editing the typography, click Save Work. Then click the X to close the open tab and go back to the open window with Thrive Themes Builder.
Set Default Templates for Posts, Pages, and Lists
- The next section in the builder is Templates. When the page loads, you’ll see a list of core templates that are already set as default. There are two ways to change the defaults. One way is to click on each individual template and make changes within that post, page, or list. The other way is to click on the dropdown menu at the top of the page, and then click on All Templates. Doing so will load a page where you can easily view all page, post, and list templates in one place. For the purpose of this tutorial, we are going to select All Templates.
- To set a new default from the All Templates page, click on the three dots to the right of any template image, then select Set as Default. Your preference will automatically be saved. (You also have the ability to rename these templates in this submenu.)
- If you do not like the templates that are available and want to create your own, click on Add New at the top of the page.
The last option within Thrive Theme Builder is the Site Speed menu. This is not something we will address in this post, as this veers away from the topic of site aesthetics and goes more into site performance. But it is good to know that there are additional options available should you want to look into boosting your website’s speed.
Now that you have chosen a theme, selected the templates, and determined the fonts you want on your site, you can preview your site by clicking on Site Wizard then Preview Site.
Congratulations on getting your new website started using Thrive Themes Builder!