facebook opengraph, i hate it. (: please help

I would like to make it so when a user clicks Like, a specified image is used for that specific post/page.
Which would be defined by a custom field "og_custom_image"

if there is not a specified custom field containing the image for that specific post/page then i want a default image to kick in and take its place.

So far:
Im using Thesis Theme, and i have added this

i then modified the
og:image thingy to

<meta property="og:image" content="<?php echo $image = get_post_meta($post->ID, 'og_custom_image', $single = true); ?>" />

i then tested to see if a default image would appear and instead a random picture on the page was used instead.

in the code from the link above, i did


i placed my default url there.. but nothing.. still uses same image..

im aware that facebook caches things, so what i did was each time i tested it, was from a different post/url .

why are things so hard for me.. lol

  • DavidM
    • DEV MAN’s Mascot

    Hi mrmikeman,

    I've not done anything like that and don't use Thesis myself. I'll ask a couple of the guys over here if they've any experience with this type of integration.

    There are a number of Thesis users here too, so hopefully they'll have something to add. I was wondering though, have you tried posting this to the Thesis forums to see if anyone there has done it before?


  • Mason
    • DEV MAN’s Sidekick


    I haven't used Thesis with this, but I think you've implemented the code change incorrectly. You'd want it to be something like this:

    function add_facebook_open_graph_tags() {
    	if (is_single()) {
    	global $post;
    	$image = get_post_meta($post->ID, 'og_custom_image', $single = true);
    	if (!$image)
    		$image = 'http://defaultimageurl.com/image.png';
    	<meta property="og:title" content="<?php the_title(); ?>" />
    	<meta property="og:type" content="article" />
    	<meta property="og:image" content="<?php echo $image; ?>" />
    	<meta property="og:url" content="<?php the_permalink(); ?>" />
    	<meta property="og:description" content="<?php echo get_bloginfo('description'); ?>" />
    	<meta property="og:site_name" content="<?php echo get_bloginfo('name'); ?>" />
    	<meta property="fb:admins" content="ENTER YOUR FACEBOOK USER ID HERE" />
    	<?php }
    add_action('wp_head', 'add_facebook_open_graph_tags',99);

    Note where I made the change to the custom field on line 4 and that the absolute URL is needed for the default image.

    Otherwise, I'm not sure. You may have to ask about this over on the Thesis forums.


  • mrmikeman
    • Site Builder, Child of Zeus

    i tried this code actually before, at least it looks just like i remember having changed to at one point,
    having just tried again, it did not work.

    thing that gets me is, when i do not add value for og_custom_image

    i view the source of the post, and it is using the image which is set to default.

    when i do place a value for the og_custom_image,
    it uses the value as expected.

    so in the source, it all looks to be working but again i tried it on a new test post and the image which displays on the facebook wall is the GameFly banner.. which is on the sidebar..

    i would ask thesis, actually i think i did let me check........

    yeah i did no one responded yet, and usually they tell me to do something that seems to me like im supposed to know what their talking about. .usually vague :disappointed: on some things at least.

    anyone got any ideas? i mean i cant see how its not working seeing that the code in the source looks ot be doing just fine

  • mrmikeman
    • Site Builder, Child of Zeus

    ok. i hope yall dont think im posting to much :-X

    but i just did this in a regular html document

    `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
    xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://developers.facebook.com/schema/">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta property="og:title" content="This is the title" />
    <meta property="og:type" content="article" />
    <meta property="og:image" content="http://www.google.com/logos/classicplus.png" />
    <meta property="og:url" content="http://face.com" />
    <meta property="og:description" content="junk and stuff" />
    <meta property="og:site_name" content="my site name" />
    <meta property="fb:admins" content="215839858476754" />
    <title>Untitled Document</title>

    <div id="fb-root"></div>
    <script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/all.js#appId=249354565109837&xfbml=1";
    fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>

    <fb:like target="_blank" href="http://www.asdasdas2q3r3ddd.com/" send="true" layout="box_count" width="450" show_faces="true"></fb:like>

    and a picture plain ol' dont show up.. .i feel like screaming..

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.