0

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?

2 Answers 2

3

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~

3
  • Which is different "website", "article" and "blog" for og:type? and how i add "blog" or "article" for posts/page and "website" for homepage of wp site(or is a bad idea for wp sites?)?
    – Alex
    Feb 4, 2012 at 10:37
  • 1
    You can use is_front_page to determine your homepage, and I think it's fine to do that. I'm not an expert in opengraph, so I don't know much about the right time to use website versus article, but I imagine anything singular (post/page) use article, and any lists use website. Just a suggestion! Feb 4, 2012 at 15:07
  • Alright, thanks for the information. One last thing I want to ask you, with code that you gave me for functions.php it shows me as option two photos(the default image and the featured image). How can I make it if there is featured image to show me only this as option and if there isn't the featured image then it will show as option the default image? Also, I noticed that in my text in expert, when there are "" & «» the text stops till the point it shows these. How can I make to show the whole text that I have in the expert?
    – Alex
    Feb 5, 2012 at 21:14
0

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

1
  • thnx for the infos :)
    – Alex
    Feb 5, 2012 at 21:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.