Changing the settings for Genesis Reponsive Slider to allow multiple slideshows

Out of the box, the Genesis Responsive Slider can only be used in one way on your site because it’s options are set in an options panel. However, you can hook in to every setting, to create different sliders on different pages (although this code will not allow you to have different sized slideshows on every page – we’ll cover that in a future post).

I hook to the ‘wp’ action, because that is late enough for you to be able to calculate what slideshow parameters you may want, but early enough that the slideshow won’t have been generated yet. The parameters are changed by filtering genesis_pre_get_option_*, and a very useful PHP function called create_function.

add_action ('wp', 'emw_change_slide_show');

function emw_change_slide_show() {
	$slide_show_vars = array(
		'slideshow_timer' => 8000,
		'slideshow_delay' => 1500,
		'slideshow_arrows' => 1,
		'slideshow_pager' => 0,
		'slideshow_loop' => 1,
		'slideshow_height' => 250,
		'slideshow_width' => 978,
		'slideshow_effect' => 'fade',
		'slideshow_title_show' => 1,
		'slideshow_excerpt_show' => 0,
		'slideshow_excerpt_width' => 30,
		'location_vertical' => 'bottom',
		'location_horizontal' => 'right',
		'slideshow_hide_mobile' => 1,
		'include_exclude' => 'include',
		'post_type' => 'page',
		'post_id' => '4, 7, 9'
	);
	foreach ($slide_show_vars as $option => $value)
		add_filter ("genesis_pre_get_option_{$option}", create_function ('', "return '{$value}';"));
}

If you want to change the size of the slideshow, as we’ve done for this example, you’ll need a few additional lines (and you’ll need to re-generate WordPress thumbnails after you’ve made the change). Although the code on this page allows you to change the size of the slideshow from the default, you’ll need to have the same size on every page:

add_action ('wp', 'emw_change_slider_image_size');

function emw_change_slider_image_size() {
    add_image_size ('slider', 978, 250, true);
}

Finally, if you want to remove the Responsive Slider menu from the admin (because those settings are now overridden):

add_action ('init', 'emw_remove_responsive_slider_menu');

function emw_remove_responsive_slider_menu() {
	if (is_admin())
		remove_action('admin_menu', 'genesis_responsive_slider_settings_init', 15);
}

Comments

  1. Dan Kitchen says:

    Sorry if this is a dumb question but where in my genesis theme do I implement this then add a slider to a page?

    thanks
    -Dan

    • Mark Barnes says:

      Hi Dan,
      Most of the code snippets on this site assume some coding knowledge, particularly this one. You could paste this code in your functions.php, but you’d need to write additional code to specify under what circumstances to use the different settings.

  2. Am lost between the Genesis Responsive slider and Genesis slider; what are the pros and cons of each?

    • Mark Barnes says:

      The responsive slider will reduce in size on small browser windows (e.g. mobile devices). It also has the disc navigation, but lacks some of the effects that the normal slider has.

  3. Are you able to add different images for each each different slider? Ie. On the “About Us” page I might have a slideshow of the staff. On the “Services” page I might have a slideshow of different tools and objects.

  4. Hi Mark, Thanks for the code. I’m wondering if you have had any luck using this for posts in specific categories rather than pages. I’ve tried using cat_ID, term_ID, and tag_ID and that seems to be the only part of the code that is being ignored. Any thoughts?

    • Mark Barnes says:

      You need to filter ‘posts_term’. You can look in the HTML of wp-admin/admin.php?page=genesis_responsive_slider to find out what string you need to show a particular category or tag. It will be either something like “category_name,wordpress-snippets” or “tag,wp_scripts”.

  5. We have an instance of Genesis Slider that isn’t working correctly. We’ve uninstalled and reinstalled the plugin, but when we do, the old setting reappear. Where are these settings stored? We’d like to completely start fresh.

    • Karen I’m having this same problem… did you have any luck resolving it?

      • Honestly, I don’t remember if we resolved it or not! I did find out that the setting are stored in the mySql database…somewhere. I know that’s not much help, but maybe it will point you in the right direction.

      • Mark Barnes says:

        There is a big “Reset Settings” button at the top and bottom of the Slider settings screen. Failing that, use PHPMyAdmin to delete `genesis_responsive_slider_settings` from `wp_options`.

  6. Stacy Vlasits says:

    I found this excellent and very useful code and borrowed it after adapting it in (what I think is) an interesting way.

    Basically, this code lets you use the slider settings menu to control all of the main settings of the sub-sliders together. But it uses the base url of the page your slider is on generate a post-type category (say, ‘about-slider’, ‘home-slider’, ‘products-slider’) for that page. Then you create a matching category and assign it to the posts that you want to be in each slider.

    In functions.php (NOTE: that I left all the rest of the options unset) :
    add_action (‘wp’, ‘sgv_custom_slide_show’);

    function sgv_custom_slide_show() {
    if(is_home()){
    $category_prefix = ”; // in my case I assigned the “slider” category to posts I wanted on the home page
    } else {
    $category_prefix = basename(get_permalink()).’-‘ ; // this results in ‘about-‘ for a page called “about”
    }
    $my_posts_term = ‘category_name,’.$category_prefix.’slider'; //this is the format the genesis slider is expecting
    $slide_show_vars = array(
    ‘post_type’ => ‘post’,
    ‘posts_term’ => $my_posts_term
    );
    foreach ($slide_show_vars as $option => $value)
    add_filter (“genesis_pre_get_option_{$option}”, create_function (”, “return ‘{$value}';”));
    }

  7. Mark, of course, pasting your code into the child theme’s function.php file works great. But what needs to be added/modified in order that one could apply the same technique to individual page TEMPLATES files to change some of the variables?

    It seems as though…I should be able to specify “include,” “page,” and the “page ID’s” as the only variables….and on each template, drop in your function onto each with just these modifications to the responsive slider’s settings. I could even specify only the “page ID” as the lone setting, since all else will remain the same between templates.

    But it did NOT work. Can you offer a suggestion on why, and better yet, HOW to implement what is a GREAT idea you have had?

    Thanks for some much needed help.

  8. Hey Mark,

    Great post, thanks for sharing! Have you ever tried to separate the post title and the featured image on the slider? Ie is there a way to remove the title/content from inside the image window to be below?

    Thanks

  9. I’m having trouble finding an answer to this, but the slider uses h1 tags for the visible titles of each slide. I don’t want it using h1’s. Is there a way to change that so that it just uses h3 or no header tag at all? Thanks.

    • Mark Barnes says:

      The responsive slider uses the h2 tag, not h1. However, there’s no filter that allows you to easily change it. It would be possible to buffer the PHP output then use str_replace on the resulting string, but to be honest it’s probably easier just use CSS to ensure that your headings are not taking any unnecessary styling from elsewhere.

Speak Your Mind

*