Dynamic Web Lab

How to add facebook likebox in wordpress post or page using shortcode

If you want to show your facebook fanpage likebox in wordpress post or page then copy and past the code below in your theme function.php

[php] //ADD FACEBOOK LIKE BOX SHORTCODE
function fb_likebox($atts) {

extract(shortcode_atts(array(
"fb_link" => ‘https://www.facebook.com/techsloution4u’
), $atts));

return ‘<h2 class="join-fb">Like Them On Facebook</h2>
<fb:like-box href="’.$fb_link.’" width="595" height="100" show_faces="false" stream="false" header="false"></fb:like-box>’;
}
add_shortcode(‘fb_box’, ‘fb_likebox’);[/php]

You can change the attribute of the facebook like box

  • width – the width of the plugin in pixels. Default width: 300px.
  • height – the height of the plugin in pixels.
  • colorscheme – the color scheme for the plugin. Options: ‘light’, ‘dark’
  • show_faces – specifies whether or not to display profile photos in the plugin. Default value: true.
  • stream – specifies whether to display a stream of the latest posts from the Page’s wall
  • header – specifies whether to display the Facebook header at the top of the plugin.
  • border_color – the border color of the plugin.

And also past this code after the tag in your header.php theme file

[php] <div id="fb-root"></div>
<script>(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=101067140010972";
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>
[/php]

Then use this shortcode to show facebook fanpage on page or post

[php] [fb_box fb_link="https://www.facebook.com/techsloution4u"][/fb_box] [/php]
Written by

Maidul Islam

I am a freelance web developer.Like to share what i learn.