3 in 1 (Google+, Facebook, Twitter) Fan Box For Blogger

Posted by | 3 comments
This is old but the new is what I have made it. Follower widget is the most essential tool for a blog. People can see which of their friends are following your site. You have two options to use either in same box or separately its upon you. You want demo, look the sidebar, I have added it.

How To Add Fan Box Widget

1. Go To Layout > Add A Gadget.
2. Select Google+ Followers.
3. Select Size To Manual Specify.
4. Set Width According To Your Sidebar And Height To 150px.
5. Now, Click On Save.

Now, you have to add facebook and twitter fan box.
1. Go To Template > Edit HTML.
2. Tick Expand Widget Templates.
3. Search For Followers1.
4. Copy The Below Code.

<div id='fb-root'/>
<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 = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;;
  fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>
<div class='fb-like-box' data-border-color='fff' data-header='false' data-href='https://www.facebook.com/BloggingTipsAndTricks' data-show-faces='true' data-stream='false' data-width='300' style='border:#fff;'/>
<div style='margin: 5px 0;'>
<script src='http://s.moopz.com/fanbox_init.js' type='text/javascript'/><div id='twitterfanbox'><script type='text/javascript'>fanbox_init(&quot;mbloggingtips&quot;)</script></div>
</div>

6. Paste It After.

<b:if cond='data:profileUrl != &quot;&quot;'>
<div class='g-plus' data-action='followers' data-source='blogger:blog:followers' expr:data-height='data:height' expr:data-href='data:profileUrl' expr:data-theme='data:theme' expr:data-width='data:width'/>
<script type='text/javascript'>window.___gcfg = {&#39;lang&#39;: &#39;<data:language/>&#39;};
</script>
</b:if>

7. Change BloggingTipsAndTricks With Facebook Fan Page URL And mbloggingtips With Twitter Username.  

8. Click Save. And you are done.

If you don't want to use it together, use it separately. I think you know how to do it but still if you are facing any problem comment below. I will help you.

3 comments:

  1. Hey there, You have done a fantastic job. I will certainly digg it and personally recommend to my
    friends. I am sure they will be benefited from this site.


    Also visit my blog; seopowa

    ReplyDelete
    Replies
    1. Thanks for this, I appreciate it.

      Delete
  2. No doubt Blogger's blog has so many templates in different layouts and styling but some people want to do some modification to make it more prettier. Those people who want to add three social media in one fan box can easily set it by adding some codes which is mentioned by you. This will look like a widget and I think this will provide outstanding look to the website :)

    ReplyDelete

About The Author

My photo

Nothing Is Special About Me, But I Can Do Something Special. I Am A Young Blogger Blogging As Part Time And Completing My Education. Well ! I Don't Know Very Much About Myself.

Alexa Rank!

Recent Comments

Contact Form

Name

Email *

Message *