Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save jamiemitchell/4c0cbbfd168a10c0d81b4b1ba36c36b9 to your computer and use it in GitHub Desktop.
Save jamiemitchell/4c0cbbfd168a10c0d81b4b1ba36c36b9 to your computer and use it in GitHub Desktop.
Image Functions examples
<?php
//* Do NOT include the opening php tag shown above. Copy the code shown below.
<!-- 0) Display Medium sized image floated right -->
http://sridharkatakam.com/how-to-display-featured-image-in-single-posts-in-genesis/
$image_args = array(
'size' => 'medium',
'attr' => array(
'class' => 'alignright',
),
);
genesis_image( $image_args );
<!-- 1) Show Featured image if present, otherwise show a default image -->
$img = genesis_get_image() ? genesis_get_image( array( 'size' => 'related' ) ) : '<img src="' . get_stylesheet_directory_uri() . '/images/related.png" alt="' . get_the_title() . '" />';
<!-- 2) Show Featured image -->
$img = genesis_get_image( array( 'size' => 'related' ) );
<!-- 3) http://sridharkatakam.com/set-default-image-genesis-featured-posts-widget/ -->
$image = genesis_get_image( array(
'format' => 'html',
'size' => $instance['image_size'],
'context' => 'featured-post-widget',
'attr' => genesis_parse_attr( 'entry-image-widget' ),
) );
// if there is no Featured Image, set a default image to appear.
if ( ! $image ) {
$image = '<img src="' . get_stylesheet_directory_uri() . '/images/default-image.png" />';
}
<!-- 4) Passing Featured image to a .js file. http://sridharkatakam.com/display-page-title-full-width-featured-image-genesis/ -->
wp_localize_script( 'sk-backstretch-set', 'BackStretchImg', array( 'src' => str_replace( 'http:', '', genesis_get_image( array('format' => 'url') ) ) ) );
<!-- backstretch-set.js: -->
jQuery(document).ready(function($) {
$(".entry-header-wrapper").backstretch([BackStretchImg.src],{duration:3000,fade:750});
});
<!-- Another example: -->
// if the post has a featured image, send it to Backstretch else use a default one
if ( has_post_thumbnail() ) {
wp_localize_script( 'backstretch-init', 'BackStretchImg', array( 'src' => wp_get_attachment_url( get_post_thumbnail_id() ) ) );
}
else {
wp_localize_script( 'backstretch-init', 'BackStretchImg', array( 'src' => 'http://genesis.dev/wp-content/themes/genesis-sample/images/picjumbo.com_IMG_6533-1600.jpg' ) );
}
<!-- http://sridharkatakam.com/medium-like-full-view-featured-image-genesis/ -->
<!-- Also at http://sridharkatakam.com/set-featured-image-full-sized-background-posts-pages-wordpress/ -->
<!-- 5) -->
//* Add the featured image
add_action( 'genesis_entry_content', 'sk_show_featured_image', 9 );
function sk_show_featured_image() {
if ( $image = genesis_get_image( 'format=url&size=staff' ) ) {
printf( '<div class="staff-featured-image-sigle"><img src="%s" alt="%s" class="alignleft" /></div>', $image, the_title_attribute( 'echo=0' ) );
}
}
<!-- 6) Adding Featured image below Post title -->
<!-- http://sridharkatakam.com/adding-featured-image-post-title-outreach-pro/ -->
//* Add new image size
add_image_size( 'single-thumbnail', 680, 200, true );
//* Display featured image above content on Posts
add_action ( 'genesis_entry_content', 'sk_show_featured_image_single', 9 );
function sk_show_featured_image_single() {
if ( is_singular('post') && has_post_thumbnail() ) {
echo '<div class="single-thumbnail">';
genesis_image( array( 'size' => 'single-thumbnail' ) );
echo '</div>';
}
}
<!-- 7) -->
if ( $image = genesis_get_image( 'format=url&size=portfolio' ) ) {
printf( '<div class="portfolio-image"><a href="%s" rel="bookmark"><img src="%s" alt="%s" /></a></div>', get_permalink(), $image, the_title_attribute( 'echo=0' ) );
}
<!-- 8) http://sridharkatakam.com/custom-page-template-genesis-shows-featured-image-banner/ -->
add_action ( 'genesis_before_header', 'sk_add_banner_image' );
function sk_add_banner_image() {
if ( has_post_thumbnail() ) {
echo '<div class="banner-image">
<div class="wrap">
<img src="' . genesis_get_image( array( 'format' => 'url' ) ) . '" />
</div>
</div>';
}
}
<!-- 9) http://sridharkatakam.com/different-banner-images-different-pages-genesis/ -->
add_action ( 'genesis_before_header', 'sk_add_header_image' );
function sk_add_header_image() {
printf( '<div %s>', genesis_attr( 'header-image' ) );
genesis_structural_wrap( 'header-image' );
if ( is_page() && has_post_thumbnail() ) :
$image_url = genesis_get_image( array( 'format' => 'url' ) );
else :
$image_url = get_stylesheet_directory_uri() .'/images/header.jpg';
endif;
$header_image = sprintf( '<a href="%s" title="%s"><img src="'. $image_url .'" title="%s" alt="%s"/></a>', trailingslashit( home_url() ), esc_attr( get_bloginfo( 'name' ) ), esc_attr( get_bloginfo( 'name' ) ), esc_attr( get_bloginfo( 'name' ) ) );
echo $header_image;
genesis_structural_wrap( 'header-image', 'close' );
echo '</div>';
}
<!-- 10) Streamline Pro's functions.php: -->
//* Remove default post image
remove_action( 'genesis_entry_content', 'genesis_do_post_image', 8 );
//* Add post image above post title
add_action( 'genesis_entry_header', 'streamline_post_image', 1 );
function streamline_post_image() {
if ( is_page() || ! genesis_get_option( 'content_archive_thumbnail' ) )
return;
if ( $image = genesis_get_image( array( 'format' => 'url', 'size' => genesis_get_option( 'image_size' ) ) ) ) {
printf( '<a href="%s" rel="bookmark"><img class="post-photo" src="%s" alt="%s" /></a>', get_permalink(), $image, the_title_attribute( 'echo=0' ) );
}
}
<!-- 11) http://sridharkatakam.com/custom-page-template-shows-latest-cpt-entry-custom-taxonomy-genesis/ -->
if ( $image = genesis_get_image( 'format=url&size=portfolio' ) ) {
printf( '<div class="portfolio-featured-image"><a href="%s" rel="bookmark"><img src="%s" alt="%s" /></a></div>', get_permalink(), $image, the_title_attribute( 'echo=0' ) );
}
<!-- 12) -->
$image_args = array(
'size' => 'medium',
'attr' => array(
'class' => 'alignright',
),
);
$image = genesis_get_image( $image_args );
if ( $image ) {
echo '<a href="' . get_permalink() . '">' . $image .'</a>';
}
<!-- 13) How to display full width Featured image below Header in Minimum Pro -->
/**
* Get featured image markup.
*
* Only when the single Post or Page has a featured image, and only when
* showing the first page when the Page or Post is divided into multiple
* pages using next page quicktag.
*
* @author Sridhar Katakam
* @author Gary Jones
* @link http://sridharkatakam.com/display-featured-image-header-minimum-pro/
*
* @return string|bool Image markup if image could be determined
*/
function sk_get_featured_image() {
// Uncomment the lines below if you want to limit to *just* featured
// images, and not fallback to first-attached images.
// if ( ! has_post_thumbnail() ) {
// return;
// }
if ( ! is_page() && ! is_single() ) {
return;
}
if ( (int) get_query_var( 'page' ) > 0 ) {
return;
}
// If post has no featured image, it will attempt to fallback to
// first-attached image if the first conditional in this function
// is commented out.
return genesis_get_image( 'class=aligncenter' );
}
add_action ( 'genesis_after_header', 'sk_featured_image', 9 );
/**
* Display Featured image after header.
*
* Only on the first page when the Page or Post is divided into multiple
* using next page quicktag.
*
* Scope: static Pages and single Posts.
*
* @author Sridhar Katakam
* @author Gary Jones
* @link http://sridharkatakam.com/link-to-your-tutorial
*/
function sk_featured_image() {
if ( $image = sk_get_featured_image() ) {
echo '<div class="my-featured-image">' . $image . '</div>';
}
}
<!-- or, -->
add_action ( 'genesis_after_header', 'sk_featured_image', 9 );
/**
* Display Featured image after header
* only on the first page when the Page or Post is divided into multiple using <!--nextpage-->
*
* Scope: static Pages and single Posts.
*
* @author Sridhar Katakam
* @author Gary Jones
* @link http://sridharkatakam.com/display-featured-image-header-minimum-pro/
*/
function sk_featured_image() {
if ( has_post_thumbnail() && ( is_page() || is_single() ) && 0 === get_query_var( 'page' ) ) {
// Get the URL of featured image
$image = genesis_get_image( 'format=url' );
// Get the alt text of featured image
$thumb_id = get_post_thumbnail_id( get_the_ID() );
$alt = get_post_meta( $thumb_id, '_wp_attachment_image_alt', true );
// If no alt text is present for featured image, set it to Post/Page title
if ( '' == $alt ) {
$alt = the_title_attribute( 'echo=0' );
}
// Display featured image
printf(
'<div class="my-featured-image"><img src="%s" alt="%s" class="aligncenter" /></div>',
esc_url( $image ),
$alt
);
}
}
<!-- http://sridharkatakam.com/display-featured-image-header-minimum-pro/ -->
<!-- 14) -->
add_action( 'genesis_entry_header', 'sk_image', 9 );
function sk_image() {
$image_args = array(
'size' => 'custom-square-thumbnail',
'attr' => array(
'class' => 'alignleft',
)
);
// Get the featured image HTML
$image = genesis_get_image( $image_args );
echo '<a rel="bookmark" href="'. get_permalink() .'">'. $image .'</a>';
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment