Avada theme

This documentation can help you put a slider under the top menu of the Avada theme.

1

Step 1

Go to the FTP of your website and create a child folder:

/wp-content/themes/Avada-Child-Theme/

If you're using the default Child theme Avada comes with, jump to step 3.
2

Step 2

Create a style.css file in this folder:

/wp-content/themes/Avada-Child-Theme/ style.css

and write this code in it:

/*
Theme Name: Avada Child
Template: Avada
*/	
3

Step 3

Create a functions.php file:

/wp-content/themes/Avada-Child-Theme/ functions.php

Write this code in it, just replace the shortcode with your slider's:

<?php
function smart_slider_header(){
    echo do_shortcode('[smartslider3 slider=315]');
}

add_action('avada_before_main_container', 'smart_slider_header');	

You have 3 good places, where you can put the slider:

  • avada_after_header_wrapper
  • avada_header
  • avada_before_main_container

These will put the slider either before the menu, between the menu and the breadcrumbs, or after the breadcrumbs. Replace the avada_before_main_container action with the one you want.

Want to show different sliders on different pages?

Here are a useful PHP functions to do it.

Example:

You want to show slider #1 on your home page and slider #12 on your About us page, which has the ID 1298. You can use a code like this:

<?php
function smart_slider_header(){
    if(is_home() || is_front_page()){
        echo do_shortcode('[smartslider3 slider=1]');
    } else if(get_the_ID()==1298) {
        echo do_shortcode('[smartslider3 slider=12]');
    }
}
add_action('avada_before_main_container', 'smart_slider_header');	
4

Step 4

Activate your child theme.