Integrate open graph protocol without plugin?

Question

What is the right way to put in Open Graph Protocol into a wp theme in order to when someone likes or shares on facebook to show hihm as thumbnail the featured image of the post or the page?

Which is the metadata that need to be written in the header.php or function.php?

Answer 1

This information doesn't have to be static. Here's an example:

<meta property="og:title" content="<?php if ( is_single() ) { wp_title(); } else { bloginfo('name'); } ?>" />
<meta property="og:type" content="blog" />
<meta property="og:url" content="<?php echo get_permalink() ?>" />
<meta property="og:site_name" content="<?php bloginfo('name') ?>" />

Images are a little tricker. I like using the featured image if it's available, personally. To do so, add this with your opengraph data:

<?php foreach (get_representative_images() as $image_url): ?>
<meta property="og:image" content="<?php echo $image_url ?>" />
<?php endforeach; ?>

... and add this to your theme's functions.php...

function get_representative_images() {
    global $post;
    $images = array('http://www.your.com/default/image.jpg');
    if ( has_post_thumbnail($post->ID) ) { // check if the post has a Post Thumbnail assigned to it.
        $image_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'thumbnail');
        array_unshift($images, $image_url[0]);
    }
    return $images;
}

Cheers~

Answer 2

You don't necessarily need a 3rd party plugin to get the benefits of Open Graph, but without writing some code, you're going to be a bit limited.

For example, you could add a few key meta tags to your header.php:

<meta property="og:title" content="The Rock" />
<meta property="og:type" content="video.movie" />
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/" />
<meta property="og:image" content="http://ia.media-imdb.com/images/rock.jpg" />

The trouble is that they will be static, however. As you jump from page to page (or post to post) on your site, these meta tags won't change. That's where a plugin helps. It dynamically creates those meta tags to ensure they match the content of each Page/Post.

In the end, I think you're going to have to either find one you like, or create your own for optimal results.

For more details on the Open Graph meta tags, visit: http://ogp.me