Add a Facebook Like and Send button as a WordPress shortcode. You can choose between all the available types as well as selecting the darker templates. I recently wrote a post about Google +1, Add Google +1 to WordPress 3.0 with a simple shortcode, so checkout that shortcode if you haven’t already implemented Google +1 into your WordPress site.
The code below was put together using Facebook Like API documentation.
1) The WordPress Shortcode
You are going to paste this into your ( functions.php ) file or wrap it up into a plug-in file. If you do not have a functions.php file in your theme just create one at the root level of your template with this code pasted inside of it. That will add the code into the WordPress runtime. Really there is no wrong way to do it.
I went ahead and added all the options for completeness.
function fb_like( $atts, $content=null ){
/* Author: Nicholas P. Iler
* URL: http://www.ilertech.com/2011/06/add-facebook-like-button-to-wordpress-3-0-with-a-simple-shortcode/
*/
extract(shortcode_atts(array(
'send' => 'false',
'layout' => 'standard',
'show_faces' => 'true',
'width' => '400px',
'action' => 'like',
'font' => '',
'colorscheme' => 'light',
'ref' => '',
'locale' => 'en_US',
'appId' => '' // Put your AppId here is you have one
), $atts));
$fb_like_code = <<<HTML
<div id="fb-root"></div><script src="http://connect.facebook.net/$locale/all.js#appId=$appId&xfbml=1"></script>
<fb:like ref="$ref" href="$content" layout="$layout" colorscheme="$colorscheme" action="$action" send="$send" width="$width" show_faces="$show_faces" font="$font"></fb:like>
HTML;
return $fb_like_code;
}
add_shortcode('fb', 'fb_like');
Note: you can wrap a URL around our shortcode for explicit setting of the URL to be liked or Recommended like this [fb]http://www.google.com[/fb].
2) PHP Code – Manual placement in theme file
For the most control adding code to your theme files will be the best way to go. You can add it to any pages in or out of the WordPress loop.
<!-- Facebook Like button-->
<?php echo do_shortcode("[fb]"); ?>
3) Shortcode usages – Examples
There are a few variations you can play with for different look. Here are just a few examples.
Standard Types – Default
[fb]
[fb send='true']
[fb action='recommend']
Button Count Types
[fb layout='button_count']
[fb send='true' layout='button_count']
[fb action='recommend' layout='button_count']
Box Count Types
[fb layout='box_count']
Complete List of Facebook Like Options
These are the perimeters that our shortcode will accept:
- Send – true, false
- Layout – button_count, …
- Show Faces – true, false
- Width – Default is 400px
- Action – like, recommendation
- Font – Check FaceBook API for Details
- Colorscheme – light, dark
- Ref - Check FaceBook API for Details
- Locale - Check FaceBook API for Details
- AppId – Add FaceBook AppId for FaceBook tracking
Conclusion
Well, that’s all. I hope this provides an easy way of adding Facebook like buttons to your themes.
Dont u need some sort of start and end in the function code??? when i create a functions.php file and paste the code its just all black and seems like it need a php start and end somewere??
Yes. The functions.php needs to be wrapped in php tags.