All Collections
Thrive Architect
Landing Pages
Using the Style Editor in Thrive Landing Pages
Using the Style Editor in Thrive Landing Pages

Learn how the Style Editor from the right sidebar can be used to help you keep consistency throughout your website.

Iulia Dezmirean avatar
Written by Iulia Dezmirean
Updated over a week ago

Similar to the Thrive Theme Builder style editor, when customizing a Landing Page you are able to reuse elements and styles, control colors and typography or inherit them from your active theme.

Of course, inheriting your fonts from your active theme will only be available if Thrive Theme Builder is installed and activated on your site.

When you first load a Landing Page, a tooltip will appear to help you find the style editor:

When you open the Style Panel, there are two available tabs - "Colors" and "Fonts":

Colors

The "Colors" tab will allow you to switch to different color sets for that particular Landing Page.

When you load a Landing Page template, it will come with a specific set of colors that matches the theme associated with that template.

In case you want to change the master color palette, you can do so from the "Master Template Colors" field:

As you can see in the animation above, that will change the color palette of the entire Landing Page.

The "Other Template Colors" section will easily allow you to change the color of several aspects such as accent colors, dark and light elements etc. throughout the entire Landing Page:

Fonts

Previously, the Landing Page fonts were accessible from the left sidebar of Thrive Architect, when clicking on "Page" from the breadcrumbs:

We've decided to move the font settings in the style editor as well:

So now, the Landing Page typography settings can be edited from the Style Editor:

Inherit typography from the active theme

The "Inherit typography from the active theme" toggle will allow you to set whether the page should inherit the typography from the active Thrive Theme Builder theme or not:

If enabled, the next option will be unavailable, as the fonts will be imported straight from the Thrive Theme Builder theme:

The fonts in Thrive Theme Builder can be customized from the "Typography" section of the left sidebar:

You can read more about setting up the typography in Thrive Theme Builder in this article.

Edit landing page typography

However, if you want this landing page to have a different typography than the rest of your site, you should leave this option toggled off and edit the landing page typography using the next option:

This will open the landing page typography settings, from where you'll be able to change the font/color of each heading/hyperlink and other elements:

When you're done, click on "Close" to return to the Thrive Architect landing page editor:

This is how to use the Style Editor for Thrive Landing Pages.

I hope this article is useful to you. Don't forget to check out our knowledge base for more information about Thrive Suite plugins πŸ˜„

Did this answer your question?