How to add Sticky Facebook Like and Google+
Here is yet an another Blogger widget i would like to share here,although i didnt design this thanks to MBT but i hope will do release my own designs on blogger soon ;)
Everyblogger hunts for Facebook fans , Twitter and google+ followers,needless to say that visitors are the main part to play on any blog or website.But getting them back to each of your update is very crucial part and blog owners are using many techniques for it and some of them works well.
In my previous post in blogger widgets,i've shared
In this very post,you will know How to add Sticky social share widget or custom announcement bar for your blog / website.
Follow this simple steps:
1.Goto Blogger> Design > Edit HTML
Follow this simple steps:
1.Goto Blogger> Design > Edit HTML
2.Find ]]></b:skin>
3. Paste the following code just after the above code:
6. Preview your Template and Save it! Thanks MBT
Thats it.The social share sticky bar alternative to HELLO bar has been installed on your blog .
You can also use this widget to make an announcement to your visitors like Free Ebooks, Giveaways ,contents.So that your visitors will be more engaged on your blog.
If you like it ,do share it..Thanks friends..
tags: facebook like box at top of blog,fb like widget,google plus widget for blogger,facebook like button float on top,blogger widget,new widgets for blogger
3. Paste the following code just after the above code:
4.Now find </head> and Just paste the below code above </head>/*MBT Stickybar*/#mbt_bar{background:#0080ff url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl0wgVRJqHqKVplQ558UJ7ATqjoMaieF0lG4sOIz-THPld1vZ81Uy780sM6mv6P8iywCZnyZXRsuObAoH5NEZZGF7HUYjl3Ft73-LcTQRuQIRPwtgG2shyphenhyphenD2p6y9H5m6OLm4aWJShOEEQ/s400/stickybar.png') repeat-x;width:100%;margin:0 auto;text-align:center;padding:3px 0 0 0;border-bottom: 1px solid #888888;-moz-box-shadow: #666666 0px 1px 3px;-webkit-box-shadow: #666666 0px 1px 3px;box-shadow: #666666 0px 1px 3px;z-index: 999;height: 28px; position:fixed;line-height: 1.85em;vertical-align: baseline;letter-spacing: 1px;color:#fff;font-size:12px;font-weight:bold;font-family: arial,"Helvetica",sans-serif;}#mbt_bar a{text-decoration:underline;color:#E2E504;}#mbt_bar a:hover{text-decoration:none;}#mbt_bar p {margin:0; list-style:none;}#mbt_bar img {vertical-align: middle;margin-right: 6px;}
5. Finally, find <body> and paste the following code below it./*MBT Stickybar*/#mbt_bar{background:#0080ff url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl0wgVRJqHqKVplQ558UJ7ATqjoMaieF0lG4sOIz-THPld1vZ81Uy780sM6mv6P8iywCZnyZXRsuObAoH5NEZZGF7HUYjl3Ft73-LcTQRuQIRPwtgG2shyphenhyphenD2p6y9H5m6OLm4aWJShOEEQ/s400/stickybar.png') repeat-x;width:100%;margin:0 auto;text-align:center;padding:3px 0 0 0;border-bottom: 1px solid #888888;-moz-box-shadow: #666666 0px 1px 3px;-webkit-box-shadow: #666666 0px 1px 3px;box-shadow: #666666 0px 1px 3px;z-index: 999;height: 28px; position:fixed;line-height: 1.85em;vertical-align: baseline;letter-spacing: 1px;color:#fff;font-size:12px;font-weight:bold;font-family: arial,"Helvetica",sans-serif;}#mbt_bar a{text-decoration:underline;color:#E2E504;}#mbt_bar a:hover{text-decoration:none;}#mbt_bar p {margin:0; list-style:none;}#mbt_bar img {vertical-align: middle;margin-right: 6px;}
<div id='mbt_bar'> <span style='padding-right:5px; float:right'> <img align='absmiddle' border='0' onClick='closeTopAdsundefined);return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKd78SWAO18zvLcq6kLwEmZX7hKWF0zYBW1GyzwTKGAlR1ftxNhMgIBjSOwHgLfQ9yerZiDR6aBNTh4eTOjwjFjZ9D4xzT3t1yNzKEedSj0Tkqv-av8W9nnnogKLQr1msge5P7tHqbRS4/s400/cancel.png' style='cursor:hand;cursor:pointer;'/></span><div style='float:left; padding-left:10px;'>Stickybar with social Plugins</div> <div style='float:right; padding-right:0px;'> <p style='font:bold 12px arial; float:left; margin:5px;'>Liked us?</p><iframe allowTransparency='true' frameborder='0' scrolling='no' src='http://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FStudentsCrunch&send=false&layout=button_count&width=80& show_faces=false&action=like&colorscheme=light&font&height=21' style='border:none; overflow:hidden; width:80px; height:21px;'/> <g:plusone href='http://www.StudentsCrunch.com' size='medium'/> </div> </div>Replace StudentsCrunch with your facebook fan page name.
6. Preview your Template and Save it! Thanks MBT
Thats it.The social share sticky bar alternative to HELLO bar has been installed on your blog .
You can also use this widget to make an announcement to your visitors like Free Ebooks, Giveaways ,contents.So that your visitors will be more engaged on your blog.
If you like it ,do share it..Thanks friends..
tags: facebook like box at top of blog,fb like widget,google plus widget for blogger,facebook like button float on top,blogger widget,new widgets for blogger
No comments:
Post a Comment