Add a Facebook Like Button to Your Product Pages

If you are not already aggressively marketing your business on Facebook you should be. According to Digitaltrends.com Facebook has over 25% of internet traffic in the U.S. and is the most downloaded app of all time. In this tutorial, I will show you step by step how to install a Facebook like button into your zen cart product pages so. For demo purposes I will be adding the button to my Andover Modern free zen cart template which you can download here.

1. In your favorite plain text editor open includes/templates/your-custom-template-directory/templates/tpl_product_info_display.php. If the file is not there, create an override for it by copying includes/templates/template_default/templates/tpl_product_info_display.php to includes/templates/your-custom-template-directory/templates/tpl_product_info_display.php.

2. Find the place in the file where you want the button to show and add this code:


<iframe src="https://www.facebook.com/plugins/like.php?href=<?php echo urlencode(zen_href_link(zen_get_info_page((int)$_GET['products_id']),'cPath='.$_GET['cPath'].'&products_id=' . (int)$_GET['products_id'])); ?>&layout=standard&show_faces=false&width=450&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:40px"></iframe>

I think that the best place to put it is under the product title. If you want to add your Facebook Like button under the product title, add the like button code directly after this:


<!--bof Product Name-->
<h1 id="productName" class="productGeneral"><?php echo $products_name; ?></h1>
<!--eof Product Name-->

Save the file.

***This is a php file and MUST be edited in a plain text editor. If you try to edit this file in any type of wysiwyg editor, the code will be corrupted and when you insert the file back into your zen cart it will break your entire site.***

Go to one of your product pages and refresh your browser to see the new like button.

If you need help customizing your zen cart web site, or would like a great custom design, please contact us for a quote.

equation