MEET SITKA | A super-customizable modern WP theme!

Okay
  Print

Add a timer to Laurel's slider

Please note: This FAQ article is specifically for the Laurel theme.


To add a timer to Laurel's featured area slider in order to make the slides rotate automatically, we can make a slight adjustment to the theme's code.

First, we like to recommend installing a code editor plugin such as WPide in order to not only access the necessary theme file, but to also provide line numbers within the theme file itself. This makes following the below instructions much more easy.

Once you've installed WPide, you can navigate to  WP Dashboard > WPide > themes > laurel > "js" folder > and open up "solopine.js".  

Between Lines 31 - 45, you should see this block of code for the slider:

// BXslider
    
    $('#featured-area .bxslider, .fullimage-gallery .bxslider').bxSlider({
        adaptiveHeight: true,
        mode: 'fade',
        pager: false,
        /*auto: ($(".bxslider div.slide-item").length > 1) ? true: false,*/
        auto: false,
        pause: 7000,
        nextText: '<i class="fa fa-angle-right"></i>',
        prevText: '<i class="fa fa-angle-left"></i>',
        onSliderLoad: function(){
            $(".sideslides").css("visibility", "visible");
        }
   });

You can replace that block of code with the following block of code instead:

// BXslider
    
    $('#featured-area .bxslider, .fullimage-gallery .bxslider').bxSlider({
        adaptiveHeight: true,
        mode: 'fade',
        pager: false,
        auto: ($(".bxslider div.slide-item").length > 1) ? true: false,
        pause: 7000,
        nextText: '<i class="fa fa-angle-right"></i>',
        prevText: '<i class="fa fa-angle-left"></i>',
        onSliderLoad: function(){
            $(".sideslides").css("visibility", "visible");
        }
    });

Do you see the bit in the new code that says "pause: 7000"? This tells WordPress how often to switch the slide. It is measured in milliseconds, so a number value of "7000" will change the slide once every 7 seconds.  You're welcome to increase or decrease this number value to whatever speed you prefer.

Please be sure to save changes to the file when finished.  If you have a cache tool operating on your WP or browser, please also clear the cache to see the change.


PLEASE NOTE!

If you have post titles appearing in the Featured Area Slider which fall onto different lines (for example, your post title is so long it appears on 2 lines within the Slider), the content below the Slider will be pushed & pulled up and down as the slider rotates. We highly recommend keeping your Slider post titles all on 1 line or all on 2 lines in order to avoid this.