Content Element

Last Update: September 1, 2025

The Avada Content Element is used to display the main body content of a WordPress post or page when building a custom layout using Avada. This Element is essential when building custom Avada website templates, as it ensures that the content is always included and styled consistently.

Watch the video below for a visual overview of the Element, view the Avada Content Element page for live examples, and read on to see the complete list of options.

For privacy reasons YouTube needs your permission to be loaded.
View Element Page!
View Avada Builder Elements!

How To Use The Content Element

When you go to add an Element in a Content Layout Section, the Element dialog opens in a new tab called Layout Elements. This is where you will find the Content Element. These dynamic Elements can only be placed once into a Layout, except the Avada Pagination Element, which can be placed twice.

The Avada Content Element pretty much does what it says on the can, and allows you to add existing content anywhere in a Content Layout Section in any Layout. You would use this, for example, on a single post or single portfolio layout, where the content element would pull the actual post content into your design.

Basically, the element grabs the editor content of a page or post, and you can add this content to the Content Layout Section of your Layout. You can also add the Content Element into an Avada Post Card.

Element Options

Note: The displayed option screens below show ALL the available options for the element. If you have Avada’s Option Network Dependencies turned on, you will only see options relevant to your selections, and so the options screen may look somewhat different.

General

HeadingDescription
Content DisplayControls if the blog post content is displayed as excerpt, full content or is completely disabled.
Excerpt LengthControls the number of words in the excerpts.
Strip HTML From Post ContentChoose to strip HTML from the post content.
DropcapSet the first letter of first paragraph as a dropcap.
Element VisibilityChoose to show or hide the element on small, medium or large screens. You can choose more than one at a time.
CSS ClassAdd a class to the wrapping HTML element.
CSS IDAdd an ID to the wrapping HTML element.

Design

HeadingDescription
MarginIn pixels or percentage, ex: 10px or 10%.
AlignmentSelect the text alignment.
TypographyControls the title text typography. Leave empty if the global typography for the corresponding heading size (h1-h6) should be used: Global Options Body Typography Settings.
Boxed DropcapChoose to get a boxed dropcap.
Dropcap Border RadiusChoose the radius of the boxed dropcap. In pixels (px), ex: 1px, or "round".
Dropcap ColorControls the color of the dropcap. Leave blank for Global Options selection.
Dropcap Text ColorControls the color of the dropcap letter when using a box. Leave blank for Global Options selection.

Extras

HeadingDescription
Animation TypeSelect the type of animation to use on the element.
Direction of AnimationSelect the incoming direction for the animation.
Animation ColorSelect the color of the animation
Speed of AnimationType in speed of animation in seconds (0.1 - 5).
Animation DelaySelect the delay time after the animation starts(0 - 5).
Offset of AnimationControls when the animation should start.

In this article