Inline Elements

Last Update: August 19, 2025

You might notice that some Avada Elements are greyed out when you view them in the Elements window that appears when you add an Element. They are grey to show that they are Inline Elements. These elements are not meant to be used directly on their own, but rather in conjunction with text or other content.

Please read below for links to our various Inline Elements, as well as information on how to insert them in the Avada Builder, and watch the video for a visual overview.

For privacy reasons YouTube needs your permission to be loaded.

Inline Elements

There are currently seven Inline Elements. Please follow the links below to go directly to the individual Inline Element pages to find out more about the specific elements, or read further for a general overview of how to use Inline Elements on the page, through both the Avada Builder and Avada Live.

Inline Elements

How Inline Elements Work

Inline Elements are not meant to be used directly, but rather in conjunction with other content. Let's take a Dropcap as an example. Whenever you use a Dropcap, it has to go along with text or paragraph to fulfill its function. If not, it wouldn't really make sense on the page. With that in mind, you have to insert text content first, then use the Element Generator to add a Dropcap element.

Alternatively, using Avada Live, you can now edit text inline, and as part of the Inline Editing menu that appears when you select some text, there is an Add Element Icon (a plus symbol) where you can access and add the Inline Elements, as well as being able to access the Avada Builder Element Generator when you edit the Element.

Using Inline Elements in Avada

In Avada Live, there are two ways to use the Inline Elements. Firstly, with the Inline Editor, that appears whenever you make a text selection. And secondly, with the Avada Builder Generator, when you edit a relevant Element in the Sidebar. Let's look at both methods.

Using The Inline Editor

  • Step 1 – Make a text selection directly on the page. The inline editor will appear.
  • Step 2 – On the far right, there is a Blue Add Element Icon. This opens a list of the inline Elements. Select the one you wish to apply. It will be based on your text selection, so if you want a Dropcap, select the first letter of the word, whereas if you wish to have a Tooltip, you might select a word or an entire sentence.

  • Step 3 – Set your preferred options in the Element Settings that opens in the Sidebar. The changes are applied as you make them.

  • Step 4 – That's it. If you want to save the changes, click the large blue Save button on the Toolbar.

Inline Editor > Inline Elements

Using The Avada Builder Element Generator

  • Step 1 – Add any Element that allows for plain text or HTML to be inserted via the WordPress Content Editor. For example, the Text Block Element.
  • Step 2 – Click the 'Settings' icon on the Element to bring up the Element's options panel in the Sidebar.
  • Step 3 – Select the text you want the Inline Element to apply to in the WordPress Editor (not on the page).
  • Step 4 – On the WordPress Editor toolbar, you'll find the Element Generator icon, which looks like the Avada logo. Click the 'Avada Builder Element Generator' icon to bring up the Elements window.
  • Step 5 – On the 'Builder Elements' tab, find the Inline Element you'd like to add. Once located, click on it to bring up the options dialog.
  • Step 6 – Make your changes in the options dialog, and once done, click 'Insert'. You can save the changes by clicking on the blue Save button on the main Toolbar.
Avada Builder Element Generator

Using Inline Elements in the Avada Builder

In the back-end builder, the Inline Elements are designed to be added via the Element Generator within the WordPress Content Editor. Follow this short example to see how.

  • Step 1 – Add any Element that allows for plain text or HTML to be inserted via the WordPress Content Editor. For example, the Text Block Element.
  • Step 2 – Click the 'Settings' icon on the Text Block Element to bring up the Element's options window.

  • Step 3 – Locate the WordPress content editor field. On the toolbar, you'll find the Element Generator icon, which looks like the Avada logo. Click the 'Avada Builder Element Generator' icon to bring up the Elements window.

  • Step 4 – On the 'Builder Elements' tab, find the Inline Element you'd like to add. Once located, click on it to bring up the options window.
  • Step 5 – Once done, click 'Insert'. You can then add content into the Text Block Element as needed. Once you're done, click 'Save' to save your changes.

Content Based Element

In this article