Great copy is key to building landing pages that convert. Lucky for you, text is super easy to edit and customize in the Unbounce Classic Builder.
This article describes how to add & edit text in the Unbounce Classic Builder, including how to resize it, update fonts, add hyperlinks & style, and more.
- Using Google Fonts on Your Landing Page
- Using Adobe Typekit Fonts on Your Landing Page
- Using Custom Bespoke Fonts and @font-face
- Remove the Underline From Text Links
To add a new text block to your landing page, drag and drop the Text widget to the area of the page where you’d like to add your text block. You’ll get a new text block on your page, which you can edit further.
You can use multiple text blocks on a single landing page and move them on the page as you’d like.
Using the Inline Text Editor
There are 2 tabs that you can use to edit Inline Text:
- The Style Editor Tab
The Action Editor Tab
Editing Text with the Style Editor
- Use the drop-down menu to change your text style for different heading sizes, paragraphs, or quotes.
- The FONT section provides options for font family, size, text, and highlight colors, as well as changing the style of your font.
- The PARAGRAPH section allows for editing the alignment and line-height of your text block and adding numbered, bulleted or indented styles.
Editing Text & Hyperlinks with the Action Editor
- The TEXT LINK section allows you to add links to your text block. Highlight the text that you'd like to add a link to, then do the following:
- Enter your URL in the URL form field.
- The Target drop-down menu lets you choose where you’d like the link to open (in the same window, or in a different frame or window).
- The DYNAMIC TEXT REPLACEMENT section lets you personalize your landing page URLs to match specific keyword search parameters. Click the Dynamic Text button to open the Dynamic Text Replacement dialog box. Want to learn more? Check out Working with Dynamic Text Replacement to get more out of your campaigns.
- The SOURCE CODE section allows you to directly change the HTML code for the text block to apply any specific scripts that you may want to add to give some flair to your text.
You can also view a text element’s source code by double-clicking on the element and selecting the </> View Source button at the bottom left-hand corner of the element.
You'll notice a blue line under the hyperlinked text, indicating that this is a link. Check out the following article to remove the underline from your text links.
Updating the Default Text Styles
You also can set up default text colors at the page-level. To to do, follow these steps:
- Navigate to the Page Properties tab on the right-hand side of the builder.
- Within the Default Text Style tab, update the default Text & Link colors.
- Save & publish/republish your page!
To increase Builder security and prevent unwanted malicious scripts, any added HTML tags that are unsupported will be automatically stripped out by the Inline Text Editor. Please see below for a comprehensive list of allowed and disallowed tags: