How to use Text in TeleportHQ

Text is the most fundamental element in the editor. Here is everything you need to know about typography elements in TeleportHQ.

Text types
Adding text to the project
Customizing text
HTML text tags
Creating text tokens
Adding links to text

Text types

In the Elements Tab in the Left Panel you will find the typography section. There are 3 types of text that you can add to the canvas:

Text - Adding this element, it will add a regular paragraph to your project
Heading - This will add an H1 element
Link - This will add a paragraph with hyperlink

Adding text to the project

Text is added with drag and drop. You can drop any type of text element directly in the canvas or in a container in the treeview. Double click on the text to write your own text or paste a copied piece of text.

TIP: Use keyboard shortcuts to add text elements quicker. Try T for text and H for heading.

Customizing text

To make changes to your text elements you can click on the text in the canvas then go to the Right panel and scroll down until you see Test style. Here you can change the font family, font size, line height, letter spacing and more.

HTML Text tags

You can also change the HTML tag of your text so that it provides the semantic value that you intended in the first place. You can change the HTML tag to: paragraph, heading, span, label and more..

Creating text tokens

Text tokens will allow you to predefine different styles for your text elements. This is most useful for projects that use multiple fonts and sizes. Create the tokens when you start the project and use them from the Text styles tab in the Right Panel.

Adding links to text

To add links to text already placed on the canvas you need to:

Double click on the text element
Select the section of text you want to link to
Right click on the section
Select Create link

Updated on: 14/02/2023