After being asked by a client to add a Like button to each of her products (like ASOS) and getting confused by Facebook’s documentation on adding custom Like buttons, I stumbled upon this excellent post for how to do it in WordPress:
I have adapted it to work with ZenCart
1) Register for an application with Facebook – write down your application ID and your Admin id (see the HyperArts post for a good explanation)
(BTW I had a blank screen problem after creating an application – but the app was there when I went to my applications home page in Facebook)
2) Add the following into your html header – change your html tag to read:
3) Add the following meta tags
4) The Like button should live somewhere on the tpl_product_info_display.php template
I’m aware that as a newbie I’ve probably made a few errors along the way but it seems to work for now. Any comments would be appreciated!
Here’s the example at work:
UPDATE: 28th Aug 2010
While the code above was working I was getting the annoying problem with a random product image (eg one of the additional images) appearing next to the shared link on facebook – and not the main product image.
This might not be a problem for Zen Carts that only have the one product image – but it needed to be fixed.
Cue time to delve into the inner workings of Zen Cart:
1) Modify the includes\modules\meta_tags.php file:
The SQL SELECT statement around line 210 needs an additional field adding in the list;
Then about line 225 I have the following line:
Then at line 296 I add a new line to define a new variable called META_TAG_PRODUCT_IMAGE
2) Modify the html_header.php template as above by adding the following line: