The Avada theme provides a slider option in post edit pages, which allows you to insert a slider that you have previously created. However, this functionality is limited, as you can only insert a slider with predefined settings, and would not be able to customize a slider based on the current post. The Avada slider option is disabled by default by Toolset integration; therefore, the settings are not applied on the front-end.

Avada slider option is disabled by Toolset integration
Avada slider option is disabled by Toolset integration

Alternatively, you can build a fully customizable slider with Toolset Views and insert it in your Layouts. Among other features, you can create a slider that can automatically fetch and display data and custom fields related to the current post.

If this is the first time you are creating a slider with Toolset, you might want to review the guide for showcasing content with sliders.

To demonstrate a more complex example, let us assume that you have a Writer custom post type, which is the parent to the Book custom post type. In the writer’s page, you will need to display a slider with books, containing images, titles, prices, and purchase links. In this case, the price and purchase URL are custom fields attached to the Book custom post type.

Getting Started

In order to create a slider using Toolset, you will need to install and activate the following:

  • Avada theme
  • Toolset Layouts
  • Toolset Avada Integration
  • Toolset Views
  • Toolset Types (not required but recommended, as you can create and display custom fields in your slider)

Creating the Views Slider Cell

The first step is to create a Views cell in your Layout, which will display results as a slider.

Create a new cell Select Views cell type Option to display results as a slider
Create a new cell Select Views cell type Option to display results as a slider 

This cell option will enable automatic AJAX pagination, in order to perform a transition between the results in a specific time interval. In this example, the slider will display one item per page for five seconds.

Automatic AJAX pagination settings
Automatic AJAX pagination settings

Your final objective is to display the books that are children to the current writer. For this, you should check Book in content selection and create a filter to display only those that are children to the post where the View is included.

Book custom post type in content selection Post relationship filter to display only children of the current post
 Book custom post type in content selection  Post relationship filter to display only children of the current post

In the loop output section of the View you should include the book information that you want to display in the slider. You can use the Loop Wizard to easily insert the featured image, the title, the book price, and a link to the purchase URL.

Loop Output Wizard
Loop Output Wizard

Displaying the Slider on the Front-end

When you are done with the Views settings, you can save and close the cell. A new Views cell will have been created inside your Layout. The final step is to assign the Layout to Writer single pages and view a writer’s page on the frontend.

The slider cell inside the Layout How the slider is displayed on the front-end
The slider cell inside the Layout How the slider is displayed on the front-end 

If everything is set up properly, you should see a slider rotating between the writer’s books, while displaying the relevant information for each book.