888-978-4030

Facebook "Like" Button

By ecomm | Published August 4, 2010

fb-like-button** check out the new Yahoo! social network plugin at Social Share** Social networking is big. If this is news to you, come out from the rock you live under and join the fun on the  ”interwebs”. I am going to show you how to add a Facebook Like button to your store with RTML code.  This button will have the item page URL built into it so everyone’s friends can see what they liked. The goal of this is to bring in new customers, and I hope that it helps your Yahoo! store.

I will show you how to add it right under the headline just like the above image. We will start by finding the Yhst-#######-image-and-text template.  On that template we need to look for this code:

  1. DIV id mainid
  2.   WHEN AND
  3.          NONEMPTY header
  4.          POSITION element :display-text-title
  5.                   sequence headel
  6.     TAG class WHEN AND
  7.                      EQUALS value1 align
  8.                             value2 :center
  9.                      NOT CALL :yhst-16600815412482-has-price
  10.                 "contenttitle-center"
  11.         id headerid
  12.         tag "h1"
  13.       TEXT header

The top of the template should appear as above.  I would like you to click on the “TAG” operator.  Once it is black, click on  ”new” at the top, from there we will find the “WHEN” operator and hit “Create,” then “paste after” so it should look like this:

  1. TAG class WHEN AND
  2.                      EQUALS value1 align
  3.                             value2 :center
  4.                      NOT CALL :yhst-16600815412482-has-price
  5.                 "contenttitle-center"
  6.         id headerid
  7.         tag "h1"
  8.       TEXT header
  9.     WHEN nil

Now click on “nil” and hit “new”, then find the CALL op and hit create again.  From there hit “replace” and should now see

WHEN CALL

Now click on “CALL” and hit edit, then add this text without the quotes “:has-price.”  It should look like

WHEN CALL :has-price.

Now for the Meat of the like button, click on “WHEN,” hit  ”new” and find “TEXT,” then “create.”  You will need to paste that within the “WHEN” op. We will now add the facebook code and you will need to edit this for your domain:

  1. "<div id=\"fb-root\"></div><script language=\"javascript\">if(runInitFB) {window.fbAsyncInit = function() {FB.init({appId: \"25966453290\",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 class=\"fbDiv\"><fb:like show_faces=’false’ layout=’standard’ width=’300px’ href=’http://YOURDOMAIN.COM/"

Now lets build the item URL, click new and “TEXT” then click on the “nil” of the TEXT op click new and select “AS-STRING” and replace the “nil” from there click on “edit” and type “id” without quotes, from there we need to click the new again and find “Text” and we will need to paste that after the last “TEXT” op. Now we will finish up the code with the closing of all the tags. click edit and add this with quotes ".html'&gt;&lt;/fb:like&gt;&lt;/div&gt;"

and the template as a whole should look like…

  1. DIV id mainid
  2.   WHEN AND
  3.          NONEMPTY header
  4.          POSITION element :display-text-title
  5.                   sequence headel
  6.     TAG class WHEN AND
  7.                      EQUALS value1 align
  8.                             value2 :center
  9.                      NOT CALL :yhst-16600815412482-has-price
  10.                 "contenttitle-center"
  11.         id headerid
  12.         tag "h1"
  13.       TEXT header
  14.     WHEN CALL :has-price.
  15.       TEXT
  16.  
  17. "<div id=\"fb-root\"></div><script language=\"javascript\">if(runInitFB) {window.fbAsyncInit = function() {FB.init({appId: \"25966453290\",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 class=\"fbDiv\"><fb:like show_faces=’false’ layout=’standard’ width=’300px’ href=’http://YOURDOMAIN.COM/"
  18.  
  19.       TEXT AS-STRING id
  20.       TEXT
  21.  
  22. ".html’></fb:like></div>"
  23.  
  24.   WHEN OR
  25.          NONEMPTY @code
  26.          CALL :yhst-16600815412482-has-price
  27.     CALL :yhst-16600815412482-display-item
  28.       align
  29.       headel
  30.       imgclass
  31.   WHEN OR
  32.          NONEMPTY text
  33.          image
  34.     CALL :yhst-16600815412482-display-paras
  35.       textid
  36.       text
  37.       image
  38.       h
  39.       w
  40.       align
  41.       area
  42.       headel
  43.       imgclass
  44.     LINEBREAK clear :all

some of the code is not 100% right and that is how it will line up on the blog. when copied and pasted into the RTML it will work right. If you have any issues post in the comments

This article was posted in Code, HTML, RTML, Yahoo store and tagged , , , , . Bookmark the permalink. Follow comments with the RSS feed for this post.Trackbacks are closed, but you can Post a Comment.

2 Comments

Jim Bunger

Posted October 19, 2010 at 9:41 pm | Permalink

ok I am a little new to all of this rtml but when I followed this I get a jscript error that ‘runInitFB’ is undefined. I contacted yahoo to have them add the FB information to my doc type but i am not sure that that will fix it. ay ideas what I maight be doing wrong?

    drifterz28

    Posted October 26, 2010 at 6:38 pm | Permalink

    it is not your doc type but part of the javascript code. Keep in mind that with RTML you are chopping up the javascript to add the RTML elements that will add the needed content.

You must log in to post a comment.