Appending Markup to Slides in Soliloquy

This is a simple little snippet. On a project I’m working I had a need to include social share buttons with each item in a carousel slider.

Anyone who asks me knows that I’m a big fan of Soliloquy, from Thomas Griffin Media. I’m a fan because it’s a simple solution with some nifty add-ons and does what I need it to without too much fuss.

With the 2.x update Soliloquy added some filters to their plugin, making adding your own markup to your slides easier.

/* Filter to Append HTML to Slides
============================================= */
add_filter( 'soliloquy_output_slide', 'tgm_soliloquy_custom_html', 10, 4 );
function tgm_soliloquy_custom_html( $html, $id, $image, $data ) {
 
 $slider_id = $data['id']; // Get Slider ID
 $slider_img= $image['src']; // Optional; Getting Image URL from slider object
 
 if ( '1937' != $slider_id ) return $html;  // If the ID doesn't match the one we want to modify, return the default HTML output. Change 1937 to your slider ID.
 
 ob_start(); ?>
 
 // Your Custom Markup to append goes here.
 
 

$data[‘id’] grabs the value of the ID slider you wish to target. You don’t need to do anything with this if you plan on appending custom markup to all of your slides.

Since I’m targeting only one slide I’ll be using the conditional statement below.

if ( ‘1937’ = $slider_id ) return $html;

Plugin your own slide ID in place of 1937.

We’re using an output buffer to hold our markup, clean it up/sanitize it and then appending it to each slider object.

Give it a spin on your next project.

Soliloquy Dynamic Slider for Current Post and Exclude an ACF Image ID

It’s not as though it was “really” a problem. But that I couldn’t figure it out caused me to lose sleep. I hate that shit.

So what was going on?
I am using Soliloquy along with the Dynamic Addon to automagically create sliders from attached images to the current post.

function digisavvy_dynamic_slider() {
	global $post;
 
	$dg_post_id = $post->ID;
	if ( function_exists( 'soliloquy_dynamic' ) ) soliloquy_dynamic( array( 'id' => "$dg_post_id" ) );
 
}

This snippet grabs the current post ID and stores it in the $dg_post_id variable. Nice.

The problem:
This pulled all the attached images for the current post, as expected. What I didn’t expect was that it pulled an image from an ACF (Advanced Custom Fields) image field I’d set up. Not cool. So I needed to exclude that image from getting pulled into the slider.

function digisavvy_dynamic_slider() {
	global $post;
 
	$imageArray = get_field('project_cover_image'); // Array returned by Advanced Custom Fields
 	$imageID = $imageArray['id']; // Grab the field's 'ID' from the array
 
	$dg_post_id = $post->ID; // Grab the current post's 'ID'
	if ( function_exists( 'soliloquy_dynamic' ) ) soliloquy_dynamic( array( 'id' => "$dg_post_id", 'exclude' => "$imageID" ) );
 
}

Same code as the previous snippet, except now we’re grabbing data out of the ACF field’s array. First, the field had to be set to ‘Image Object’ as it stores all the gooey meta-data we need.

Next we set the field and store it to the $imageArray variable. And, then, using setting the $imageID variable, we simply pull the ‘ID’ from the image object array and then set the variable inside Soliloquy function for the exclude parameter.

Special props: http://www.aliciaramirez.com/2014/03/advanced-custom-fields-image-object-tutorial