In this Quick Tip, we're going to learn about the text element.

The text element is one of the primary elements used in building your app. When you draw a text element on the page, you can make things like call-to-actions, one-liners, or descriptions.

But what really makes the text element special is that we can use it to display dynamic data. For example, if we wanted to display the current user's email, we can simply build that expression using the Insert Dynamic Data dropdown menu right into the text element.

As long as the end result of the expression evaluates to text, we won't get any issues. When we preview, our text displays the result of this dynamic text.

We can style the text however we'd like and even use it to trigger a workflow.

The text element has other special properties, like Cut off content if the element is not tall enough. With this checked, the text will truncate if the text element is too small for the contents of the text, and instead show an ellipsis — versus each word wrapping line over line if Cut off content isn't checked.

You can Shrink the element height if the text gets shorter. To demonstrate this, we'll put a border around the text element. If we change the font size conditionally and the font size becomes smaller than the original, then because this is set, the element height will automatically adjust with it.

What's more, if we have a text element that starts out invisible and this is checked, the height will be set to zero — which can help create more space as you design.

The text element also offers the ability to recognize links and emails, which will allow you to type in a URL or email address directly as text, and subsequently color it as a clickable link.

When we preview, we can see that the text element automatically knows what to look for and will send the user to the website or to a mailing client.

Finally, if you need it, you can expose the HTML tag for this text. This property is solely used for search engine optimization — like, for example, an H2 and H3 tag may be found easily from a search engine. So you would declare that on a page title or description.

That's it for this Quick Tip. For more, be sure to check out bubble.io/academy.