Featured Images Slider Element
As part of Avada Layouts, we have created a series of Dynamic Elements that help generate content in the Content Layout Section of a Layout. These are called Layout Elements. In this document, we are looking at the Featured Images Slider Element.
How To Use The Featured Images Slider Element
The Featured Images Slider Element allows you to place featured images (either single, or if multiple, in a slider) anywhere in a Content Layout Section, in any Layout.
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 Featured Images Slider Element. These dynamic Elements can only be placed once into a Layout, with the exception of the Pagination Element, which can be placed twice. You can also use the full range of Design Elements when building your Layout.
The Featured Images Slider Element can be placed anywhere in you Layout Section, and will dynamically pull any connected Featured Image, or images, into the page, based on the settings in the Element, and the Conditions set in the Layout. For example, you might choose a certain size and hover effect in the Featured Images Slider Element, and set the condition for the Layout only to display on Single Posts.
See below for an example of the Featured Images Slider Element added to the Single Post Layout, on the Taxi Demo.
Element Options
Location: The edit screen within each Element.
You can deploy the Layout Elements only once within each Layout. Within each of the Elements, you will see a tab or tabs that house an array of options that make it possible for you to configure each Element independently, and greatly enhance your flexibility and creative options.
Note: Please note that the displayed options 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 Tab
Show First Featured Image – Turn on if you don’t want to display first featured image.
Hover Type – Select the hover effect type. Choose from Zoom in, Zoom Out, or Lift Up.
Image Size Dimensions – Dimensions in percentage (%) or pixels (px).
Element Visibility – Allows you to control the Element’s visibility. Choose one or more between Small Screen, Medium Screen, or Large Screen.
CSS Class – Allows you to add a class for the Element.
CSS ID – Allows you to add an ID for the Element.
Global Options
Layout Elements do not have any Global Options.
