Forums / All Other Contributions/Addons / Facebook Shares bringing up the wrong image from a product

Facebook Shares bringing up the wrong image from a product

Views: 5,908

Results 1 to 9 of 9
22 Feb 2012, 10:32 AM
#1
dgent avatar

dgent

Totally Zenned

Join Date:
Nov 2009
Location:
UK
Posts:
1,117
Plugin Contributions:
0

Facebook Shares bringing up the wrong image from a product

Don't know if anyone has seen this happen, when you share a product from your site on Facebook, and instead of bringing up the correct product image, its brought up random images from your site, like sidebox header images, or prev/next buttons.

I found the reason for this is having 'Meta Tags - Include Product Model in Title' activated in configuration/product info - If you turn this feature off it works correctly.

23 Feb 2012, 11:12 PM
#2
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Facebook Shares bringing up the wrong image from a product

You need to investigate open graph tags. og_tags. have a search online and in this forum. there are a few mods that use them here. some better than others. basically the og tags allow you to specify which image facebook uses.

Nick
iszent.com

23 Feb 2012, 11:13 PM
#3
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Facebook Shares bringing up the wrong image from a product

also this is worth knowing about:

http://developers.facebook.com/tools/debug

Nick
iszent.com

23 Feb 2012, 11:21 PM
#4
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Facebook Shares bringing up the wrong image from a product

My own solution

=============================

Save the following as includes/modules/YOUR_TEMPLATE/og_tags.php

<?php



$og_title = META_TAG_TITLE;
$og_site_name = TITLE;
$og_image = HTTP_SERVER.DIR_WS_CATALOG.'includes/templates/custom/images/default_image.png';
$og_url = $canonicalLink;
$og_fb_admin = 'XXXXXXX'; // something like 2614614
$og_type = 'website';
$og_description = META_TAG_TITLE;

if(substr($_GET['main_page'],-5) == '_info')
{
// this is a product info page
$sql = "SELECT p.products_image 
	FROM ".TABLE_PRODUCTS." p 
	WHERE p.products_id = '" . (int)$_GET['products_id'] . "'"
	;
$obj = $db->Execute($sql);
$og_image = HTTP_SERVER.DIR_WS_CATALOG.DIR_WS_IMAGES.$obj->fields['products_image'];
}

echo      
	'<meta property="og:title" content="'.$og_title.'"/>
     	<meta property="og:site_name" content="'.$og_site_name.'"/>
     	<meta property="og:image" content="'.$og_image.'"/>
     	<meta property="og:url" content="'.$og_url.'"/>
     	<meta property="fb:admins" content="'.$og_fb_admin.'"/>
     	<meta property="og:type" content="'.$og_type.'"/>';

You'll need to change the facebook id to your own one!

=============================

Then add a line in includes/templates/YOUR_TEMPLATE/common/html_header.php

<meta name="generator" content="shopping cart program by Zen Cart™, http://www.zen-cart.com eCommerce" />
<!--Add OG tags-->
<?include(DIR_WS_MODULES . zen_get_module_directory('og_tags.php'));?>

the red lines are new - the other line is just there to show you where to put it.

=============================

Then upload an image to :

'includes/templates/custom/images/default_image.png

This is the image that will be used for pages other than product pages. Usually the logo of the store.

=============================

Nick
iszent.com

24 Feb 2012, 9:07 AM
#5
dgent avatar

dgent

Totally Zenned

Join Date:
Nov 2009
Location:
UK
Posts:
1,117
Plugin Contributions:
0

Re: Facebook Shares bringing up the wrong image from a product

Even simpler way, just add this to html_header.php - basically the same thing as yours.

<meta property="og:title" content="<?php echo META_TAG_TITLE; ?>" /> <meta property="og:type" content="product" /> <meta property="og:site_name" content="<?php echo STORE_NAME; ?>" /> <?php if (isset($_GET['products_id'])) { // use products_image if products_id exists $facebook_image = $db->Execute("select p.products_image from " . TABLE_PRODUCTS . " p where products_id='" . (int)$_GET['products_id'] . "'"); $fb_image = HTTP_SERVER . DIR_WS_CATALOG . DIR_WS_IMAGES . $facebook_image->fields['products_image']; } if ($fb_image == '') { // if no products image, use the default image if enabled $fb_image = 'insert a default image url here'; } if ($fb_image != '') { ?> <meta property="og:image" content="<?php echo $fb_image; ?>" /> <?php } ?>
24 Feb 2012, 9:24 AM
#6
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Facebook Shares bringing up the wrong image from a product

Yeah, that is do-able. My experience says that it is definitely worth putting a FB admin in there if possible. Also, I have had issues in the past with 'product' rather than 'website' but I do know that it should work with 'product'. But you should have an if statement in there so that the pages that are not products are set as 'website' . Those are just things that I have noticed along the way rather than truths. If this works for you great :-)

And yes, I just like putting it in a module because it is neater. But it really doesn't make any difference in the end.

Nick
iszent.com

24 Feb 2012, 9:33 AM
#7
dgent avatar

dgent

Totally Zenned

Join Date:
Nov 2009
Location:
UK
Posts:
1,117
Plugin Contributions:
0

Re: Facebook Shares bringing up the wrong image from a product

niccol:

Yeah, that is do-able. My experience says that it is definitely worth putting a FB admin in there if possible. Also, I have had issues in the past with 'product' rather than 'website' but I do know that it should work with 'product'. But you should have an if statement in there so that the pages that are not products are set as 'website' . Those are just things that I have noticed along the way rather than truths. If this works for you great :-)

And yes, I just like putting it in a module because it is neater. But it really doesn't make any difference in the end.

Sorry yes, I took out the admin incase any one copy/pasted it into their own site.

24 Feb 2012, 9:48 AM
#8
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Facebook Shares bringing up the wrong image from a product

:smile: I made the same mistake. The number in mine is just a random number.

Glad it works for you. It is a good base for adding facebook 'like' buttons and also pinterest buttons which both use og-tags if they are in place.

Nick
iszent.com

2 Dec 2014, 11:02 PM
#9
khwateoh avatar

khwateoh

New Zenner

Join Date:
Dec 2005
Location:
Malaysia
Posts:
28
Plugin Contributions:
0

Re: Facebook Shares bringing up the wrong image from a product

niccol:

:smile: I made the same mistake. The number in mine is just a random number.

Glad it works for you. It is a good base for adding facebook 'like' buttons and also pinterest buttons which both use og-tags if they are in place.

dear,
refer to the above , i still get the randam picture in facebooks.
my website
https://www.allabouthealth.com.my
some can help me in this ??

thks