Truemag

  • Categories
    • Tips And Tricks
    • Internet
    • PHP
    • Javascript
    • CSharp
    • SQL Server
    • Linux
  • Lastest Videos
  • Our Demos
  • About
  • Contact
  • Home
  • Write With Us
  • Job Request
Home Tips And Tricks Place Facebook Like Button On WordPress

Place Facebook Like Button On WordPress

Add the Facebook Like Button on your website or WordPress is a great idea which let your visitors share your content with their friends on Facebook and then drive traffics back to your site.

This tutorial aims to place the button on WordPress, it’s also easy if you want to do with other CMS or website.

1. Open your single.php file in your themes’s folder. In my case, it’s loop-single.php file in twentyten folder

2. Paste either of following implementation code below somewhere in your file:

+ Iframe:

<iframe src="http://www.facebook.com/plugins/like.php?href=your_url&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font&amp;colorscheme=light&amp;height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>

<iframe src="http://www.facebook.com/plugins/like.php?href=your_url&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font&amp;colorscheme=light&amp;height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>

+ Javascript – XFBML:

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="your_url" show_faces="false" width="450" font=""></fb:like>

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="your_url" show_faces="false" width="450" font=""></fb:like>

Replace your_url by your current page url. There is a function to get the current page url by PHP, read more: http://4rapiddev.com/php/php-get-current-page-url/

In WordPress blog you can use get_permalink() function to get your current page url so the 2 ways of implementation should become something like this:

+ Iframe:

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink());?>&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font&amp;colorscheme=light&amp;height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink());?>&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font&amp;colorscheme=light&amp;height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>

+ Javascript – XFBML:

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="<?php echo get_permalink();?>" show_faces="false" width="450" font=""></fb:like>

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="<?php echo get_permalink();?>" show_faces="false" width="450" font=""></fb:like>

A preview of the Facebook Like Button:

Facebook Like Button On WordPress

Facebook Like Button On WordPress

There are some options for you to config the button:

+ show_faces=true | false: show | don’t show profile pictures below the button

+ layout= standard | button_count | box_count

+ action= like | recommend: the verb to display in the button. Currently only ‘like’ and ‘recommend’ are supported.

+ colorscheme = light | dark: the color scheme of the plugin

Read more on the Facebook Like Button page.

Mar 29, 2011Hoan Huynh
How to install PHP extension without re-compiling PHPAdd And Get Custom Field In Wordpress
You Might Also Like:
  • Facebook Like Button And Recommend Button With fb:like, iframe and html5
  • Place Twitter Tweet Button On WordPress
  • Get WordPress Short Link And Full Link To A Post
  • How To Ask People To Like Your Facebook Page On The Landing Page
  • Add And Get Custom Field In WordPress
  • Share Page On Facebook With Thumbnail Featured Image
  • WordPress View Large Image Without Leaving Current Page
  • Import RSS From Blog To Facebook Failed
  • How To Change Default Home Page Of WordPress
  • Submit Content To facebook Fan Page Automatically
Hoan Huynh

Hoan Huynh is the founder and head of 4rapiddev.com. Reach him at [email protected]

11 years ago Tips And TricksFacebook, get_permalink, Like Button, Wordpress164
0
GooglePlus
0
Facebook
0
Twitter
0
Digg
0
Delicious
0
Stumbleupon
0
Linkedin
0
Pinterest
Most Viewed
PHP Download Image Or File From URL
24,442 views
Notepad Plus Plus Compare Plugin
How To Install Compare Text Plugin In Notepad Plus Plus
21,823 views
Microsoft SQL Server 2008 Attach Remove Log
Delete, Shrink, Eliminate Transaction Log .LDF File
17,631 views
JQuery Allow only numeric characters or only alphabet characters in textbox
14,978 views
C# Read Json From URL And Parse/Deserialize Json
11,691 views
4 Rapid Development is a central page that is targeted at newbie and professional programmers, database administrators, system admin, web masters and bloggers.
Recent Posts
  • Things to Learn about Installingderm Loan Type S
  • Online Photo Editor – Free Photoediting Software
  • A Guide to Finding the Best Paper Sellers
  • Photoediting in Home Isn’t Hard to Do!

  • Free Photo Editor Online
Categories
  • CSharp (45)
  • Facebook Graph API (19)
  • Google API (7)
  • Internet (87)
  • iPhone XCode (8)
  • Javascript (35)
  • Linux (27)
  • MySQL (16)
  • PHP (84)
  • Problem Issue Error (29)
  • Resources (32)
  • SQL Server (25)
  • Timeline (5)
  • Tips And Tricks (141)
  • Uncategorized (647)
Recommended
  • Custom Software Development Company
  • Online Useful Tools
  • Premium Themes
  • VPS
2014 © 4 Rapid Development