Add-On Releases - Add Facebook "Like" button to your threads [vB 3.8.x]

This mod is based on this, but working on vB 3.8.x.

As was said there: Facebook has just launched their latest "Like" button to developers to use on any site. What this does is utilizes the Advertising module to add the "Like" button to the first post of each thread. Please see screenshots to get an idea.

DEMO

IFrame Method

There is two kind of "Like" button (IFrame Method):

- With a smallest counter at his side *

<iframe src="http://www.facebook.com/plugins/like.php?href=http://www.YOURSITE.com/showthread.php$session[sessionurl]?p=$post[postid]&amp;layout=button_count&amp;show_faces=true&amp;width=&amp;action=like&amp;colorscheme=light" 
scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:100px; height:20px"></iframe>

- With a largest counter (and names of people who have clicked) *

<iframe src="http://www.facebook.com/widgets/like.php?href=http://www.YOURSITE.com/showthread.php$session[sessionurl]?p=$post[postid]&amp;show_faces=false&amp
        scrolling="no" frameborder="0" 
        style="border:none; width:450px; height:25px"></iframe>

*Change show_faces=false for true if you want to see faces

Installation:

Go to your Postbit/Postbit Legacy template and search for:

<!-- controls -->

And add below the code that you previously selected according your favorite button style.

If you want that the button only appears in first post of a thread, add this variables at the beginning and end of the code that you previously selected:

<if condition="$post[postcount] == 1">YOUR CODE</if>

*You should add these variables, otherwise the button will be displayed in every post, which makes no sense.



XFBML Method (recommended)
This is a richer way to send the contents of your board to Facebook, because it gives to users the possibility to add more information and also an image of your site is displayed on their FB wall (see the screenshots below).

Installation: (provided by cdoyle, thanks mate :up

You'll need to register your app here: http://developers.facebook.com/setup/, and get an ID to place into the code below.

<if condition="$post[postcount] == 1 AND !in_array($GLOBALS[forumid], array(40, 39))">


<p><fb:like></fb:like></p>

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


</if>

-----------------------------------------------------------------------------------------------------

Internet Explorer browser fix: https://vborg.vbsupport.ru/showpost....5&postcount=70

-----------------------------------------------------------------------------------------------------

For additional information on this button and different parameters please visit http://developers.facebook.com/docs/...e/plugins/like

Remember to click Mark as Installed if you use this modification :up:

[BirdOPrey5]

"og" is the name of the standard given to these tags, short for 'open graph.' Other sites besides facebook could use them but I don't know of any that do.

Can you give a link to a thread on your forum? Facebook visits your page to pull this info so your thread needs to be visible to the public for the tags to work right.

[Replicators]

Originally Posted by BirdOPrey5

"og" is the name of the standard given to these tags, short for 'open graph.' Other sites besides facebook could use them but I don't know of any that do.

Can you give a link to a thread on your forum? Facebook visits your page to pull this info so your thread needs to be visible to the public for the tags to work right.

Ok nvm then, my board is disabled atm so maybe once i open it, it will work.

[BirdOPrey5]

Probably. :up:

[Cobra-J82]

If you dont want this like button to be shown in specific forums add

<if condition="$forum[forumid]=='7,8,29,30,31,32,33,40'">
<else />

THE LIKE BUTTON CODE

</if>

The numbers are the forum id

[muratcan25]

YouSite.Com/showthread.php?p the page could not be reached at.
.php?p vBSEO user of
I wonder what's wrong

[Replicators]

Here is where i put it.

Go into Showthread and find:

<!-- toolbar -->
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center" style="border-bottom-width:0px">
<tr>

After the <tr> put in:

<td id="fb-root"><script> 
  window.fbAsyncInit = function() {
    FB.init({
      appId  : 'yourappID',
      status : true, // check login status
      cookie : true, // enable cookies to allow the server to access the session
      xfbml  : true  // parse XFBML
    });
  };
 
  (function() {
    var e = document.createElement('script');
    e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
    e.async = true;
    document.getElementById('fb-root').appendChild(e);
  }());
</script> <fb:like layout="standard" show_faces="false" width="300" action="like" colorscheme="dark" /></td>

Of course, change the colorscheme to what scheme you have on the forum.

NOTE: If someone can help me make it to where the background color is what it's supposed to be, that would be awesome as it don't look exactly right this way.

[SamirDarji]

Originally Posted by Replicators

Here is where i put it.

This is exactly what I was looking to do.

What do you mean by the background color? Of the Like button?

[Jay106n]

I installed this using the XFBML Method, works like a charm on FF, but is a no go on IE.

[Jay106n]

I found it works on some threads in 3.8.0 , but not others. Any ideas?

[BirdOPrey5]

I know with the twitter button threads with special characters in the title will stop it from working... basically anything non-english.