Implementation of the Facebook Like button on each product page

I have just implemented this for Facebook and I have a quick question. Should this update the main page in Facebook? Or just the users page? I see in my news stream where I posted I Like the product, but nothing shows up on the Main Page.



Any help is appreciated.

Hello All,



Thank you for your help.



1 - First of all, you need to go to this page to use the configurator to select the look and feel you want and to get code to add to your site:



[url]http://developers.facebook.com/docs/reference/plugins/like[/url]



2 - Here is the product URL in CS-Cart 2.1.2, of course, change “YOURWEBSITE.COM” with your real website URL!:


http://YOURWEBSITE.COM{"products.view?product_id=`$product.product_id`"|fn_url}
```<br />
<br />
3 - No need to jeopardize your meta tags or anything else in your header "index.tpl" it works fine without, in standalone!<br />
<br />
4 - Here is my own code, of course, change "YOURWEBSITE.COM" with your real website URL!:<br />
<br />
```php
<iframe src="http://www.facebook.com/plugins/like.php?href=http://YOURWEBSITE.COM{"products.view?product_id=`$product.product_id`"|fn_url}&layout=box_count&show_faces=true&width=120&action=recommend&colorscheme=light&height=65" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:120px; height:65px;" allowTransparency="true"></iframe>
```<br />
<br />
5 - I pasted it on line 19 of "default_template.tpl" to have my "Like" Facebook button under the product image:<br />
<br />
[QUOTE]\skins\[YourSkin]\customer\blocks\product_templates\default_template.tpl[/QUOTE]<br />
<br />
![](upload://8KjfQMmX1HhXDuR2absDZvUrCRC.jpeg)<br />
<br />
That's all folk's!<br />
<br />
<br />
Lee Li Pop

Hello Lee,



I have Cs-Cart 2.0.7 but I can’t find the default_template.tpl file that you mention,



I don’t have the “product_templates” folder in this folder "\skins[YourSkin]\customer\blocks"



Can you give me any advice?



best regards, Orlando.

Hello Orodriguez,



Sorry, I never used CS-Cart 2.0.7.



Another strange thing is I have no more the upgrading release 2.0.8 on my Help desk…



However, you can find easily which file is in using AgentRansack



[url]http://www.mythicsoft.com/page.aspx?type=agentransack&page=home[/url]



1 - File name: *.tpl

2 - Containing text: (what you looking for, example “
3 - Full path to your developing directory (example: C:\wamp\www\CSCART\skins[YourSkin]\customer)



4 - Open the first file and write somewhere near header and NOT in a conditional assessment “1234”

5 - Clean your cash if needed

6 - Refresh your page product in your browser

7 - Looking for “1234” sentence in your page product



8 - Redo points 4 to 7 until you find the good template





Lee Li Pop

All we did was add a block on the products page and add the code to this block.



We used the code from facebooks page

[url]http://developers.facebook.com/plugins[/url]


[QUOTE]Share[/QUOTE]



This adds the like button to ALL our products.

[quote name=‘Lee Li Pop’]5 - I pasted it on line 19 of “default_template.tpl” to have my “Like” Facebook button under the product image:

[/QUOTE]



Hello Lee Li Pop,



Thank you for the information! Could you please post a snippet of the surrounding code? It would make it easier to see exactly where the new code should go. I pasted on line 19 and the button shows up above the product name.



Found it:


{if !$no_images}

{include file="views/products/components/product_images.tpl" product=$product show_detailed_link="Y"}


{/if}

Hello Tom,



Here the [COLOR=“Red”]Original[/COLOR] file:


[QUOTE]\skins[YourSkin]\customer\blocks\product_templates\default_template.tpl[/QUOTE]


```php

{script src=“js/exceptions.js”}



{hook name="products:view_main_info"}

{if $product}
{assign var="obj_id" value=$product.product_id}
{include file="common_templates/product_data.tpl" product=$product}
{assign var="form_open" value="form_open_`$obj_id`"}
{$smarty.capture.$form_open}

{if !$no_images}

{include file="views/products/components/product_images.tpl" product=$product show_detailed_link="Y"}

{/if}

```

Here is my release:

```php
{script src="js/exceptions.js"}


{hook name="products:view_main_info"}

{if $product}
{assign var="obj_id" value=$product.product_id}
{include file="common_templates/product_data.tpl" product=$product}
{assign var="form_open" value="form_open_`$obj_id`"}
{$smarty.capture.$form_open}

{if !$no_images}

{include file="views/products/components/product_images.tpl" product=$product show_detailed_link="Y"}




{/if}


```

*****

[quote name='CutRiteFX']All we did was add a block on the products page and add the code to this block.

[QUOTE]Share[/QUOTE]

We used the code from facebooks page
[url]http://developers.facebook.com/plugins[/url]



This adds the like button to ALL our products.[/QUOTE]

You're rigth, however, your solution is for "[B]Share[/B]". More, it calls an external javascript:

[url]http://static.ak.fbcdn.net/connect.php/js/FB.Share[/url]

"Like" button is another without additional javascript.

[QUOTE][/QUOTE]

Both are different, especially (it seems to me, however, I am NOT SURE) "Like" button DOES NOT ask for confirmation, "Share" displays a confirmation box. [B][SIZE="3"]Please try to be sure![/SIZE][/B]

Please, try both and keep the one you prefer... Or both! :D


Lee Li Pop

I found a really cool add this icon that sits on the side of every page of the site. Would anyone know how to implement this. This site has it [url]http://www.atdec.com/[/url] look all the way to the right you will notice a facebook, twitter, and stumble upon me.

[quote name=‘sh1nn3r’]I found a really cool add this icon that sits on the side of every page of the site. Would anyone know how to implement this. This site has it [url]http://www.atdec.com/[/url] look all the way to the right you will notice a facebook, twitter, and stumble upon me.[/QUOTE]



Check this one out… Just tweak the code a little .

Hello All,


[quote name=‘sh1nn3r’]I found a really cool add this icon that sits on the side of every page of the site. Would anyone know how to implement this. This site has it [url]http://www.atdec.com/[/url] look all the way to the right you will notice a facebook, twitter, and stumble upon me.[/QUOTE]


[quote name=‘nathand’]Check this one out… Just tweak the code a little .[/QUOTE]



Please, find answer here:



[url]http://forum.cs-cart.com/showthread.php?p=103158#post103158[/url]





Lee Li Pop

Hi Guys,



I implemented the facebook like button, but for reason now the site is using lots of resources, the server memory is at its maximum.



Can you guys think of any reason for this?



best regards, Orlando.

Hello Orlando,


[quote name=‘orodriguez’]Hi Guys,



I implemented the facebook like button, but for reason now the site is using lots of resources, the server memory is at its maximum.



Can you guys think of any reason for this?



best regards, Orlando.[/QUOTE]



Please, give us more details, because there are three ways of implementation:



*****



First implementation WITH meta and WITH


[url]http://forum.cs-cart.com/showthread.php?p=83637#post83637[/url]



*****



Second implementation WITHOUT meta and WITHOUT


[url]http://forum.cs-cart.com/showthread.php?p=102067#post102067[/url]



*****



Third implementation of a “Share” button in this post by CutRiteFX:



[url]http://forum.cs-cart.com/showthread.php?p=102190#post102190[/url]



*****



Please Orlando, try these three implementations, one by one, and tell us your server resources, with the First, the Second and the Third implementation.



Thank you,







Lee Li Pop

Here is where I found the info to add this to a fixed position to your page.



[url]http://www.addthis.com/forum/viewtopic.php?f=3&t=27635[/url]



I liked this idea and what we did was add



I created a directory in our images dir called social and placed the images there.

index.tpl

```php




Share to Facebook

Share to Twitter
Stumble It
More...



```

Then added this to styles.css
```php /* Fixed Positioned AddThis Toolbox */

.addthis_toolbox.atfixed {
position: fixed;
top: 38%;
left: 95%;
padding: 0px;
width: 32px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}

.addthis_toolbox .custom_images a {
width: 32px;
height: 32px;
margin: 0;
padding: 0;
cursor: pointer;
}

.addthis_toolbox .custom_images a img { border: 0; margin: 0px; opacity: 0.50; }

.addthis_toolbox .custom_images a:hover img { margin: 0px; opacity: 1.00; } ```


You will notice that it says
top: 38%;
left: 95%;

This is where you change the position of the buttons. :-)

Very sorry to drag up a very very old thread, however I have tried adding this code to our site. That works very well however when I press “iLike” the button only “likes” the root url NOT the product page. IE I can never just like a single product, instead it likes the root website.



Has anyone got any ideas how I can choose code to like specific products to facebook?



Regards

[quote name=‘AmitP’]Very sorry to drag up a very very old thread, however I have tried adding this code to our site. That works very well however when I press “iLike” the button only “likes” the root url NOT the product page. IE I can never just like a single product, instead it likes the root website.



Has anyone got any ideas how I can choose code to like specific products to facebook?



Regards[/QUOTE]



I am using the following code on each product page and it works:


[QUOTE]

[/QUOTE]

I just tried this code on my website in default_template and it is only sending the root url to facebook www.mywebsite.co.uk, would be good to send the product the user is currently looking at. :frowning:



Regards

Please AmitP, dry your tears and publish your complete code. We will be able to advice you of our best.





Lee Li Pop

Hello Guyrotberg,



Congratulations for your Facebook page!



[url]http://www.facebook.com/karmakiss[/url]



Especially your Facebook shop :!:



I didn’t know Payvment:



[url]http://www.payvment.com/facebook/[/url]



Perfect, you become my model reference in Facebook integration.



Thank you!





Lee Li Pop

[quote name=‘Lee Li Pop’]Hello Guyrotberg,



Congratulations for your Facebook page!



[url]http://www.facebook.com/karmakiss[/url]



Especially your Facebook shop :!:



I didn’t know Payvment:



[url]http://www.payvment.com/facebook/[/url]



Perfect, you become my model reference in Facebook integration.



Thank you!





Lee Li Pop[/QUOTE]



Thanks Lee Li Pop!

Well, you have been my model for many other stuff here (especially the optimization posts…



As for my Facebook page - it is still in its infancy and I am working when I can to improve it and to add more products to Payvment.

Thank you for all your help with this, I finally have the correct thing posting to peoples facebook pages however I have a massive amount of White Space that I would like to get rid of and do not know how to and would really like some help with this if at all possible. I am guessing that it is because it is an iframe.



Thank you for your help