Jump to content

Facebook - a More Complete Picture


Recommended Posts

Would someone who has a Facebook account or has acquired a Facebook Platform Application ID for their site, help with this experiment.


Create a file called opengraph.html and for its contents:

<meta property="og:title" content="{$PRODUCT.seo_meta_title}"><!-- - Maybe $META_TITLE - The title of the entity.-->
<meta property="og:type" content="article"><!-- - The type of entity. You must select a type from the list of Open Graph types. -->
<meta property="og:image" content="{$PRODUCT.thumbnail}"><!-- - The URL to an image that represents the entity. Images must be at least 50 pixels by 50 pixels (though minimum 200px by 200px is preferred). Square images work best, but you are allowed to use images up to three times as wide as they are tall. -->
<meta property="og:url" content="{$VAL_SELF}"><!-- - The canonical, permanent URL of the page representing the entity. When you use Open Graph tags, the Like button posts a link to the og:url instead of the URL in the Like button code. -->
<meta property="og:site_name" content="{$CONFIG.store_name}"><!-- - A human-readable name for your site, e.g., "IMDb". -->
<meta property="fb:admins" or "fb:app_id" content="???"><!-- - A comma-separated list of either the Facebook IDs of page administrators or a Facebook Platform application ID. At a minimum, include only your own Facebook ID. -->

Choose "fb:admins" and enter the Facebook ID of an admin for the content value, or choose "fb:app_id" and enter the platform app number for the content value.


Save the file in the /js/ folder found in the root folder of your store.


Edit the template file main.php as follows:

<html xmlns="http://www.w3.org/1999/xhtml" dir="{$TEXT_DIRECTION}" lang="{$HTML_LANG}
{include file='js/opengraph.html'}

The point of this experiment is to correct what an individual has posted in the bug tracker, namely, when clicking a LIKE button, there is an thumbnail image seen in the flyout box. The image used by the Facebook LIKE button javascript routine is seemingly chosen randomly from all the <img> tags found on the page. This experiment is supposed to fix the image used to that of the thumbnail of the actual product.


Link to comment
Share on other sites

I was working on this last week and this is just enough to add to the main.php header section (some peeps are using og:image only)


<meta property="og:image" content="{$PRODUCT.thumbnail}">
<meta property="og:url" content="{$VAL_SELF}">


New products LIKE button works well a proper image is used (does not matter image gallery there) but the older ones already LIKED don't as Facebook keeps results cached/recorded (URL and image). That means image wont change in the same URL instead if og;image URL. I have read somewhere FB rebuilds cache/records but I didn't noticed this may be more independent LIKE clicks required.


Final code looks similar it will be in next release available.

Link to comment
Share on other sites

  • 1 year later...

Is it possible to Share a product and combine comments from a shared product with the Comments social plugin from FB?


Reason being, to avoid comments being diluted in different places.



* liked post gets 5 comments

* comments box gets 5 comments


If both are combined, we're on to double figures.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...