Like Button on WordPress

Like Button on WordPressIn my last article Facebook Like for WordPress, I showed you how to add a Facebook like button so your visitors could display there love of your website on Facebook.

In this video I’ll show you how to add a a Like button on WordPress that dynamically allows visitors to like individual pages.

I also will show you how to make your website part of the Facebook network using the Open Graph Protocol. We then explore Facebook Insights and the Facebook Graph.

All of the code follows the video. Feel free to use it however you’d like. This is what the Like button will look like on your site. Feel free to click it for your Facebook friends.

Code from the Video

function nttfacebooklike() {

// Get current web page the user is on
$currentURL = $_SERVER["SERVER_NAME"] . $_SERVER["REQUEST_URI"];

// Put your Facebook code between the quotes up until your web page name 
$fbLikeCode = '<script>(function(d){var js, id = \'facebook-jssdk\'; if (d.getElementById(id)) 
{return;}js = 
d.createElement(\'script\'); js.id = id; js.async = true;js.src = 
"//connect.facebook.net/en_US/all.js#appId=148750305214974&
xfbml=1";d.getElementsByTagNa
me(\'head\')[0].appendChild(js);
}(document));</script><div class="fb-like" data-href="';

$fbLikeCode = $fbLikeCode . $currentURL;

$fbLikeCode = $fbLikeCode . '" data-
send="true" data-layout="button_count" data-width="80" data-show-faces="false"></div>';

return $fbLikeCode;

}

add_shortcode('nttfblike', 'nttfacebooklike');

Till Next Time

Think Tank

 

10 Responses to “Like Button on WordPress”

  1. Aaron says:

    Great tutorial…. you really know your stuff, very impressive 🙂

  2. Magdalena says:

    Your tutorial is great but I´ve just lost my wordpress blog after editting function.php with these codes!
    I cannot edit dashboard anymore and all I can do was pressing the back buttons.
    I´m still looking for a solution now, hoping I can recover my blog.
    Magdalena,

    • admin says:

      Don’t freak out I know what happened. You were probably editing functions.php inside of the WordPress editor right? WordPress occasionally flips out when you do that. Access the file using FTP. Get FileZilla, or something like it.

      FTP into your site and locate the functions.php file. It’s in wp-content/themes/NAME OF YOUR THEME Find the functions.php file. Right click it and click view edit. It will open up the file in your text editor. Just make sure it is a plain text editor and not Microsoft Word. Edit the functions.php file there. Delete what you added, or put in the code I provided. Save it back to the server and everything will be fine.

      I hope that solves it

  3. JP says:

    Hi admin,

    I truly appreciate your videos to help others with coding a facebook button into their website. However, I do not have the most experience with coding and facebook is updating at a constant rate. For my facebook “like” function I have generated this code. Is it correct? I’m a bit confused because the new fb like generator is different.

    I would like to get the fb like button for just a specific page. Is this code correct?
    ———————————
    function nttfacebooklike() {
    $currentURL = $_SERVER[“SERVER_NAME”] . $_SERVER[“REQUEST_URI”];

    $fblikeCode = ‘(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0];if(d.getElementById(id)) return;js = d.createElement(s); js.id =id;js.src=”//connect.facebook.net/en_US/all.js#xfbml=1&appId=338802592829817″;fjs.parentNode.insertBefore(js, fjs);}(document,\’script’, \’facebook-jssdk\’));’;

    return fblikeCode;
    }

    add_shortcode(‘fblike’,’nttfacebooklike’);

    ———————————

    What I’m trying to do is add a fb like to each post I make on this page of my website… http://www.seeski.com/boating-news/

  4. JP says:

    I FULLY APPRECIATE ANY HELP!

  5. d says:

    Hi. I am getting an error in the code that i copied from above, and in fact, it looking at it in either IE or FF, it looks strange, (bearing in mind i am not a developer and may NOT know what i’m talking about:) – line 09 ends with an equals sign, no semi-colon at the end.

    Perhaps the problem is that i’m using Dw CS5.5, and i copied the code into an HTML, under , i created a script tag, as such,

    //and put your code here

    my aim – to create a like button on a url in my website, for a facebook page that i have. SO, when u click the “like” btn on my website url, it adds a count to the facebook.com/Nameofpage

    Perhaps u could upload or email the code? or explain briefly how it is set up using Dw?

    Thanks,
    “like”!

    • d says:

      looking at my comment, it seems that some of the example code i put in, has dropped: i put your code in a javascript tag on an html file.

      is that correct?

    • admin says:

      It sounds like you might have copied the code wrong. Drift your mouse over the upper right hand corner of the code. Click on the icon with the view source tool tip. Then paste that at the end of your functions.php file in WordPress. Then any where you type [nttfblike] a facebook like button will show. I hope that helps

Leave a Reply

Your email address will not be published.

Google+