Facebook likebox in lightbox for new visitor

What if you ask your first time visitor on your website to like your Facebook page, about 90% people will exit and about 10% people will like your page. Your Facebook page's likes is the status of your page on Facebook. Isn't it? Yes it is this widget will help you little to increase likes. Even we used this for sometime to increase our likes on TechiMen but we later removed it for no reason. This widget help you make your blog more professional and good looking and the increase in your Facebook likes. The best thing is that this widget only ask to like those visitors who visit the blog or website for the first time. If somebody clicks anywhere except on likebox, the likebox lightbox disappears. The pop-up likebox also disappears when the page is refreshed/reloaded or F5 is pressed.

So let us come to the point 'how to install it on your Blogger blog?':
Steps:
1. Go to Blogger then to your blog
2. Now go to layout from dashboard.
3. If you already have HTML/JavaScript
OR
Click on Add Widget in any section "Sidebar or Footer" and select HTML/JavaScript
4. Now copy the script below (after changing 'TechiMen' with your Facebook page username or page id) and paste in the HTML/JavaScript widget

<style> <script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script> <script src="//sites.google.com/site/techprevue/home/jquery.colorbox.min.js"></script> <link rel="stylesheet" href="//sites.google.com/site/techprevue/home/colorbox-dark.css" type="text/css" /> <script type="text/javascript"> jQuery(document).ready(function(){ if (document.cookie.indexOf('visited=true') == -1) { var setDays = 1000*60*60*24*1; var expires = new Date((new Date()).valueOf() + setDays); document.cookie = "visited=true;expires=" + expires.toUTCString(); $.colorbox({width:"400px", height:"230px", inline:true, href:"#tP"}); }});</script> <div style="display:none"> <div id="tP" style="background:#fff;position:scroll;z-index:99999999;"> <div style="text-align:center;padding-top:15px"> <h2 class="tP"> Subscribe all latest updates via Facebook</h2> <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FTechiMen&width=342&height=300&show_faces=true&colorscheme=light&stream=false&show_border=false&header=false&appId=" scrolling="no" frameborder="0" style="border:none; overflow:hidden; " allowtransparency="true"></iframe> <p style="font-size:xx-small"> </p> </div> </div> </div>

5. Now click on 'Save'.

Now the widget will work when somebody visits your blog or website first time or deletes its cache/cookies and browser history. I hope it works for you.

Social sharing buttons floating bar

This widget will the option for your visitors to share your posts on their social network. The widget has button for all popular social bookmarking websites. The widget is floating sidebar with the buttons of Facebook, Twitter, Google+, LinkedIN, Pinterest, StumbleUpon and Reddit by default. You can also add Technorati by adding 'technorati' in script. See the post 'How social bookmarking can help you?'

Follow the below steps to install the widget:

1. Login your Blogger account and go to your blog.

2, Now go to the 'Layout' from dashboard.

3. Open any HTML/Javascript widget if you have already added some

OR if you don't have added any HTML/JavaScript widget

Add a gadget/widget in the sidebar.

4. And chose HTML/JavaScript

5. Now copy the following code:

<script charset="utf-8" type="text/javascript">var switchTo5x=true;</script><script charset="utf-8" type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script><script type="text/javascript">stLight.options({publisher:"wp.09c54db5-9f6f-491e-a968-ea37fed781ab"});</script><script charset="utf-8" type="text/javascript" src="http://s.sharethis.com/loader.js"></script><script charset="utf-8" type="text/javascript">var options={ publisher:"wp.09c54db5-9f6f-491e-a968-ea37fed781ab", "position": "left", "chicklets": { "items": ["facebook","twitter","googleplus","linkedin","pinterest","stumbleupon","reddit"] } }; var st_hover_widget = new sharethis.widgets.hoverbuttons(options);</script>

6. Paste the code in the HTML?JavaScript widget and click save
7. Everything is done and you can now easily share your post to all the networks and your visitors can also share the posts.

 You can preview the widget in action by clicking on the below button:

Flying Twitter bird on your Blogger blog

Want to make your blog readers wonder when they see a Twitter bird flying on your blog. Actually this Twitter bird flies when someone scroll your page down. It sits anywhere on your page. When you hover the bird with mouse you have two options: 'tweet this' and 'follow me'. The Twitter bird make your readers to easily follow you or share your post on Twitter in a creative and lovely way. So why are you waiting just follow the below steps and you will be able to put the Twitter bird on your blog.

Steps:

1. Go to Blogger, Sign in and go to your blog.
2. Go to 'Template' from dashboard
3. Click on 'Edit HTML'
4. Find </body> in the HTML (You can do this by pressing Ctrl+F and typing </body>)

5. Now copy the code below from here and paste the code just above </body> in your template's HTML

<script src='http://yourjavascript.com/1523826141/Flying twitter bird.js' type='text/javascript'></script> <script type="text/javascript"> var twitterAccount = "TechiMen"; var tweetThisText = " <data:blog.pagetitle>: <data:blog.url> "; tripleflapInit(); </script>

6. Replace TechiMen with your Twitter username.
7. Now click on 'Save'. (NOTE: If the HTML is not being saved. Then make the code friendly by using 'Postable Service'. You can post the code there and click 'make it friendly'. Then copy the code from there and use. Now the HTML will be saved)