adding product specific info into <head> tags on product pages for facebook

**donplay** · 27 Nov 2009, 10:57 PM

Hi,

I'm trying to add product specific code into my <head> tag so thumbnails show up when product pages are are shared on facebook. Based on following the instructions from facebook (http://wiki.developers.facebook.com/...and_Thumbnails) and this related thread (
http://www.zen-cart.com/forum/showthread.php?t=137585
) I'm trying to add the following code to the page [FONT=Arial][/FONT]/includes/templates/gargyle/common/html_header.php but the URL gets chopped off before the product name.

<link rel="image_src" href="<?php echo "http://" . $_SERVER['HTTP_HOST'] . "/shop/" . $products_image_medium; ?>"/>

I guess that page doesn't know what $products_image_medium is. Does someone know how I need to edit html_header.php so that the $products_image_medium value can be populated in the header correctly, and that line will show up ONLY for product pages?

Appreciate any help...

thanks,
Don

**DrByte** · 28 Nov 2009, 08:10 AM

It's actually pretty simple.

Put your html_header.php file back to how it was before you started trying this.

Then create the following file with the following content:
/includes/modules/pages/product_info/jscript_fbimage.php

Code:

<?php
  /**
   * Add "image_src" link to <head> section for current product's image
   */
  $sql = "select p.products_id, p.products_image
           from   " . TABLE_PRODUCTS . " p
           where  p.products_status = '1'
           and    p.products_id = '" . (int)$_GET['products_id'] . "'";
  $product_info = $db->Execute($sql);

  $products_image = $product_info->fields['products_image'];
  if ($products_image == '' and PRODUCTS_IMAGE_NO_IMAGE_STATUS == '1') {
    $products_image = PRODUCTS_IMAGE_NO_IMAGE;
  }
  if ($products_image != '') {
    require(DIR_WS_MODULES . zen_get_module_directory(FILENAME_MAIN_PRODUCT_IMAGE));
?>
<link rel="image_src" href="<?php echo HTTP_SERVER . DIR_WS_CATALOG . $products_image_medium; ?>" />
<?php  }

That's it!

**donplay** · 28 Nov 2009, 11:06 PM

Hi DrByte,

Thanks for your feedback. I tried creating that file on my test server but the "image_src" code isn't showing up on the product page (link here). I'm not sure if I'm getting conflicts with another module I have installed...maybe CSS - Javascript loader (CJ Loader).

wiki.rubikintegration.com/zencart/modules/css_javascript_loader/about

Aside from that I'm not sure what might be wrong...I cut and pasted from your post and created the file as directed but no luck with the code in the <head> tag.

Appreciate any thoughts you might have.

thanks,
Don

**DrByte** · 28 Nov 2009, 11:27 PM

Originally Posted by donplay

I tried creating that file on my test server but the "image_src" code isn't showing up on the product page (link here).

Well, the code I posted was a copy-and-paste from after I actually tested it to confirm that it did as intended.
Granted, I didn't test it on a site that has been as heavily modified as yours, including so-called "SEO" URLs etc.

Originally Posted by donplay

I'm not sure if I'm getting conflicts with another module I have installed...maybe CSS - Javascript loader (CJ Loader).

wiki.rubikintegration.com/zencart/modules/css_javascript_loader/about

Maybe. Ask *them* about that.

**donplay** · 29 Nov 2009, 12:23 AM

Hi DrByte,

Thanks for the reply...understood. I turned off the SSU (SEO) module and the issue was still there. I'll keep digging...thanks for your help.

-Don

**issy** · 5 Dec 2009, 06:23 PM

This is what I did on my site, it's the medium size images and they look good on my facebook profile.

1- I pasted the following code before </head> on my html_header.php and saved.

<script> function fbs_click() { u=location.href; t=document.title; window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),' sharer', 'toolbar=0, status=0, width=626, height=436'); return false; } </script>

2- I pasted the following code after  on my tpl_product_info_display.php and saved.


<link rel="image_src" href="<?php echo "http://" . $_SERVER['HTTP_HOST'] . "/" . $products_image_medium; ?>"/>
<script>function fbs_click() {u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolb ar=0,status=0,width=626,height=436');return false;}</script><style> html .fb_share_link { padding:2px 0 0 20px; height:16px; background:url(http://b.static.ak.fbcdn.net/rsrc.ph...h/4273uaqa.gif) no-repeat top left; }</style><a href="http://www.facebook.com/share.php?u=<?php echo "http://" . $_SERVER['HTTP_HOST'] . $_SERVER['PHP_SELF'] . "?" . $_SERVER['QUERY_STRING'];?>" onclick="return fbs_click()" target="_blank" class="fb_share_link">Share <strong><?php echo $products_name; ?></strong> on Facebook</a>
<br class="clearBoth" />


3- Uploaded files to server and it worked out of the box for me, this is on a live site!! :).

Hope that helps some one.

Happy coding...

**ngeorg22** · 18 Dec 2009, 08:54 AM

Thank you for the valuable info. I did all this and was able to share my products on my facebook page. My main problem though is that product images do no appear in facebook. Am I missing something?

**ngeorg22** · 18 Dec 2009, 09:07 AM

For some curious reason I tried your suggestion second. And it worked for me. Thank you so much!

**PointSilver** · 13 Jan 2010, 11:05 PM

This works... some of the code is invalid, but no big deal... something about ampersands etc.

Originally Posted by issy

This is what I did on my site, it's the medium size images and they look good on my facebook profile.

1- I pasted the following code before </head> on my html_header.php and saved.

<script> function fbs_click() { u=location.href; t=document.title; window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),' sharer', 'toolbar=0, status=0, width=626, height=436'); return false; } </script>

2- I pasted the following code after  on my tpl_product_info_display.php and saved.


<link rel="image_src" href="<?php echo "http://" . $_SERVER['HTTP_HOST'] . "/" . $products_image_medium; ?>"/>
<script>function fbs_click() {u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolb ar=0,status=0,width=626,height=436');return false;}</script><style> html .fb_share_link { padding:2px 0 0 20px; height:16px; background:url(http://b.static.ak.fbcdn.net/rsrc.ph...h/4273uaqa.gif) no-repeat top left; }</style><a href="http://www.facebook.com/share.php?u=<?php echo "http://" . $_SERVER['HTTP_HOST'] . $_SERVER['PHP_SELF'] . "?" . $_SERVER['QUERY_STRING'];?>" onclick="return fbs_click()" target="_blank" class="fb_share_link">Share <strong><?php echo $products_name; ?></strong> on Facebook</a>
<br class="clearBoth" />


3- Uploaded files to server and it worked out of the box for me, this is on a live site!! :).

Hope that helps some one.

Happy coding...

**khopek** · 17 Feb 2010, 01:34 PM

Hmmm, now the question is...Is there a solution for addThis, to get it to send the product image url to Facebook? I'm using addThis for all my bookmarking and it is currently just grabbing images from my left column!

@pointsilver, validation errors regarding ampersands simply mean that you have '&' in the code that should be converted to '&'

Thread: adding product specific info into <head> tags on product pages for facebook

Thread Tools

Search Thread

Display

adding product specific info into <head> tags on product pages for facebook

Re: adding product specific info into <head> tags on product pages for facebook

Re: adding product specific info into <head> tags on product pages for facebook

Re: adding product specific info into <head> tags on product pages for facebook

Re: adding product specific info into <head> tags on product pages for facebook

Re: adding product specific info into <head> tags on product pages for facebook

Re: adding product specific info into <head> tags on product pages for facebook

Re: adding product specific info into <head> tags on product pages for facebook

Re: adding product specific info into <head> tags on product pages for facebook

Re: adding product specific info into <head> tags on product pages for facebook

Similar Threads

v151 Head's tags goes into body tag.

My mod requires I add info between the <head> </head> and<body> </body> tags. How?

inserting links in specific product info pages

Unwanted space at head of product info pages

Inserting forms into product Info pages

Bookmarks

Bookmarks

Posting Permissions