Learn How to Add Slide out Facebook like Button to your Blogger Blog {WikiHow Like}.Hi guys how are you. It’s a nice new year coming in some days. So from last couple of days I was working on this blog and testing some widgets on this blog. Some of those are ugly and some of those are very beautiful and impressive. So one of those awesome blogger widgets here I am giving you guys one today. So that you can get more Facebook fans for your blog.
Here I am talking about a beautiful and using Facebook like button which pop-ups in the lower-right side of your blogger blog. You may have already seen something like this on The Popular WikiHow.com.
The wikihow website shows a widget of write an article for us .when you complete reading an article on wikihow. So here is the screenshot of the widget which we see on the wikihow.Andyou can see the blogger version of this widget which includes the Facebook like box inthe first image.
To Add this Widget in your blog Follow the Steps:-
Step 1> Go to Blogger Dashboard
Step 2> Then Go to Layout
Step 3> Add Widget and Choose HTML/JavaScript
Step 4> Copy the code from Below and Paste it.
[After Pasting Do change the Red Market Facebook page ID with Your Facebook Page Id]
{And Please Do Not Remove the Credit (My Website Link)}
Here is the Codeing >>>
So I thing you guys will love this widget. Comment below and share your thoughts about the template.
One suggestion for you guys – “If your Blog has AdSense Ads on it then please take care of placing the ads .do make sure that the widget don’t appear just over AdSense ads”. Because then you will violate the AdSense ad policy and you can get banned by AdSense.
Also Make Comment if you have any problem, I would love to help you guys.
Here I am talking about a beautiful and using Facebook like button which pop-ups in the lower-right side of your blogger blog. You may have already seen something like this on The Popular WikiHow.com.
To Add this Widget in your blog Follow the Steps:-
Step 1> Go to Blogger Dashboard
Step 2> Then Go to Layout
Step 3> Add Widget and Choose HTML/JavaScript
Step 4> Copy the code from Below and Paste it.
[After Pasting Do change the Red Market Facebook page ID with Your Facebook Page Id]
{And Please Do Not Remove the Credit (My Website Link)}
Here is the Codeing >>>
<div class="widget-content">Conclusion
<style>
#scrollwig {
position: fixed;
right: -510px;
z-index: 4;
opacity:0.99;
width: 275px;
bottom: -300px;
}
#scroll_content{
border: 5px solid #FFF;
border-radius: 150px 150px 0 150px;
box-shadow: -3px 3px 4px #BFBFBF;
margin-bottom: 0;
}
#follow {
background-color: #FFF;
border:15px groove #F8DA39;
border-right: none;
border-bottom: none;
border-radius: 150px 150px 0 150px;
font-size: 0.9em;
height: 185px;
margin-bottom: 0;
padding: 40px;
text-align: center;
}
.text{margin:0 0 0 0}
.para1 {
font-size: 1.9rem;
font-weight: normal;
font-family: oswald;
padding-bottom: 0.1em;
margin: 0 0 0 0;
letter-spacing: 1px;
color: #47401A;
}
.para2 {
width: 120%;
margin: 0 0 0 -9%;
font-size: .8rem;
}
.fbfollow {
color: #3B5998;
font-size:1.3rem;
font-weight:bold
}
.googlefollow {
color: #D34836;
font-size:1.3rem;
font-weight:bold
}
</style>
<script>
mdfbw="MostUsefulTricks"
var _0xb6f0=["\x73\x63\x72\x6F\x6C\x6C\x54\x6F\x70","\x66\x61\x64\x65\x49\x6E","\x23\x73\x63\x72\x6F\x6C\x6C\x77\x69\x67","\x66\x61\x64\x65\x4F\x75\x74","\x73\x63\x72\x6F\x6C\x6C"];$(document)[_0xb6f0[4]](function (){var _0x6b02x1=$(this)[_0xb6f0[0]]();if(_0x6b02x1>1500){$(_0xb6f0[2])[_0xb6f0[1]]();} else {$(_0xb6f0[2])[_0xb6f0[3]]();} ;} );
var _0x7f48=["\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x27\x73\x6C\x69\x64\x65\x72\x62\x6F\x78\x5F\x30\x36\x27\x20\x69\x64\x3D\x27\x73\x63\x72\x6F\x6C\x6C\x77\x69\x67\x27\x20\x73\x74\x79\x6C\x65\x3D\x27\x72\x69\x67\x68\x74\x3A\x20\x30\x70\x78\x3B\x20\x62\x6F\x74\x74\x6F\x6D\x3A\x20\x30\x70\x78\x3B\x27\x3E","\x77\x72\x69\x74\x65","\x3C\x64\x69\x76\x20\x69\x64\x3D\x27\x73\x63\x72\x6F\x6C\x6C\x5F\x63\x6F\x6E\x74\x65\x6E\x74\x27\x3E","\x3C\x64\x69\x76\x20\x69\x64\x3D\x27\x66\x6F\x6C\x6C\x6F\x77\x27\x3E","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x27\x74\x65\x78\x74\x27\x3E","\x3C\x70\x20\x63\x6C\x61\x73\x73\x3D\x27\x70\x61\x72\x61\x31\x27\x3E\x4C\x69\x6B\x65\x20\x55\x73\x20\x4F\x6E\x3C\x2F\x70\x3E","\x3C\x70\x3E\x3C\x73\x70\x61\x6E\x20\x63\x6C\x61\x73\x73\x3D\x27\x66\x62\x66\x6F\x6C\x6C\x6F\x77\x27\x3E\x46\x61\x63\x65\x62\x6F\x6F\x6B\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x2F\x70\x3E","\x3C\x62\x72\x2F\x3E","\x3C\x21\x2D\x2D\x20\x46\x62\x20\x42\x75\x74\x74\x6F\x6E\x20\x2D\x2D\x3E","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x27\x66\x62\x27\x20\x73\x74\x79\x6C\x65\x3D\x27\x66\x6C\x6F\x61\x74\x3A\x6E\x6F\x6E\x65\x3B\x70\x6F\x73\x69\x74\x69\x6F\x6E\x3A\x72\x65\x6C\x61\x74\x69\x76\x65\x3B\x20\x6D\x61\x72\x67\x69\x6E\x3A\x30\x70\x78\x20\x30\x70\x78\x20\x30\x70\x78\x20\x36\x33\x70\x78\x27\x3E","\x3C\x69\x66\x72\x61\x6D\x65\x20\x73\x72\x63\x3D\x22\x2F\x2F\x77\x77\x77\x2E\x66\x61\x63\x65\x62\x6F\x6F\x6B\x2E\x63\x6F\x6D\x2F\x70\x6C\x75\x67\x69\x6E\x73\x2F\x6C\x69\x6B\x65\x2E\x70\x68\x70\x3F\x68\x72\x65\x66\x3D\x68\x74\x74\x70\x73\x25\x33\x41\x25\x32\x46\x25\x32\x46\x77\x77\x77\x2E\x66\x61\x63\x65\x62\x6F\x6F\x6B\x2E\x63\x6F\x6D\x25\x32\x46","\x26\x61\x6D\x70\x3B\x77\x69\x64\x74\x68\x26\x61\x6D\x70\x3B\x6C\x61\x79\x6F\x75\x74\x3D\x62\x6F\x78\x5F\x63\x6F\x75\x6E\x74\x26\x61\x6D\x70\x3B\x61\x63\x74\x69\x6F\x6E\x3D\x6C\x69\x6B\x65\x26\x61\x6D\x70\x3B\x73\x68\x6F\x77\x5F\x66\x61\x63\x65\x73\x3D\x66\x61\x6C\x73\x65\x26\x61\x6D\x70\x3B\x73\x68\x61\x72\x65\x3D\x66\x61\x6C\x73\x65\x26\x61\x6D\x70\x3B\x68\x65\x69\x67\x68\x74\x3D\x36\x35\x26\x61\x6D\x70\x3B\x61\x70\x70\x49\x64\x3D\x35\x34\x39\x35\x31\x30\x37\x38\x38\x34\x30\x33\x32\x31\x35\x22\x20\x73\x63\x72\x6F\x6C\x6C\x69\x6E\x67\x3D\x22\x6E\x6F\x22\x20\x66\x72\x61\x6D\x65\x62\x6F\x72\x64\x65\x72\x3D\x22\x30\x22\x20\x73\x74\x79\x6C\x65\x3D\x22\x62\x6F\x72\x64\x65\x72\x3A\x6E\x6F\x6E\x65\x3B\x20\x6F\x76\x65\x72\x66\x6C\x6F\x77\x3A\x68\x69\x64\x64\x65\x6E\x3B\x20\x68\x65\x69\x67\x68\x74\x3A\x36\x35\x70\x78\x3B\x22\x20\x61\x6C\x6C\x6F\x77\x74\x72\x61\x6E\x73\x70\x61\x72\x65\x6E\x63\x79\x3D\x22\x74\x72\x75\x65\x22\x3E\x3C\x2F\x69\x66\x72\x61\x6D\x65\x3E","\x3C\x2F\x64\x69\x76\x3E","\x3C\x64\x69\x76\x20\x73\x74\x79\x6C\x65\x3D\x22\x66\x6C\x6F\x61\x74\x3A\x20\x72\x69\x67\x68\x74\x3B\x66\x6F\x6E\x74\x2D\x73\x69\x7A\x65\x3A\x20\x2E\x36\x35\x72\x65\x6D\x3B\x63\x6F\x6C\x6F\x72\x3A\x20\x23\x33\x32\x33\x32\x33\x32\x3B\x70\x6F\x73\x69\x74\x69\x6F\x6E\x3A\x20\x61\x62\x73\x6F\x6C\x75\x74\x65\x3B\x72\x69\x67\x68\x74\x3A\x20\x35\x70\x78\x3B","\x62\x6F\x74\x74\x6F\x6D\x3A\x20\x30\x70\x78\x3B\x22\x3E\x42\x6C\x6F\x67\x67\x65\x72\x20\x57\x69\x64\x67\x65\x74\x20\x62\x79\x20\x3C\x61\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E\x6D\x61\x6B\x69\x6E\x67\x64\x69\x66\x66\x65\x72\x65\x6E\x74\x2E\x63\x6F\x6D\x2F\x22\x20\x74\x61\x72\x67\x65\x74\x3D\x22\x5F\x62\x6C\x61\x6E\x6B\x22\x3E\x4D\x61\x6B\x69\x6E\x67\x20\x44\x69\x66\x66\x65\x72\x65\x6E\x74\x3C\x2F\x61\x3E\x3C\x2F\x64\x69\x76\x3E"];document[_0x7f48[1]](_0x7f48[0]);document[_0x7f48[1]](_0x7f48[2]);document[_0x7f48[1]](_0x7f48[3]);document[_0x7f48[1]](_0x7f48[4]);document[_0x7f48[1]](_0x7f48[5]);document[_0x7f48[1]](_0x7f48[6]);document[_0x7f48[1]](_0x7f48[7]);document[_0x7f48[1]](_0x7f48[8]);document[_0x7f48[1]](_0x7f48[9]);document[_0x7f48[1]](_0x7f48[10]+mdfbw+_0x7f48[11]);document[_0x7f48[1]](_0x7f48[12]);document[_0x7f48[1]](_0x7f48[13]);document[_0x7f48[1]](_0x7f48[14]);document[_0x7f48[1]](_0x7f48[12]);document[_0x7f48[1]](_0x7f48[12]);document[_0x7f48[1]](_0x7f48[12]);document[_0x7f48[1]](_0x7f48[12]);
</script><div class="sliderbox_06" id="scrollwig" style="right: 0px; bottom: 0px; display: block;"><div id="scroll_content"><div id="follow"><div class="text"><p class="para1">Like Us On</p><p><span class="fbfollow">Facebook</span></p><br /><!-- Fb Button --><div class="fb" style="float:none;position:relative; margin:0px 0px 0px 63px"><iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FMostUsefulTricks&width&layout=box_count&action=like&show_faces=false&share=false&height=65&appId=549510788403215" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:65px;" allowtransparency="true"></iframe></div><div style="float: right;font-size: .65rem;color: #323232;position: absolute;right: 5px;bottom: 0px;">Blogger Widget by <a href="http://www.MostUsefulTricks.com/" target="_blank">Most Useful Tricks</a></div></div></div></div></div>
</div>
So I thing you guys will love this widget. Comment below and share your thoughts about the template.
One suggestion for you guys – “If your Blog has AdSense Ads on it then please take care of placing the ads .do make sure that the widget don’t appear just over AdSense ads”. Because then you will violate the AdSense ad policy and you can get banned by AdSense.
Also Make Comment if you have any problem, I would love to help you guys.
In Blogger, Facebook, Widget, Wikihow like
0 comments:
Post a Comment
Note: only a member of this blog may post a comment.