Last active
January 16, 2018 23:26
-
-
Save scotthorn/bb461f6d06cfdedb92ac to your computer and use it in GitHub Desktop.
Make Soliloquy use the native responsive image handling from Wordpress 4.4+
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
// Make Soliloquy sliders use wp's native responsive images with wp retina | |
function my_theme_soliloquy_output($slider, $data) { | |
return wp_make_content_images_responsive($slider); | |
} | |
add_filter('soliloquy_output', 'my_theme_soliloquy_output', 10, 2); | |
// wp_make_content_images_responsive needs the img tags to have a class with their id | |
function my_theme_soliloquy_image_slide_class($classes, $item, $i, $data, $mobile) { | |
$classes[] = 'wp-image-' . $item['id']; | |
return $classes; | |
} | |
add_filter('soliloquy_output_item_image_classes', 'my_theme_soliloquy_image_slide_class', 10, 5); | |
// Alter the image source that soliloquy uses so that responsive images will work | |
function my_theme_soliloquy_image_src($src, $id, $item, $data) { | |
$base_url = trailingslashit( _wp_upload_dir_baseurl() ); | |
$image_meta = get_post_meta( $item['id'], '_wp_attachment_metadata', true ); | |
return $base_url . $image_meta['file']; | |
} | |
add_filter('soliloquy_image_src', 'my_theme_soliloquy_image_src', 10, 4); | |
// Hook to disable soliloquy's preloading which stops responsive images being used. | |
function my_theme_soliloquy_disable_preloading($disabled, $data) { | |
return true; | |
} | |
add_filter('soliloquy_disable_preloading', 'my_theme_soliloquy_disable_preloading', 10, 2); | |
?> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
For anyone else coming upon this, WordPress will give an error with the above code.
Change line 17 to:
And it should work.