Skip to content

Instantly share code, notes, and snippets.

@besimhu

besimhu/Wordpress Image - ID+Markup.html

Last active August 29, 2015 14:17
Show Gist options
  • Save besimhu/83c4a81b39a274057646 to your computer and use it in GitHub Desktop.
Save besimhu/83c4a81b39a274057646 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Wordpress Image - ID+Markup.html
// Markup Sample
<img src="<?php echo $image[0]; ?>"
width="<?php echo $image[1]; ?>"
height="<?php echo $image[2]; ?>"
alt="<?php echo $image_alt; ?>" />
// Markup Sample (Media Query Sync)
<figure>
<img class="responsive"
src="<?php echo $media_sml[0]; ?>"
data-mq-large-src="<?php echo $media_lrg[0]; ?>"
width="<?php echo $media_lrg[1]; ?>"
height="<?php echo $media_lrg[2]; ?>"
alt="<?php echo $media_alt; ?>" />
<figcaption>
<?php echo $media_alt; ?>
</figcaption>
</figure>
Raw
Wordpress Image - ID+Markup.php
/**
* Based off of image ID.
*
* You can use this method to pull in several different crops for responsive.
* The crop can be custom, or one of WP default ones, or leave empty.
*
* wp_get_attachment_image_src( $attachment_id, $size, $icon )
* http://codex.wordpress.org/Function_Reference/wp_get_attachment_image_src
*/
// Define variables
$image_id = $field['custom_filed'];
$image_alt = get_post_meta( $image_id, '_wp_attachment_image_alt', true );
$image = wp_get_attachment_image_src( $image_id, 'crop_name' );
// Other ways to pull in ID.
wp_get_attachment_image_src( get_post_thumbnail_id(), 'crop_name' );
wp_get_attachment_image_src( get_field('image_field'), 'crop_name' );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment