WordPress.org

Ready to get started?Download WordPress

Forums

Adding slider feature to Elegant Themes-Coldstone (4 posts)

  1. ashleykmbooks
    Member
    Posted 1 year ago #

    Hi, I've installed an Elegant Themes, theme called Coldstone to http://coolseasongardening.com/. The theme as created has a featured section on the homepage with five stories, BUT they do not shuffle through, they simply sit stagnant on item #1. I asked Elegant Themes for help adding the correct code to make them shuffle as seen on this example of a Coldstone Theme, http://www.highinfatuation.com/ but their support staff says they can't help as that is a modification to the theme I downloaded.

    So I pulled this code from highinfatuation.com,

    // Modifies the manual carousel with a timer
    $(tabContainers).find('.tabNavigation li:eq(0) a').css('background-color','#000');

    var $featuredBox = $('.feature_wrap'),
    numDivs = tabContainers.length,
    cycleInterval = 4000;

    // Starts/stops carousel timer
    function startTimer() {
    cycleTimer = setInterval(function() {

    var visibleOne = parseInt($(tabContainers).filter(':visible').attr('id').substring(3),10),
    nextOne = visibleOne;

    if (nextOne == numDivs) {
    nextOne = 0;
    }

    $('#tab' + visibleOne + ' .tabNavigation li:eq(' + nextOne + ') a').trigger('click');
    $(tabContainers).find('.tabNavigation li a').css('background-color','transparent');
    $(tabContainers).find('.tabNavigation li:eq(' + nextOne + ') a').css('background-color','#000');

    }, cycleInterval);
    };
    function stopTimer() {
    window.clearInterval(cycleTimer);
    };

    if ($featuredBox.length > 0) {
    startTimer();
    }

    // Start/stop cycle
    $featuredBox.hover(stopTimer, startTimer);

    });

    And I'm not sure where to add it to the php files or css of my theme. I've tried adding it a few places, and it's not working. Can someone help me apply this or a modified version of this in the right place?

    Thanks!

  2. jdhputz
    Member
    Posted 1 year ago #

    I just ran into this issue as well. This code goes in the theme on the scripts.php file. If you add it to the script that is there, or go back to the sample website and copy the entire script, the only thing you need to replace are all the $(...) with jQuery(...). WordPress doesn't allow the shortcut of using $ instead of jQuery. This should solve you problem because I just got it to work on the website I just built.

  3. redefinered
    Member
    Posted 1 year ago #

    Hi ashleykmbooks. Can you help me? I saw your website coolseasongardening.com and saw the featured content section rotating. I'm currently working on a project, http://customadesign.info/onestopgoldandsilver/ right now and the client ask me to rotate the featured content every three second. Can you help me? thanks!

  4. ashleykmbooks
    Member
    Posted 1 year ago #

    Redefinered, to get it to work I added the following to the scripts.php file. A friend who writes java code created this for me, so sorry I can't answer specific questions other than copy and paste that in and you should be ok!

    <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/inc/visionary.js"></script>
    <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/inc/superfish.js"></script>
    <script type="text/javascript">
    jQuery(function() {
    jQuery('ul.superfish').superfish();
    var tabContainers = jQuery('div.tabs > div');

    jQuery('div.tabs ul.tabNavigation a').click(function () {
    tabContainers.hide().filter(this.hash).show();

    jQuery('div.tabs ul.tabNavigation a').removeClass('selected');
    jQuery(this).addClass('selected');

    return false;
    }).filter(':first').click();

    // Modifies the manual carousel with a timer
    jQuery(tabContainers).find('.tabNavigation li:eq(0) a').css('background-color','#000');

    var jQueryfeaturedBox = jQuery('.feature_wrap');
    numDivs = tabContainers.length;
    cycleInterval = 4000;

    // Starts/stops carousel timer
    function startTimer() {
    cycleTimer = setInterval(function() {
    var visibleOne = parseInt(jQuery(tabContainers).filter(':visible').attr('id').substring(3),10);
    nextOne = visibleOne;

    if (nextOne == numDivs) {
    nextOne = 0;
    }

    jQuery('#tab' + visibleOne + ' .tabNavigation li:eq(' + nextOne + ') a').trigger('click');
    jQuery(tabContainers).find('.tabNavigation li a').css('background-color','transparent');
    jQuery(tabContainers).find('.tabNavigation li:eq(' + nextOne + ') a').css('background-color','#000');
    }, cycleInterval);
    };

    function stopTimer() {
    window.clearInterval(cycleTimer);
    };

    if (jQueryfeaturedBox.length > 0) {
    startTimer();
    }

    // Start/stop cycle
    jQueryfeaturedBox.hover(stopTimer, startTimer);
    <?php if (get_option('coldstone_disable_toptier') == 'on') echo('jQuery("ul.nav > li > a > span.sf-sub-indicator").parent().attr("href","#");'); ?>
    });
    </script>

Topic Closed

This topic has been closed to new replies.

About this Topic