Typography, or font combinations, refers to the formatting options applied to text to convey a brand’s message in a visual manner, such as font colors, sizes, styles, line spacing, and more!
You can update the typography of texts (headings, paragraphs, etc.), buttons, links, and your form attributes.
In Smart Builder, you can change the typography and colors across the entire page via the Style Guide.
Or, you can edit the typography for a particular section only, without changing the typography of other sections.
Updating Typography Across Entire Page (Global Edits)
Updating Typography for Elements Only
Updating Typography Across Entire Page
Gone are the days of editing all headings or texts one by one. Use the Style Guide to edit your page’s typography.
- Log in to Unbounce and launch your page in Smart Builder.
- Navigate to the Style Guide
within the left-hand side menu. - Update the text styles for all headings, paragraphs, buttons, or links. This includes font weight, size, color, line height, and letter-spacing:
These styles will apply across all alike text styles on the page. For example, adding a blue font color under the Heading 1 tab will update all text on the page formatted with Heading 1 to be blue. -
Toggle the drop-down arrow
button to the right of the heading, paragraph, or button tab to hide or show the formatting options. -
Click the blue Save at the top-right-hand corner when you’re happy with these changes.
Updating Typography for Elements Only
Follow these steps to update the typography and text styles for certain sections only.
This will apply the typography edits to that section or element only, not the entire landing page.
- Double-click an element within a section, such as a heading, paragraph, or button.
- Click the pen icon
to launch the Design Settings. - Update the typography or styling for that specific section only:
Updating the typography within a particular section will not change or update the typography across the entire page. - When you’re happy with these changes, click the
icon at the top corner to close the Design Settings, and be sure to Save your page.
You're all set! See our documentation for more insight into editing & updating text in Smart Builder.
Add Section-level Edits to the Style Guide
If you'd like to apply section-level edits to the entire page, navigate to the Design Settings, and click Yes to Add to your Style Guide:
Glossary
Typography: Formatting options applied to text on a page that corresponds to your brand visually, such as fonts, font sizes, colors, line spacing, font formatting, and more.
Working with Brand Colors and Fonts
To make editing your pages easier, we've introduced brand colors and fonts, allowing you to add consistent design elements across all your pages in Smart Builder.
Learn more in this article: Managing Brand Fonts and Colors in Smart Builder.
Related Articles
Working with Section Templates
Editing the Mobile Version of your Landing Page in Smart Builder