How to replace Big Title section with an image slider in Zerif

Replacing Big Title section of the theme with a slider plugin doesn't take much time. It's pretty easy and follow below steps to accomplish that in few minutes. And as we always recommend to everyone, please make sure that you're using a child theme with your Zerif theme.

First edit the style.css file of your child theme, and add the following CSS to it:

@media screen and (max-width:1023px) {
    .home-header-slider {
     padding-top: 111px;
    }
    }
    @media screen and (max-width:767px) {
    .home-header-slider {
     padding-top: 0px;
    }
    }
     @media screen and (min-width:1024px) {
    .home-header-slider {
     padding-top: 76px;
    }
}

Now install Nivo Slider to your WordPress. Visit Nivo Slider menu, in your WordPress dashboard, and create a new slider. After creating and saving your slider, copy the slider shortcode:

Now. in your child theme, copy the /sections/big_title.php file of your parent theme. Open the big_title.php file of your child theme and replace all the code with the following:

<div class="home-header-slider">
<?php nivo_slider( 1 ); ?>
</div>

Don't forget to replace the nivo_slider( 1 ) in above code with your slider shortcode. Save it, and enjoy the slider.

That's all!

For the Spanish version of the documentation you can check this out: ¿CÓMO REEMPLAZAR LA SECCIÓN DE TÍTULO GRANDE CON UN SLIDER?