The built-in Text Editor is a tool for adding and editing text, adding Global Data tags, HTML heading tags (h1, h2, etc.), adding tables and changing text styling. The Text Editor appears at the top of your website whenever you edit text in a Text module and within the various features in the Editor.
From the Text Editor's Design dropdown you can add different predefined text styles to paragraphs of texts, helping you quickly style your text and keep a consistent design. The Design dropdown contains eight dark and eight light predefined text styles. Add a design to your text by first highlighting your text, then clicking on the arrow next to Design and selecting the preferred text style from the dropdown list. You have the following eight predefined text styles, both in light and dark:
- Spot text
- Small spot text
- Small subtitle
- Body text
- Small text
You can modify the predefined styling of these text styles in Global Styling. Read this article to learn more about working with text styles. Note that all predefined text styles by default inherit the same font family to maintain consistency throughout your website.
Change font family for your entire website
Font family is a crucial design choice as it impacts the layout for your entire website. You change the font family for your whole website in Global Design > Global texts > General text > select your preferred font family.
Text editing features
You can modify your paragraph by making use of the Text Editor's wide range of editing features.
- Emphasis: call attention to your text by using emphasis elements such as bold, italic and underline.
- Change color: change color of your text by either using the color picker or manually adding a specific color code (hex).
- Alignment: change the positioning of your text by using left, right, centre align or justify.
- Add icon: add an icon to your paragraph. Click on the star icon, select the desired icon from the list and click Insert.
- Table: add a table to your text in order to structure your content
- Lists: the text editor gives you two list options: a numbered and a bulleted list. You create a list in your text by clicking on the icon of your preferred type of list.
- Font and spacing: in the secondary bar of the Text Editor you can change font family, font size, letter spacing, paragraph height and font weight. Click the arrows to expand the specific styling options.
Add and remove links
Add a link to your text by clicking on the paper clip icon in the Text Editor. Click on Link to open the link interface where you add/change and set the behavior of your link. You can link to an external URL, an internal page, an email or a file for download. Select the preferred link type from the dropdown.
Enabling the option Open link in new tab will open your linked content in a new browser tab when clicked. Activate Set 'nofollow' property if you don't want search engines to follow the hyperlink. When this setting is enabled, your link will not affect the target's search engine ranking.
Remove a link from your text by highlighting the linked text, click the paper clip icon and selecting Unlink.
HTML heading tags
The heading tag feature gives you the opportunity to help search engines read and prioritize text included on your website. The H tags range from H1-H6 and indicate the importance and type of your content. H1 indicates your main heading, H2 your sub-headings, etc. P indicates that the text is a paragraph. Use H1-H6 for different types of headings and P for all body text on your website.
How to use H tags
Using H tags on your website helps search engines prioritize your content if you've used the tags correctly. H tags are a text ranking feature where H1 defines the most important heading and H6 defines the least important heading on your page. The general rule is that you should only use one H1 tag on a page, usually applied to the largest headline. You can include several H2-H6 tags on your page, but remember that the tags still indicate the importance of the content. Please note that these rules apply on a page level and not your entire website which means that you can - and it's recommended to do so - include one H1 tag per page on your website.
Include Global Data in text
Using Global Data tags in your text is a helpful and important way to ensure that your business information is correctly and consistently applied throughout paragraphs of text on your website. To add a piece of Global Data, such as your company name or address, to your paragraph, click on the globe icon on the Text Editor, select Insert and an overlay will appear. Click on the Add Global Data dropdown to select the Global Data item you want to include. Click on Insert to add the content to your text.
Global Data behavior
Using Global Data is the best way of adding business-specific content to your website as it's easy and quick to change. When using a Global Data item in the Text module, the content will automatically change once you update your business information in Global Data. This means that you only ever need to change your information in one place. Read more about Global Data tags here.
Add a table
Using a table is a good way of providing visitors a structured overview of information, such as the services you provide, price lists, etc.
Add new table: add a new table by clicking on the table icon in the Text Editor and select the amount of cells you want in your table.
Click on the table to add elements or edit the table.
- Table properties: click on the first icon in the table overlay to open the table properties. Here you're able to change the design of your table such as spacing, border and width/height.
- Delete table: click on the second icon in the table overlay to delete your table. You can also delete your table by highlighting it and pressing delete on your keyboard.
- Insert row before or after: click on the two icons with a plus icon positioned horizontally (third and fourth icon) to add an extra row. You have two options when adding a new row - to add it before or after the row your cursor is currently positioned within.
- Delete row: click on the icon with an x on top of horizontal lines (fifth icon) to delete the row your cursor is currently positioned within.
- Insert column before or after: click on the two icons with the plus icon positioned vertically (sixth and seventh icon) to add an extra column. You have two options when adding a new column - to add it before or after the column your cursor is currently positioned within.
- Delete column: click on the icon with an x on top of vertical lines (eighth icon) to delete the column your cursor is currently positioned within.
Remove, undo and redo styling
Remove all local styling (styling added to the text in the Text module) by clicking on the eraser icon. By doing this, your text will be stripped of all custom styling and revert back to your default text styling (set in Global Design > Global texts > General text).
Undo and redo your latest actions by clicking on the undo and redo icons located at the far right of the Text Editor. You can undo and redo back to the first edit of your text in a specific Text module.