Styling text

FROONT text editor supports all available Google and Typekit web fonts as you can enter your own font stack. It also supports text styles (Heading 1-6, Paragraph, Blockquote) that allow to keep your typography consistent.

Text links

To add hyperlinks to an existing text:

1. Select the text you want to become a link
2. Select Link icon button

3. Type in the address and pres OK

Text properties

To edit the text simply select the text box and double-click on it. A properties bar will appear on top of it.

Text properties

Normal – Adds normal tag
Paragraph – Adds paragraph tag
H1 – Adds H1 tag
H2 – Adds H2 tag
H3 – Adds H3 tag
H4 – Adds H4 tag
H5 – Adds H5 tag
H6 – Adds H6 tag
Blockquote – Adds blockquote tag


B – Bold
I – Italic
U – Underline
Ix – Remove formating
chain – Hyperlink
– Edit html
Lorem – Adds lorem ipsum text

For advanced properties go to Widget Properties Panel/Typography tab

Responsive Navigation

To add a navigation:

1. Select Add Content Library/Ready-made/Navigation and drag one of the widgets into your project.

ScrSht 2015-01-14 at 17.29.29
2. You can type in your own section names by double-clicking on the texts.

your own section names
3. You might want to add or delete sections. To do that go to Widget Properties Panel and find Navigation tab.
To Add press Add Menu Item button:
To remove an item press Delete Item:


And check out how it looks like in Mobile view:

To change the alignment for menu items, select the navigation widget and in Widget Properties panel/Advanced/Text-align select right, centre or left:



This video tutorial will provide you with information about adding html widget and formatting text in html input field. You’ll learn the following things:

  • Creating an html widget;
  • Formatting text in html;
  • Creating a form in html.

Library objects

This video tutorial will provide you with information about adding and accessing library objects. You’ll learn the following things:

Accessing objects from Library;
Adding objects to private Library;
Formatting objects from Library.

Adding text

To add a Text Widget:

1. Select Add Content Library/Basics/Text

2. Drag Text widget placeholder into your project

To edit – double-click on the text placeholder

edit text