Slider on every page
-
Hi there, I would like to have the slider appear on every page, not just the front page. How could I accomplish that in the best way? Move the slider code to the header template perhaps?
-
Do not edit the theme itself. First create a child theme for your changes.
Yes, I have created a child theme, so I am not touching the files of the original theme. ?? I tried briefly to move the code that places the slider to the header and removed the condition that prevents it from always displaying. But that seems to break the look of the slider on other pages than the front page… Something seems to be missing..
There seems to be a css-class called slider being added to the body tag on the front page when the slider is enabled. This tag is not added to other page templates. How can i modify the code so that this class is added to all pages?
I have solved this.. topic may be closed.
Hi, well this was some time ago but I’ll try to recall the steps I took. So assuming you have created a child theme, follow these steps:
1. Copy header.php and page.php from the parent themes folder to your child themes folder. Then in your child theme files move this part:
<?php if ( is_front_page() && twentyfourteen_has_featured_posts() ) { // Include the featured content template. get_template_part( 'featured-content' ); } ?>
from page.php to header.php. And make sure you don’t break any HTML in this process.
2. Remove the is_front_page() condition from the if clause above with this result:
<?php if ( twentyfourteen_has_featured_posts() ) { // Include the featured content template. get_template_part( 'featured-content' ); } ?>
3. Now you also need to add the code for the slider functionality on every page. Copy the twentyfourteen_scripts function from the parent themes functions.php and paste it into your own functions.php. Remove the is_front_page() condition from the last if clause. Then do the overriding bit (rename the copy of the function, unload the parent themes function and then load your own renamed functiton instead). It should then look like this:
remove_action( 'wp_enqueue_scripts', 'twentyfourteen_scripts' ); function twentyfourteen_child_scripts() { // Add Lato font, used in the main stylesheet. wp_enqueue_style( 'twentyfourteen-lato', twentyfourteen_font_url(), array(), null ); // Add Genericons font, used in the main stylesheet. wp_enqueue_style( 'genericons', get_template_directory_uri() . '/genericons/genericons.css', array(), '3.0.3' ); // Load our main stylesheet. wp_enqueue_style( 'twentyfourteen-style', get_stylesheet_uri() ); // Load the Internet Explorer specific stylesheet. wp_enqueue_style( 'twentyfourteen-ie', get_template_directory_uri() . '/css/ie.css', array( 'twentyfourteen-style' ), '20131205' ); wp_style_add_data( 'twentyfourteen-ie', 'conditional', 'lt IE 9' ); if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) { wp_enqueue_script( 'comment-reply' ); } if ( is_singular() && wp_attachment_is_image() ) { wp_enqueue_script( 'twentyfourteen-keyboard-image-navigation', get_template_directory_uri() . '/js/keyboard-image-navigation.js', array( 'jquery' ), '20130402' ); } if ( is_active_sidebar( 'sidebar-3' ) ) { wp_enqueue_script( 'jquery-masonry' ); } if ( 'slider' == get_theme_mod( 'featured_content_layout' ) ) { wp_enqueue_script( 'twentyfourteen-slider', get_template_directory_uri() . '/js/slider.js', array( 'jquery' ), '20131205', true ); wp_localize_script( 'twentyfourteen-slider', 'featuredSliderDefaults', array( 'prevText' => __( 'Previous', 'twentyfourteen' ), 'nextText' => __( 'Next', 'twentyfourteen' ) ) ); } wp_enqueue_script( 'twentyfourteen-script', get_template_directory_uri() . '/js/functions.js', array( 'jquery' ), '20140616', true ); } add_action( 'wp_enqueue_scripts', 'twentyfourteen_child_scripts' );
4. Now the ‘slider’ css class needs to be added to all pages as well. Do this by overriding the function twentyfourteen_body_classes… Copy the whole function from the parent themes functions.php to your own functions.php and remove the is_front_page() condition from the last if clause of the function, and then do the overriding bit. Result should look like this:
remove_filter( 'body_class', 'twentyfourteen_body_classes' ); function twentyfourteen_child_body_classes( $classes ) { if ( is_multi_author() ) { $classes[] = 'group-blog'; } if ( get_header_image() ) { $classes[] = 'header-image'; } elseif ( ! in_array( $GLOBALS['pagenow'], array( 'wp-activate.php', 'wp-signup.php' ) ) ) { $classes[] = 'masthead-fixed'; } if ( is_archive() || is_search() || is_home() ) { $classes[] = 'list-view'; } if ( ( ! is_active_sidebar( 'sidebar-2' ) ) || is_page_template( 'page-templates/full-width.php' ) || is_page_template( 'page-templates/contributors.php' ) || is_attachment() ) { $classes[] = 'full-width'; } if ( is_active_sidebar( 'sidebar-3' ) ) { $classes[] = 'footer-widgets'; } if ( is_singular() && ! is_front_page() ) { $classes[] = 'singular'; } if ( 'slider' == get_theme_mod( 'featured_content_layout' ) ) { $classes[] = 'slider'; } elseif ( is_front_page() ) { $classes[] = 'grid'; } return $classes; } add_filter( 'body_class', 'twentyfourteen_child_body_classes' );
I think that should be it… But I could have forgotten something..
Thanks a lot, mepmepmep.
Before contacting you I was playing with the code a day or two, trying to find the right alternative to
if ( is_front_page()
clause, then I gave up.You are a genius.
Thanks again.
Haha.. Hardly a genius. ?? It was a requirement from my boss that I solved this. But I’m glad you found use for this solution too! ??
- The topic ‘Slider on every page’ is closed to new replies.