Jetpack: add hashtags to the twitter sharing button

A few days ago I explained how to add hashtags to the tweets sent out by Jetpack Publicize. But what about the tweets your read can send using the Jetpack Sharing buttons at the bottom of your posts?

Here is how to get tags from your posts, and add them as hashtags to the twitter sharing button. As always, you’ll want to paste that code in a functionality plugin.

function jeherve_custom_sharing_title() {
        $post = get_post();
        if ( empty( $post ) ) {
                return;
        } else {
                // Create sharing title
                $sharing_title = get_the_title( $post->ID );

                // Get the tags
                $post_tags = get_the_tags( $post->ID );
                if ( ! empty( $post_tags ) ) {
                        // Create list of tags with hashtags in front of them
                        $hash_tags = '';
                        foreach( $post_tags as $tag ) {
                                $hash_tags .= ' #' . $tag->name;
                        }
                        // Add tags to the title
                        $sharing_title .= $hash_tags;
                }

                return $sharing_title;
        }
}
add_filter( 'sharing_title', 'jeherve_custom_sharing_title', 10, 3 );

Hat tip to Ryan for the idea!

Jetpack: add hashtags to tweets sent by Publicize

Jetpack’s Publicize module allows you to automatically publish your posts to your favorite Social Networks like Twitter or Facebook.

You can customize the message that is posted to Social Networks thanks to the small input field right above the Publish button:

Publicize Options

But what if you wanted to automatically add details to each Publicized post? Since both Twitter and Facebook support hashtags, you could append the post tags after the post title, like so:

Tweet tags

To do so, add the following code to a functionality plugin:

function jeherve_publicize_hashtags() {
	$post = get_post();
	if ( ! empty( $post ) ) {

		// Grab the tags of the post
		$post_tags = get_the_tags( $post->ID );

		// Append tags to custom message
		if ( ! empty( $post_tags ) ) {

			// Create list of tags with hashtags in front of them
			$hash_tags = '';
			foreach( $post_tags as $tag ) {
				$hash_tags .= ' #' . $tag->name;
			}

			// Create our custom message
			$custom_message = get_the_title() . ' ' . $hash_tags;
			update_post_meta( $post->ID, '_wpas_mess', $custom_message );
		}
	}
}

// Save that message
function jeherve_cust_pub_message_save() {
	add_action( 'save_post', 'jeherve_publicize_hashtags' );
}
add_action( 'publish_post', 'jeherve_cust_pub_message_save' );

Semicolon: use Jetpack’s Custom CSS libs in your theme

Yet another good example of how to use libraries bundled with Jetpack on your site!

My colleague Konstantin Kovshenin recently released the Semicolon theme. It uses the libraries used in Jetpack’s Custom CSS module to compile its stylesheet (yay Sass!), and to correct the contrast of the colors you’ve picked in the theme options. So if you pick bad contrasting colors, Semicolon will lighten or darken them until a contrast ratio threshold is reached. This guarantees a certain level of readability.

You can read more about it in Konstantin’s post: Color Options vs. Decisions in WordPress Themes.

Color Posts plugin: how to use Jetpack libs in your own plugin

I’ve talked about customizing Jetpack in the past, and I also mentioned how you can integrate Jetpack features in your theme.

How about including these features in a plugin? As a proof of concept I just released Color Posts, a plugin that uses 2 very useful classes that are bundled with Jetpack.

Continue reading Color Posts plugin: how to use Jetpack libs in your own plugin

7 months as a Ghost

Back in October of last year, Ghost was released to the public. I read a lot about this “WordPress killer”, and decided to give it a try. It is Just a Blogging Platform, so that’s exactly what I need for this site. After 7 months, I’m back on WordPress and I’d like the share my experiences with you.

Continue reading 7 months as a Ghost

Jetpack: change og:title value to be all uppercase

Caps Lock

Some blog owners would like their post titles to be displayed in all caps, to attract more clicks on Facebook. Here is how to change Jetpack’s Open Graph meta tags to use an uppercase og:title tag:

/*
 * Plugin Name: Uppercase og:title for Jetpack 
 * Plugin URI: http://wordpress.org/extend/plugins/jetpack/
 * Description: Removes Jetpack's default og:title tag, and replaces it with an uppercase og:title 
 * Author: Jeremy Herve
 * Version: 1.0
 * Author URI: http://jeremy.hu
 * License: GPL2+
 */
function jeherve_capital_title_og( $tags ) {
        global $post;
 
        if ( is_singular() && $post ) {
                unset( $tags['og:title'] );
 
                $tags['og:title'] = strtoupper( get_the_title( $post->ID ) );
        }
        return $tags;
}
add_filter( 'jetpack_open_graph_tags', 'jeherve_capital_title_og' );

To be pasted in your theme’s functions.php file, or in a functionality plugin.

Jetpack: how to define a custom fallback image

Jetpack handles Open Graph Meta Tags for you, and automatically creates a fallback Image meta tag if you haven’t inserted any image into your post.

If you’d like to define your own custom fallback image, you can use the jetpack_open_graph_image_default filter, like so:

function jeherve_default_image() {
	$fallback_img = 'http://YOUR_IMG_URL';
	return esc_url( $fallback_img );
}
add_filter( 'jetpack_open_graph_image_default', 'jeherve_default_image' );

Note that the filter is new, and will only be added to the next Jetpack release, 3.0.