OpenGraph

When you want to share your posts on social networks, having a help with formatting cannot hurt. For that purpose I used to be a happy user of Facebook Open Graph Meta Tags for WordPress. However, with version 1.3 something went kaboom and I started getting “failed to open stream” errors. After a few attempts of repair I decided it was a time to search for a new plugin.

I tried quite a few of them and, while they all worked with Facebook, Google+ presented a challenge. Some outright didn’t support it, some supported it only in non-free version and quite a few of them were huge SEO systems that would bring my poor installation to its knees. Thus I figured it was a time to make my own. I mean, how hard can it be?

Well It was quite easy to get a basic callback working:

add_action('wp_head', 'medo_opengraph_wp_head_action');

function medo_opengraph_wp_head_action() {
    if (is_single() || is_page()) {
        $post = get_post();

        $title = $post->post_title;
        $type = 'article';
        $url = get_permalink($post);
    } else {
        $title = get_bloginfo('name');
        $type = 'website';
        $url = home_url();
    }

    echo '<meta property="og:title" content="' . $title . '" />';
    echo '<meta property="og:type" content="' . $type . '" />';
    echo '<meta property="og:url" content="' . $url . '" />';
    echo '<meta name="twitter:title" content="' . $title . '" />'; //Twitter
    echo '<meta itemprop="name" content="' . $title . '" />'; //Google+
}

With this simple code I would get posts/pages having their proper title and everything else simply having a generic title alongside my main URL. But that was not really enough - my images were missing. Ignoring crazy array return parameters, code was pretty straightforward:

foreach(get_attached_media('image') as $media) {
    $imageAttrs = wp_get_attachment_image_src($media->ID, 'full');
    $image_url =  home_url($imageAttrs[0]);
    $image_type = $media->post_mime_type;
    $image_width = $imageAttrs[1];
    $image_height = $imageAttrs[2];
    break;
}

echo '<meta property="og:image" content="' . $image_url . '" />';
echo '<meta property="og:image:type" content="' . $image_type . '" />';
echo '<meta property="og:image:width" content="' . $image_width . '" />';
echo '<meta property="og:image:height" content="' . $image_height . '" />';
echo '<meta itemprop="image" content="' . $image_url . '" />'; //Google+

And the last one was to get excerpt for the post description. Here wp_trim_words came in really handy:

$description = $post->post_excerpt;
if (strlen($description) == 0) { $description = wp_trim_words($post->post_content); }

echo '<meta property="og:description" content="' . $description . '" />';
echo '<meta name="twitter:description" content="' . $description . '" />'; //Twitter
echo '<meta itemprop="description" content="' . $description . '" />'; //Google+

Did it went as smoothly as it could? Not really. WordPress Codex was less than helpful, rarely telling you anything more than a function syntax. Coding was more trial and error than anything else. But I cannot really complain. Even with all tryouts it took me less than two hours to get plugin working with all the functionality I needed. I would consider that a success.

And, like a masochist I am, I didn’t stop after those two hours. I got some profile options for Facebook ID in. And then I built a settings page. Made code a bit cleaner. Reordered thing or two. Before I knew it, couple of hours passed and I had something one might call a proper plugin. And it is available for download. Just unzip it in wp-content/plugins and you are golden.