How To Use The Layout Section Elements

23/07/2020

Layout Section Elements are special, dynamic Elements that are found in Avada Builder, but only when editing Content Layout Sections through the Avada Theme Builder. Currently, there are eight of these Elements, which can be used to dynamically populate the Content Layout Sections of your Custom Layouts.

These Elements can only be used once in a Layout, with the exception of the Pagination Element. Read on to learn how to use the Layout Section Elements in Avada, and watch the video for a visual overview.

IMPORTANT NOTE: Layout Section Elements are ONLY available when editing Content Layout Sections in the Avada Theme Builder.

Archives

The Archives Element is for designing your layout for archives content, like blog or portfolio archives. It has a General and a Design tab, and is very similar to the Blog Element. This Element will then display archives, depending on the conditions set in the Layout, for example, if you set the All Archives condition, it will apply to all archives.

Archives Element
See The Archives Element Doc!

Author

The next Element is Author. This has a General and an Extras tab, and a range of simple options. You would only use this Element with a type of content that has a single author, like a Single Post Layout. If you added the Author Element to an Archive Layout for example, it wouldn’t show anything, as there can be many authors on a blog. But on a Blog Single Post layout, the author element is very useful, and pulls the details from the post author’s bio and displays them. You can see an example of this Element on the Taxi Demo blog posts.

Author Element
See The Author Element Doc!

Comments

Then, there is the Comments Element. This Element pulls comments from any single post type with commenting enabled. Commenting is typically only enabled on blog posts, but it can be enabled on any single post type, such as portfolios, FAQs and even pages. Again, it has a General and an Extras tab, with a range of styling options.

Comments Element
See The Comments Element Doc!

Content

Following this is the Content Element. This pulls the main content from any single post. This could be a blog post, a portfolio item, a page, or any other Custom Post Type single post. It wouldn’t be used on anything dynamically generated, like an Archives, or 404 or Search Results Layout. It only has a few options around margins and visibility, and of course the element animation options under the Extras tab.

Content Element
See The Content Element Doc!

Featured Images Slider

Featured Images Slider is the next Element, and this will pull the Featured Image, or multiple Featured Images and display them in a Slider, from any custom post type they are on. These would normally be blog single posts or portfolio posts, but also FAQ items and even single pages. There are a few options around the image hover type and size, and you can control margins as well.

Featured Images Slider Element
See The Featured Images Slider Element Doc!

Meta

The Meta Element is a specific single post layout element, designed to add customized meta information anywhere in a Content Layout Section, in any Single Post, Page or Portfolio Layout. You can disable or enable any of the meta components, including a new one, Modified Date, which shows the most recent date the post has been modified.

Meta Element
See The Meta Element Doc!

The Pagination Element is unique, in that it can be used twice on a page, to facilitate the common layout of having pagination at both the top and the bottom of post content. It has a range of styling options under the general tab, and element animation under the extras tab.

Pagination Element
See The Pagination Element Doc!

Project Details

The Project Details Element will only show on a portfolio single post layout. It’s the Portfolio details that we would normally see down the right-hand side of a portfolio item, like Skills and Categories, and URL etc.

Project Details Element
See The Project Details Element Doc!

Related Posts is the last Layout Section Element, and this will work with all single posts, and show related posts to the currently viewed post. It has three tabs, General, Design and Extras, and a reasonably large range of options for configuration and styling.

Related Posts Element
See The Related Posts Element Doc!