Skip to content

Instantly share code, notes, and snippets.

@stefanledin
Last active July 7, 2017 09:11
Show Gist options
  • Select an option

  • Save stefanledin/bb3dde9c15a14b3dffdccba9c9410219 to your computer and use it in GitHub Desktop.

Select an option

Save stefanledin/bb3dde9c15a14b3dffdccba9c9410219 to your computer and use it in GitHub Desktop.
<?php
function timber_get_film_strip_image( $id = null, $caption = '', $class = '') {
$markup = '';
//do nothing if we have no ID
if ( empty( $id ) ) {
return $markup;
}
if ( empty( $caption ) ) {
//try to get the caption from the attachment metadata
$caption = timber_get_img_caption( $id );
}
$image_full_size = wp_get_attachment_image_src( $id, 'full' );
$image_small_size = wp_get_attachment_image_src( $id, 'timber-small-image' );
$image_large_size = wp_get_attachment_image_src( $id, 'timber-large-image' );
//get directly the raw metadata because Jetpack Photon ruins stuff for us - no dimensions are returned by wp_get_attachment_image_src()
$image_data = wp_get_attachment_metadata( $id );
$markup .=
'<div class="portfolio__item js-placeholder js-portfolio-item proof-photo ' . $class . '"
id="' . $id . '"
data-attachment_id="' . $id . '"
data-alt="' . esc_attr( timber_get_img_alt( $id ) ) . '"
data-caption="' . esc_attr( $caption ) . '"
data-description="' . esc_attr( timber_get_img_description( $id ) ) . '"
data-exif="' . esc_attr( timber_get_img_exif( $id ) ) . '"
data-width="' . $image_data["width"] . '"
data-height="' . $image_data["height"] . '">
'.rwp_img( $id ).'
<div class="proof__overlay">
<button class="proof-btn proof-btn--thumbs js-thumbs"></button>
<button class="proof-btn proof-btn--zoom js-zoom"></button>
<button data-photoid="' . $id . '" class="proof-btn proof-btn--plus js-plus select-action"></button>
<button data-photoid="' . $id . '" class="proof-btn proof-btn--minus js-plus select-action"></button>
</div>
<div class="proof__selected"></div>
<noscript>
<img src="' . $image_small_size[0] . '" alt="' . esc_attr( timber_get_img_alt( $id ) ) . '" width="' . $image_small_size[1] . '" height="' . $image_small_size[2] . '">
</noscript>
</div><!-- .portfolio__item -->' . PHP_EOL;
return $markup;
}
?>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment