How to Add Facebook 'like' button to every product page

05-03-2010, 10:14 AM

first, add xmlns:fb="http://www.facebook.com/2008/fbml" to your xmlpackage like this.....

Code:

<PackageTransform>

        <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:aspdnsf="urn:aspdnsf" exclude-result-prefixes="aspdnsf" xmlns:fb="http://www.facebook.com/2008/fbml">

second, create a product link variable....

Code:

<xsl:param name="pLink" select="aspdnsf:ProductLink(ProductID, SEName, 0)" />

third, add this code where you want the "like" button to show up. change the width if needed and of course hard code your root domain....

Code:

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({appId: 'your app id', status: true, cookie: true,
             xfbml: true});
  };
  (function() {
    var e = document.createElement('script'); e.async = true;
    e.src = document.location.protocol +
      '//connect.facebook.net/en_US/all.js';
    document.getElementById('fb-root').appendChild(e);
  }());
</script>

<div style="padding:25px 0 0 0;" align="left">
<fb:like href="http://www.pinupshoes.com/{$pLink}" layout="standard" show_faces="false" width="300" action="like" font="arial" colorscheme="light"></fb:like>
</div>

you can see this in action here:
http://www.toofastonline.com/p-10243...mini-tube.aspx

07-11-2010, 02:52 AM

This is gold! Thank you very much!

07-16-2010, 03:45 AM

Can you please tell which xmlpackage do i need to modify for this functionality?

07-27-2010, 11:06 AM

That would go in the XML package(s) you're using for product display. Check the 'Display Format XML Package' attribute for your products in the admin site.

08-10-2010, 09:32 PM

When I add the second step:

HTML Code:

<xsl:param name="pLink" select="aspdnsf:ProductLink(ProductID, SEName, 0)" />

I also tried

HTML Code:

<xsl:param name="pLink" select="aspdnsf:ProductLink(ProductID, SEName, '',0)" />

Any ideas?

I get error message:

Message:Error Calling XSLTExtension Function ProductLink: Invalid value specified for ProductID ()
Stack Trace:
at AspDotNetStorefrontCore.InputValidator.ReportError (String ParamName, String ParamValue)
at AspDotNetStorefrontCore.InputValidator.ValidateInt (String ParamName, String ParamValue)
at AspDotNetStorefrontCore.XSLTExtensionBase.ProductL ink(String sProductID, String sSEName, String sIncludeATag, String sTagInnerText, String sJustProductPage)
at AspDotNetStorefrontCore.XSLTExtensionBase.ProductL ink(String sProductID, String sSEName, String sIncludeATag, String sTagInnerText)

09-02-2010, 04:13 AM

The above instructions don't appear to work. If I embed the <fb:Like> tag in the XML package, nothing displays. If I use the Production page to place it an Extension area. It works fine in all browsers but IE. Any suggestions?

11-12-2010, 06:24 AM

Originally Posted by Toadkillerdg

The above instructions don't appear to work. If I embed the <fb:Like> tag in the XML package, nothing displays. If I use the Production page to place it an Extension area. It works fine in all browsers but IE. Any suggestions?

I had the same issue. The fix I found was the order of the name sapce in the stylesheet tag.

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:aspdnsf="urn:aspdnsf" exclude-result-prefixes="aspdnsf" xmlns:fb="http://www.facebook.com/2008/fbml">

If I put the xmlns:fb last in this order, it worked. If I put it first, nothing showed up. Not sure, but works for me now. Maybe this will work for you also.

11-24-2010, 08:20 PM

After following these suggestions my rendered page contains the FB code in the source but nothing is displayed on the page in IE.

I just created a table at the bottom of the XHTML and inserted the FB code. To ensure plain text would render, I added a comment to the table which renders just fine.

Any suggestions?

11-30-2010, 10:57 PM

I can't get it to work in IE, either. Chrome and Firefox seem to work fine, so far.

12-04-2010, 07:07 AM

This is an example of FF and Chrome being more forgiving than IE.

You will need to add

C#/VB.NET Code:


xmlns:fb="http://www.facebook.com/2008/fbml"

to your first html tag.

so that it reads

C#/VB.NET Code:


<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" >

Depending on what version of ASPDNSF you are using you would make the change in template.ascx or template.master.

Chaz.

03-10-2011, 10:31 AM

Do you need the source code to do this?

03-10-2011, 02:24 PM

No, source code is not needed.

BTW, there's an add-on for that ;-) http://www.ecommercecartmods.com/p-8...torefront.aspx

And even more important for Facebook commerce exposure, the Facebook Commerce Shop tab/app! http://www.ecommercecartmods.com/p-9...torefront.aspx

03-19-2011, 11:33 AM

Originally Posted by jsimacek

No, source code is not needed.

BTW, there's an add-on for that ;-) http://www.ecommercecartmods.com/p-8...torefront.aspx

And even more important for Facebook commerce exposure, the Facebook Commerce Shop tab/app! http://www.ecommercecartmods.com/p-9...torefront.aspx

Has anyone out there used either the "Like" and/or ecommerce package? How well has the Facebook commerce exposure worked; i.e., is it worth the investment?

03-21-2011, 03:58 PM

Until some “real” clients reply

, I thought I’d go ahead and answer your questions about Facebook commerce:
1) Yes, there are clients using the Facebook commerce solution. A couple of them have posted their feedback here: http://forums.aspdotnetstorefront.co...ebook+commerce

Here is a partial list of clients using our Facebook commerce solution: http://ecommercecartmods.com/t-Faceb...erceDemos.aspx

2) Good question, I’m sure it’s one that crosses everyone’s mind – “is it worth the investment?”
Since the app can serve many purposes, and add value in different ways, it all depends on what you are trying to achieve. For example, one of our clients sells concert/event tickets and uses the shopping app as their FB landing page to deliver dynamic content. Their fans are able to see the latest concert ticket offerings, webcasts, and newest announcements. All this content is fed directly from their storefront in real-time (no data feeds required). For this client, publishing a product on their storefront causes the new content to be published on FB, informs FB visitors of new events, and gives them a call to action (making a purchase).

Based on client feedback, the app has increased traffic to their website. One of our clients has reported Facebook to be their second highest source of web traffic. Another client is receiving nearly 1,300 users a month.

Here is an interesting article about generating sales with Facebook:
http://www.allfacebook.com/facebook-...funnel-2009-06
Interesting article about Facebook e-commerce
http://www.businessinsider.com/faceb...rove-it-2011-3

Social commerce is a new and growing trend with a lot of potential. Some e-commerce solutions are including a FB shop integration as a standard feature.

05-11-2011, 11:31 AM

Originally Posted by Brian3434

I get error message:

Message:Error Calling XSLTExtension Function ProductLink: Invalid value specified for ProductID ()
Stack Trace:
at AspDotNetStorefrontCore.InputValidator.ReportError (String ParamName, String ParamValue)
at AspDotNetStorefrontCore.InputValidator.ValidateInt (String ParamName, String ParamValue)
at AspDotNetStorefrontCore.XSLTExtensionBase.ProductL ink(String sProductID, String sSEName, String sIncludeATag, String sTagInnerText, String sJustProductPage)
at AspDotNetStorefrontCore.XSLTExtensionBase.ProductL ink(String sProductID, String sSEName, String sIncludeATag, String sTagInnerText)

Haven't seen a follow up to this issue. I've experienced the same & not having luck correcting the problem. Any help?

05-13-2011, 07:02 AM

Did you ever get this problem solved? I am getting the same error.

Code:

Message:Error Calling XSLTExtension Function ProductLink: Invalid value specified for ProductID ()

Originally Posted by Brian3434

When I add the second step:

HTML Code:

<xsl:param name="pLink" select="aspdnsf:ProductLink(ProductID, SEName, 0)" />

I also tried

HTML Code:

<xsl:param name="pLink" select="aspdnsf:ProductLink(ProductID, SEName, '',0)" />

Any ideas?

I get error message:

Message:Error Calling XSLTExtension Function ProductLink: Invalid value specified for ProductID ()
Stack Trace:
at AspDotNetStorefrontCore.InputValidator.ReportError (String ParamName, String ParamValue)
at AspDotNetStorefrontCore.InputValidator.ValidateInt (String ParamName, String ParamValue)
at AspDotNetStorefrontCore.XSLTExtensionBase.ProductL ink(String sProductID, String sSEName, String sIncludeATag, String sTagInnerText, String sJustProductPage)
at AspDotNetStorefrontCore.XSLTExtensionBase.ProductL ink(String sProductID, String sSEName, String sIncludeATag, String sTagInnerText)

05-13-2011, 09:51 AM

Have you tried following this guide?

TTFN

BFG

05-18-2011, 08:35 AM

Originally Posted by macecase

Did you ever get this problem solved? I am getting the same error.

Location seemed to be the issue. Putting the product link variable & code after <xsl:template match="Product"> made the difference for us.

Though I've started playing with the other package linked here by BFG 9000. Would much rather have a thumbnail image & cleaner title show up on FB.

05-23-2011, 09:46 AM

Anyone having problems with the incorrect image being pulled from the site once you like the page ? When I like the page, it pulls the product fine, but uses a different image from somewhere else on the page rather than the product. Anyone know a fix for this ?

05-23-2011, 12:02 PM

Originally Posted by joecalardo

Anyone having problems with the incorrect image being pulled from the site once you like the page ? When I like the page, it pulls the product fine, but uses a different image from somewhere else on the page rather than the product. Anyone know a fix for this ?

Yup - you need to specify the image in the og tags : http://forums.aspdotnetstorefront.co...read.php?30658

TTFN

BFG

06-10-2011, 12:23 AM

but it worked like a champ! Thanks for the code.

08-11-2011, 12:23 PM

the manual recommends against using ProductLink - the easier way to get it is:

Code:

<xsl:param name="pLink" select="concat(/root/System/StoreUrl, /root/System/PageName)" />

08-18-2011, 04:36 PM

Originally Posted by don.irwin

the manual recommends against using ProductLink - the easier way to get it is:

Code:

<xsl:param name="pLink" select="concat(/root/System/StoreUrl, /root/System/PageName)" />

This doesn't work for me. I end up with a URL like this:

"https://www.mydomain.com/showproduct.aspx"

Any idea why I am not getting the actual product page here?

08-18-2011, 08:30 PM

sorry - I'm using URL rewriting with showproduct.aspx being rewritten with the following rule:

Code:

<add name="Product" url="p-{ProductID}-{SEName}" virtualPath="~/showproduct.aspx" checkPhysicalUrlAccess="false" />

so /root/System/PageName = "p-12-some-product"

If you aren't using url rewriting, you'll have to use one of the previously mentioned methods for getting the URL - to see what is being returned, set debug="true" in the XML package and review the XML data returned (should be 2nd textbox.).

09-22-2011, 07:48 AM

What do I need for the appId: 'your app id'

12-19-2012, 10:57 PM

I found a blog where this topic [facebook like button integration] nicely explained. For more information you can visit, http://developers.facebook.com/docs/.../plugins/like/

12-19-2012, 11:19 PM

You found a blog?

That blog just happens to be on a domain that matches your username?

Smells like spam to me...

TTFN

BFG

Thread: How to Add Facebook 'like' button to every product page

How to Add Facebook 'like' button to every product page

Doesn't work in IE

Not displaying on screen

Facebook Commerce For AspDotNetStoreFront

Took a little tweaking...

What is the appId: 'your app id'