Created
August 9, 2014 12:52
-
-
Save stevenhoney/9dbfb4908d129c62ef42 to your computer and use it in GitHub Desktop.
WP theme/plug in snippet - post_gallery filter replaces wp gallery with bxslider working with elf02 WP Responsive Images
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 | |
| // standard wp post_gallery filter set up | |
| add_filter('post_gallery', 'bxslider_picturefill_gallery', 10, 2); | |
| function bxslider_picturefill_gallery($output, $attr) { | |
| global $post; | |
| if (isset($attr['orderby'])) { | |
| $attr['orderby'] = sanitize_sql_orderby($attr['orderby']); | |
| if (!$attr['orderby']) | |
| unset($attr['orderby']); | |
| } | |
| extract(shortcode_atts(array( | |
| 'order' => 'ASC', | |
| 'orderby' => 'menu_order ID', | |
| 'id' => $post->ID, | |
| 'itemtag' => 'dl', | |
| 'icontag' => 'dt', | |
| 'captiontag' => 'dd', | |
| 'columns' => 'columns', | |
| 'size' => 'size', | |
| 'include' => '', | |
| 'exclude' => '' | |
| ), $attr)); | |
| $id = intval($id); | |
| if ('RAND' == $order) $orderby = 'none'; | |
| if (!empty($include)) { | |
| $include = preg_replace('/[^0-9,]+/', '', $include); | |
| $_attachments = get_posts(array('include' => $include, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $order, 'orderby' => $orderby)); | |
| $attachments = array(); | |
| foreach ($_attachments as $key => $val) { | |
| $attachments[$val->ID] = $_attachments[$key]; | |
| } | |
| } | |
| if (empty($attachments)) return ''; | |
| // Output Begins | |
| $output .= "<div class='gallery-wrapper'>\n"; | |
| $output .= "<div class='main-slider'>\n"; | |
| $output .= "<ul class='bxslider'>\n"; | |
| // Loop for main slider | |
| foreach ($attachments as $id => $attachment) { | |
| $src = wp_get_attachment_image_src( $attachment->ID); | |
| $output .= "<li>\n"; | |
| $output .= "<img data-responsive='{$id}' />\n"; | |
| $output .= "</li>\n"; | |
| } | |
| $output .= "</ul>\n"; | |
| $output .= "</div>\n"; | |
| //Thumbnail pager begins - if using standard pager or none can remove from here to comment below | |
| $output .= "<div id='bxpager' class='bxpager'>\n"; // id is added to allow for 'custom pager' options | |
| $i = 0; //add counter for data-slide-index | |
| // Loop for thumbnail pager nav | |
| foreach ($attachments as $id => $attachment) { | |
| $src = wp_get_attachment_image_src( $attachment->ID, 'small-img'); | |
| $data = $i++; | |
| $output .= "<a data-slide-index='{$data}' href=''>\n"; | |
| $output .= "<img src='{$src[0]}' />\n"; | |
| $output .= "</a>\n"; | |
| } | |
| $output .= "</div>\n"; | |
| //Thumbnail Pager Ends | |
| $output .= "</div>\n"; | |
| return $output; | |
| } | |
| // Can add bxslider js however you like - I have bxslider included in my starter template based on Roots so add as below. | |
| // Note 'true' adds to the footer, if in the <head> get conflict with picturefill.js | |
| wp_register_script( 'bxslider', get_template_directory_uri() . '/assets/js/jquery.bxslider.min.js', array('jquery'), '1.0', true ); | |
| wp_enqueue_script( 'bxslider' ); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment