How to Set Up Your Website Branding in Thrive Theme Builder

In this article, you’ll learn how to set up your website branding in Thrive Theme Builder—including your logo, favicon, theme colors, typography, and custom fonts. All of these settings are managed from the Thrive Theme Builder dashboard and apply globally across your entire website.

Accessing the Branding Section

1. Go to your WordPress admin dashboard.
2. Click Thrive Dashboard > Thrive Theme Builder.
   
   

   

3. In the left sidebar, click Branding.
   
   

The Branding page displays three sections: Theme Colors, Logo, and Favicon. A live preview of your website appears on the right side.

Setting Up Your Logo

Thrive Theme Builder supports two logo versions—a Dark Version (for light backgrounds) and a Light Version (for dark backgrounds). Uploading both is optional but recommended if your site uses both light and dark sections.

Uploading a Logo

1. In the Branding section, click Logo to expand it.
   
   
2. Click the image placeholder under Dark Version or Light Version.
3. The WordPress Media Library opens. Upload or select your logo image.
4. Click the Select button to confirm.
5. In the Logo links to field, enter the URL the logo should link to (typically your homepage).
6. Click Save URL.

Note: SVG files are not supported for logo uploads. Use PNG or JPG formats instead. The recommended logo size is 250x40px.

Adding the Logo to a Template

After uploading your logo in the Branding section, you still need to add it to your templates:

1. Go to Templates in the left sidebar and click Edit on a template.
   
   
2. In the editor, click on a section (e.g., Header) from Main Options in the left sidebar.
   
   
3. Click Edit to enter Edit Mode.
4. In the right sidebar, click the plus sign to add elements.
   
   
5. Search for the Logo element and drag it into the section.
6. The uploaded logo is automatically imported. Use the left sidebar to switch between Dark and Light versions.

Setting Up the Favicon

The favicon is the small icon that appears in browser tabs and bookmarks.

Adding a Favicon

1. In the Branding section, click Favicon to expand it.
   
   
2. Click the image placeholder to Change Favicon.
3. The WordPress Media Library opens. Upload or select your favicon image.
4. The favicon immediately appears in browser tabs.

Changing or Removing the Favicon

• To change the favicon, click Change favicon and select a new image from the Media Library.
• To remove the favicon, click Reset favicon.

Configuring Theme Colors

Each Thrive Theme Builder theme comes with a set of pre-established Theme Colors that are used across all templates for buttons, banners, highlights, and other elements.

Editing Theme Colors from the Dashboard

1. In the Branding section, click Theme Colors to expand it.
   
   
2. Click the first field to see the available theme colors (the number varies by theme).
3. Select a color and click its color box to open the color picker.
4. Choose a new color using the picker, or enter a HEX/RGB code manually.
5. Adjust the Opacity if needed (1–100).
6. Click Apply.

Warning: Editing a theme color applies the change globally across all templates that use that color. A warning will appear to confirm this.

Editing Theme Colors from the Editor

You can also edit theme colors while working in the template editor:

1. Open any template in the editor.
   
   
2. In the right sidebar, click the Central Style Panel to open the Style Editor.
   
   
3. The Style Editor contains the same theme colors as the Dashboard’s Branding section.
   
   
4. Changes made here also apply globally.

Resetting Theme Colors

To reset all theme colors to their defaults, click the Reset icon in the Theme Colors section and confirm the action.

Setting Up Typography

Typography in Thrive Theme Builder is managed through Typography Sets—predefined collections of font styles for headings, paragraphs, and other text types. Changes to typography apply globally across all templates that use the active set.

Note: When using Thrive Theme Builder, the standard WordPress Appearance > Customize > Fonts section is not available. All typography management happens through the Thrive Theme Builder dashboard.

Editing the Active Typography Set

1. In the left sidebar, click Typography.
   
   

   

2. The active typography set is displayed with a preview of each text type.
   
   

   

3. Click the pencil icon to edit the set—this opens the Thrive Theme Builder editor in a new tab.
4. Click on any text type (heading, paragraph, etc.) to select it.
5. Use the Font option in the left sidebar to change the font family.
6. Click the green Save Work button when done.

Font changes apply throughout all templates that use this typography set.

Additional Typography Actions

• Rename — Hover over the set name and click the pencil icon next to it. Type the new name and press Enter.
• Expand/Collapse — Click the two arrows in the top-right corner of the set preview to expand or collapse the preview.
• Reset — Click the Reset option next to the Edit icon, then confirm with Reset Set to restore the default styles.

Creating a New Typography Set

1. Click Create New Set in the top-right corner of the Typography page.
   
   
2. The new set appears under Other Available Typography Sets.
   
   
3. Customize it using the same editing process described above.

Important: New sets are not active by default. Click Make Active in the top-left corner of the set to activate it and apply it across your site.

Deleting a Typography Set

Only inactive sets can be deleted. Click the Remove button on an inactive set and confirm the deletion.

Adding Custom Fonts

If you need fonts beyond the standard options, you can upload your own custom fonts or install Google Fonts locally using the Thrive Font Library.

Accessing the Font Library

1. Go to your WordPress admin dashboard.
2. Click Thrive Dashboard in the left sidebar.
3. Click Font Library to open the Thrive Font Library page.

The Font Library has three tabs: Library, Upload, and Google Fonts.

Uploading Custom Font Files

1. In the Font Library, click the Upload tab.
2. Drag and drop your font files into the upload area, or click Upload Fonts to select files from your computer.
3. Uploaded fonts appear in the Library tab and become available in the Thrive Theme Builder editor.

Note: Supported font formats are .otf, .ttf, .woff, and .woff2.

Installing Google Fonts Locally

Instead of loading Google Fonts from external servers, you can install them locally through the Font Library. This serves fonts directly from your website, which helps with GDPR compliance.

1. In the Font Library, click the Google Fonts tab.
2. Browse the list or use the Search Google Fonts field to find a font.
3. Click on a font to see its available variants.
4. Select the variants you want and click Install.
5. Installed fonts appear in the Library tab.

Using Custom Fonts in Templates

1. In the Thrive Theme Builder dashboard, go to Templates and click Edit on a template.
2. Click on a Text element where you want the custom font.
3. In the left sidebar, go to the Fonts section.
4. Click the field below Source and select Custom Fonts from the dropdown.
5. Click the Font field to see your uploaded fonts and select one.
6. Click the green Apply button.

Using Custom Fonts in Typography Sets

1. Go to Typography in the left sidebar.
2. Click the pencil icon to edit a set.
3. Select a text type and follow the same process above—change the Source to Custom Fonts, select the font, and click Apply.
4. Click the green Save Work button.

Related Resources

• Getting Started: Learn how to get started with Thrive Theme Builder and configure your site.
• Demo Content: Learn how to set up your website with demo content to match the demo.
• Connecting Social Media: Set up your social media profiles for your theme.