Jetpack

How to Override Jetpack Infinite Scroll Settings in a Child Theme

From our illustrious colleagues over at ThemeShaper, I’d like to share with you a post on further customizing Infinite Scroll settings in your themes:

When a theme author adds Jetpack Infinite Scroll support to their theme, they configure its options specifically for that theme. Occasionally you might want to override the theme’s defaults for your purposes, and in this article, I’ll show you how to do so in a child theme.

Here is a typical Jetpack Infinite Scroll setup function…

Read the whole post: How to Override Jetpack Infinite Scroll Settings in a Child Theme.

Posted in Tips & Tricks | Comments Off

How to add Javascript events to the Carousel view

Add this to your site’s js to enable events such as adding Google Analytics tracking code to individual Carousel slides:

jQuery(document).on( 'jp_carousel.selectSlide', '.jp-carousel-wrap', function( event, slides ) {
	// This is just to show you what values get passed in.  Delete it before going to production.
	if ( window.console ) {
		console.log( this );
		console.log( event );
		console.log( slides );
		console.log( slides[0] );
	}
	// Do whatever extra stuff you want here.
} );

You can read more about it here.

Posted in Code snippets, Tips & Tricks | Tagged , , | Comments Off

How to disable the auto-activation of a Jetpack module

In Jetpack 2.6, we will introduce a new filter, jetpack_get_default_modules. It will allow you to stop the auto-activation of a specific Jetpack module.

Here is an example with the Widget Visibility module:

// To disable the auto-activation of Jetpack's Widget Visibility module:
add_filter( 'jetpack_get_default_modules', 'disable_jetpack_widget_visibility_autoactivate' );
function disable_jetpack_widget_visibility_autoactivate( $modules ) {
	return array_diff( $modules, array( 'widget-visibility' ) );
}

// Or, to disable the functionality in your own plugin if the user activates it in Jetpack:
if ( ! class_exists( 'Jetpack' ) || ! Jetpack::is_module_active( 'widget-visibility' ) ) {
	// It's not there, do as you like!
}

Reference.

If you wanted all Jetpack modules to be deactivated by default, you could use the following code:

add_filter( 'jetpack_get_default_modules', '__return_empty_array' );
Posted in Code snippets, Tips & Tricks | Tagged , , , , | Comments Off

How to load only a specific Jetpack module

Sometimes you do not want to see a specific module in the Jetpack menu. You might not use it at all, or you might want to make sure other admins can’t activate it.

For such cases, you can use the jetpack_get_available_modules filter to control the list of modules available in Jetpack.

Load only a specific Jetpack module

function tweakjp_only_stats ( $modules ) {
    $return = array();
    $return['stats'] = $modules['stats'];
    return $return;
}
add_filter( 'jetpack_get_available_modules', 'tweakjp_only_stats' );

Disable a specific module

function tweakjp_disable_stats ( $modules ) {
    unset( $modules['stats'] );
    return $modules;
}
add_filter( 'jetpack_get_available_modules', 'tweakjp_disable_stats' );
Posted in Code snippets, Tips & Tricks | Tagged , , , | Comments Off

How to change the size of the thumbnails in the Top Posts widget

The Top Posts widget offers different options to display a list of posts, or a grid of post thumbnails. In some cases, you might want to change the size of the thumbnails used by this widget.

To do so, you’ll need to change the size parameters in the image source, by adding the following code to your theme’s functions.php file, or to a functionality plugin:

function jeherve_custom_thumb_size( $get_image_options ) {
        $get_image_options['avatar_size'] = 600;

        return $get_image_options;
}
add_filter( 'jetpack_top_posts_widget_image_options', 'jeherve_custom_thumb_size' );

You can add some custom CSS to overwrite Jetpack’s default CSS. You can paste this CSS in yor theme’s stylesheet, or under Appearance > Edit CSS in your dashboard:

.widget_top-posts .widgets-list-layout-blavatar {
    max-width: 600px;
}
Posted in Code snippets, Tips & Tricks | Tagged , | Comments Off

Automatically close comments in the Carousel view

You can use the following code to automatically close comments in the Carousel view, based on the number of days you’ve defined in Settings > Discussion:

function jpcarousel_auto_close_comments( $open, $post_id ) {
	$post = get_post( $post_id );

	$days_old = (int) get_option( 'close_comments_days_old' );

	if ( ! $days_old )
		return $open;

	if( $post->post_type == 'attachment' && time() - strtotime( $post->post_date_gmt ) > ( $days_old * DAY_IN_SECONDS ) ) {
		return false;
	}
	return $open;
}
add_filter( 'comments_open', 'jpcarousel_auto_close_comments', 10 , 2 );
Posted in Code snippets, Tips & Tricks | Tagged , | Comments Off

Make Sure Your Functions Function: Unit Testing

Hopefully you’ve checked out our new contributor guide and you’re ready to submit your first patch — thanks! But before you send your .diff out into the world, run a unit test to make sure everything’s working as it should.

(more…)

Posted in Contribute, Tips & Tricks | Tagged , | 1 Comment

Remove Jetpack Sharing buttons in the Mobile Theme

You can add the following code to a functionality plugin to remove the Jetpack Sharing buttons in the Mobile Theme:

// Check if we are on mobile
function jetpackme_is_mobile() {

    // Are Jetpack Mobile functions available?
    if ( ! function_exists( 'jetpack_is_mobile' ) )
        return false;

    // Is Mobile theme showing?
    if ( isset( $_COOKIE['akm_mobile'] ) && $_COOKIE['akm_mobile'] == 'false' )
        return false;

    return jetpack_is_mobile();
}

// Let's remove the sharing buttons, but only if we're on a mobile device
function jetpackme_maybe_add_filter() {

    // On mobile, and on the home page?
    if ( jetpackme_is_mobile() ) {
        remove_filter( 'the_content', 'sharing_display', 19 );
		remove_filter( 'the_excerpt', 'sharing_display', 19 );
    }
}
add_action( 'wp_head', 'jetpackme_maybe_add_filter' );

// Build the function
function jptweak_remove_share() {
	remove_filter( 'the_content', 'sharing_display', 19 );
	remove_filter( 'the_excerpt', 'sharing_display', 19 );
}

Looking for more mobile tips? You’ll find them here!

Posted in Code snippets, Tips & Tricks | Tagged , , | Comments Off

How to disable specific shortcodes in Jetpack

Jetpack includes many shortcodes allowing you to embed videos, audio files, images, and other media into your posts.

If you want to deactivate a specific shortcode without deactivating the Shortcodes module, you can add the following code to your theme’s functions.php file, or to a functionality plugin:

function my_remove_shortcode_function( $shortcodes ) {
	$jetpack_shortcodes_dir = WP_CONTENT_DIR . '/plugins/jetpack/modules/shortcodes/';
	
	$shortcodes_to_unload = array( 'ted.php', 'soundcloud.php', );

	foreach ( $shortcodes_to_unload as $shortcode ) {
		if ( $key = array_search( $jetpack_shortcodes_dir . $shortcode, $shortcodes ) ) {
			unset( $shortcodes[$key] );
		}
	}
		
	return $shortcodes;
}
add_filter( 'jetpack_shortcodes_to_include', 'my_remove_shortcode_function' );

In the code above, you’ll need to add to or remove shortcodes from the $shortcodes_to_unload array. It requires the file name of the shortcode you want to deactivate.

Posted in Code snippets, Tips & Tricks | Tagged | Comments Off

How to use Photon to serve custom cropped Post thumbnails

The Photon module resizes your site’s images on the fly, without cropping them. However, in some cases you might want Photon to apply a custom cropping when resizing certain images.

In the following example, we will use photon to serve Post thumbnails with custom cropping, and use a different cropping on single pages:

if( function_exists( 'jetpack_photon_url' ) ) {
    add_filter( 'jetpack_photon_url', 'jetpack_photon_url', 10, 3 );
}
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
	$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' );

Reference

Posted in Code snippets, Tips & Tricks | Tagged , | Comments Off
Follow

Get every new post delivered to your Inbox.

Join 63,943 other followers