Add page to Soliloquy featured content slider

My client wants to have a featured content slider on her home page, with two static pages in between the featured post slides. So the slider shows:

• Latest featured post
• Page one
• Second featured post
• Page two
• Third featured post

I decided to use the Soliloquy slider for this task because:

• It’s an awesome slider
• It has a featured content add-on
• It comes with lots of hooks and filters so you can modify the output

I\’ll not go over setting up the slider and the featured content add-on as there is plenty of information on the Soliloquy website but I will go over how I added slides for the pages between the featured content slides.

Inserting static pages into featured content slider

I started with appending custom slides to your slider code from the Soliloquy website. (Please note that currently this tutorial on the Soliloquy website is for the old version of Soliloquy and the hook has changed.)

I added a conditional for appending my page slides to either the end of the first slide or the second slide.

In the jmw_soliloquy_generate_slide_html function, I use the page id to get the featured image URL and the page title to form the page slide HTML, which is then returned.

I have manually identified the id of the slider and the page id of the pages I want to add. I have also assumed that there will be at least 2 slides of featured content. All of which isn\’t ideal but without building an admin page I couldn\’t see another way.

This code goes into your functions.php file.

Update 2014-02-09: Big thanks to Gary Jones for improving the code to what you now see below.

Update 2014-05-7: I\’ve updated this code to work with Soliloquy 2 using the new soliloquy_output_single_item hook.

You can also see the code below on github if you prefer.

add_filter( 'soliloquy_output_single_item', 'jmw_soliloquy_add_custom_slides', 10, 5 );
/** 
 * Filter the Soliloquy slide html to append another slide. Works with version 2 of Soliloquy.
 *
 * @link http://soliloquywp.com/docs/appending-custom-slides-to-your-slider/
 *
 * @param string  $slider_html Existing slide HTML.
 * @param string  $slider_id   ID of the slider.
 * @param array   $image       Array of slide image details.
 * @param array   $data        Array of slider config data.
 * @param integer $slide_id    ID of the slide.
 *
 * @return string Amended slider HTML.
 */
function jmw_soliloquy_add_custom_slides( $slider_html, $slider_id, $image, $data, $slide_id ) {
 
	// Bail out early if we are not targeting our specific slider. Remove this if you want it to apply to all sliders.
	if ( 2843 !== $data['id']) {
		return $slider_html;
	}
	
	if ( 1 == $slide_id ) { // Add a slide after first post slide  	
		$slider_html .= jmw_soliloquy_generate_slide_html( '2763' );
	} elseif ( 2 == $slide_id ) { // Add a slide after second post slide
		$slider_html .= jmw_soliloquy_generate_slide_html( '2769' );
	}
 
	// Return the amended slider HTML with our custom slides.
	return $slider_html;
}
 
/** 
 * Generate slide html string for given page id.
 *
 * @param string  $page_id	The Page ID to generate the slide from.
 * 
 * @return string  		The HTML string for the slide.
 */
function jmw_soliloquy_generate_slide_html( $page_id ) {
	return sprintf(
		'<li class="soliloquy-item"><a href="%1$s"><img class="soliloquy-item-image" src="%2$s" title="%3$s" alt="%3$s" /></a><div class="soliloquy-caption"><div class="soliloquy-caption-inside soliloquy-fc-caption"><h2 class="soliloquy-fc-title">%4$s</h2></div></div></li>',
		esc_url( get_permalink( $page_id ) ),
		esc_url( wp_get_attachment_url( get_post_thumbnail_id( $page_id ) ) ),
		esc_attr( get_the_title( $page_id ) ),
		get_the_title( $page_id )
	);
}

Featured Image: Photo by rawpixel on Unsplash