Quantcast
Channel: WordPress.org Forums » [Jetpack - WP Security, Backup, Speed, & Growth] Support
Viewing all articles
Browse latest Browse all 36995

Jeremy Herve on "[Plugin: Jetpack by WordPress.com] Using photon with different resizing on different pages"

$
0
0

Let me use an commented example to try to explain: here is what you could add in your theme's functions.php file, instead of adding code to your home page and your single.php file.

First, let's add support for Photon, as explained in the end of this post:
http://jetpack.me/2013/07/11/photon-and-themes/

if( function_exists( 'jetpack_photon_url' ) ) {
    add_filter( 'jetpack_photon_url', 'jetpack_photon_url', 10, 3 );
}

Then, let's build and add the Featured images right before the post content. These images will be of a different size whether you're on a single page or not:

function jeherve_display_custom( $content, $post ) {

	global $post;

	// If you didn't define a post thumnail, let's forget about all this
	if ( !has_post_thumbnail( $post->ID ) )
		return $content;

	// What's the cropping and the size of image we should use on Single pages?
	// See http://developer.wordpress.com/docs/photon/api/#crop for parameters
	if ( is_single() ) {
		$args = array(
		    'crop'   => '50,50,200px,200px',
		);
	}
	// resizing on other pages
	else {
		$args = array(
		    'resize'   => '200,400',
		);
	}

	// Let's create a Photon Image URL from the Post Thumbnail
	$feat_image_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full');
	$photon_image_url = jetpack_photon_url( $feat_image_url[0], $args );

	// Let's build the image tag, as it was built before in your example
	$our_image = sprintf( '<div class="post-media"><a class="featured-image" href="%1$s" title="%2$s"><img src="%3$s" class="wp-post-image" alt="Featured Image"></a></div>',
		esc_url( get_permalink() ),
		esc_attr( sprintf( __( 'Open %s', 'dot' ), get_the_title() ) ),
		esc_attr( $photon_image_url )
	);

	// Let's return the image, right before the post content
	return $our_image . $content;

}
add_filter( 'the_content', 'jeherve_display_custom' );

Secondly when resizing, is it possible to crop from top center?

As you can see, on single pages I used the "crop" parameter. You can play with values to get the crop you need, based on the explanations here:
http://developer.wordpress.com/docs/photon/api/#crop


Viewing all articles
Browse latest Browse all 36995

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>