How do I set og:image so it takes image from page?

facebook mediawiki
LTech picture LTech · May 20, 2012 · Viewed 69.7k times · Source

I am using mediawiki 1.19 and I've added facebook 'like'. When I click like the image posted is the site logo. How do I take the image from the page. I've run the site through http://developers.facebook.com/tools/debug and it seems og:image is set to the site logo. How do I change this meta property? My site is thepetwiki.com Thanks

Answer

Lix picture Lix · May 20, 2012

You are going to gave to add some custom og:tags to the HTML markup of your page and specify the image that you want to use...

Take a look at the example from the Facebook documentation - 

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:og="http://ogp.me/ns#"
      xmlns:fb="https://www.facebook.com/2008/fbml">
  <head>
    <title>The Rock (1996)</title>
    <meta property="og:title" content="The Rock"/>
    <meta property="og:type" content="movie"/>
    <meta property="og:url" content="http://www.imdb.com/title/tt0117500/"/>
    <meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>
    <meta property="og:site_name" content="IMDb"/>
    <meta property="fb:admins" content="USER_ID"/>
    <meta property="og:description"
          content="A group of U.S. Marines, under command of
                   a renegade general, take over Alcatraz and
                   threaten San Francisco Bay with biological
                   weapons."/>
    ...
  </head>
  ...
</html>

As you can see the og:image parameter is specified here and that allows Facebook to correctly display the meta data associated with that URL...

You might not need all of the og:tags specified here, title,url,image and description should be fine for just a LIKE button.

You are already aware of the debugger tool - it will help you debug your LIKE button and og:tags. Make some changes in your HTML markup and each time you'll have to send your URL though the debugger to refresh Facebook's cached version of your URL.

A quick Google search gave me this mediawiki extension that looks like it could help you -

http://www.mediawiki.org/wiki/Extension:OpenGraphMeta

OpenGraphMeta provides OpenGraph protocol metadata for articles on the wiki for 3rd parties like Facebook to extract...

Related questions

Use Device Login on Smart TV / Console

I have noticed that Facebook seems to support Device Login with a token / PIN Code instead of user/login to be used on devices like TV or console: https://www.facebook.com/device In the search of the dev page …

Read More
Where can I find my Facebook application id and secret key?

In my Facebook account, where can I find these application IDs, secret key, all?

Read More
Facebook API - How do I get a Facebook user's profile image through the Facebook API (without requiring the user to "Allow" the application)

I'm working on a CMS that fetches a user's profile image from their Facebook URL (that is, http://facebook.com/users_unique_url). How can I accomplish this? Is there a Faceboook API call that fetches a user's profile image …

Read More