Showing posts with label Widgets. Show all posts
Showing posts with label Widgets. Show all posts

Wednesday, 22 May 2013

Top 5 Tips To Improve Alexa Rank


Top 5 Tips To Improve Alexa Rank

alexa rank
After sharing some awesome blogger template with you today I am going to share some of the tips to improve your blog’s alexa rank. The common thing in SEO optimization and in page rank is content. Content is the king and if you are publishing good content then you don't have to work on Alexa rank and page rank because they will automatically increase day by day. Alexa rank updates daily and in page rank it take some months to update page rank. So, lets start the tutorial :)


What is Alexa Rank ?

Alexa is owned by the amazon.com which used to rank the website using website’s traffic, look, performance and backlinks.

1. Content is king

Blog/website’s content plays the key role in the alexa ranking. Always publish fresh and unique content. Never publish copied content because it will decrease your alexa rank and your AdSense account will got disabled.

2. Use Alexa Rank toolbar

The newbie blogger might not know that alexa rank is getting updated daily so to check the change in the alexa rank is better install alexa rank toolbar in to the your browser. Alexa rank is the best way to monitor the status of the blog and website.

3. Promote your website

The Another best way to improve your alexa rank is to publish guest content on other’s blogs. There are many bloggers who accepts the guest post and they will offer the rich back link for your blog so guest posts will help you to build the rich backlink.

4. Be Consistent

A best blog is not the one which contains the huge content, it is the with consistent effective writings. You should not publish article when its ready, you should have time table to publish your article it helps alexa to improve your rank and it will make your website SEO friendly. And Publish regularly and people will realize that you are best in your blog’s niche.

5. Add alexa rank widget

You should add the alexa rank widget in to your blog/website. You have to show off your alexa rank to your visitor so visitors will realize that your website content is great and it will subscribe to your website. Hence your subscribers will increase.

Hope this tips will help you to improve your blog’s alexa rank. If you have any doubt then feel free to ask, make a comment.
Read More

Floating Google +1, Facebook, Twitter Buttons For Blogger


Floating Google +1, Facebook, Twitter Buttons For Blogger


social sharing widget
In this tutorial I am going to show you how to add the floating google +1 , facebook , twitter buttons in blogger blog. This is a container having 3 sharing buttons like facebook , google + , twitter. Its so much important for all the bloggers because whenever your reader reades the post and if your reader want to share your post and its easy for them to share your post in facebook , google + and twitter. 
DEMO
Just follow the simple steps to add the floating google +1 , facebook , twitter buttons. 

 
1. Login into your blogger blog 
2.And select Layout 
3.Now click on “add gadget” and select “HTML/Javascript” and paste the bellow code.
<style>
#pageshare {position:fixed; bottom:15%; left:105px; float:left; border: 1px solid white; border-radius:2px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#ffffff;padding:0 0 2px;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
 </style>
<div id='pageshare' title="Share This With Your Friends">
<div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div>
<div class='sbutton' id='fb'><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div>
<div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div><br/><div style="clear: both;font-size: 12px;text-align:center;"><a href="http://techlosoft.blogspot.in/" target="blank"><font color="silver">Widgets<font></font></font></a></div></div>
 4.Now just save the widget and you have done ! 
Read More

Creating Navigation Transition Effect In Blog


Creating Navigation Transition Effect In Blog

Today I will explain how to make the "Menu Navigation" very cool with transition effects. Transition effect is an effect where we set the time changes in the css tersebut.Berikut demo of "Menu Navigation" is.
 Go To Blogger > Design > Edit HTML
  1. Back up your template
  2. Search (Ctrl+F) for   ]]></b:skin>
You simply add the following code above the code]]> </ b: skin>


 CSS Code:
 /*URL: http://www.bloggerknown.blogspot.com/ */
@import url(http://fonts.googleapis.com/css?family=Dosis:400,700);
.navbar {
 font-family: 'Dosis', sans-serif;
 position:relative;
 display:table;
 float:none;
 list-style-type:none;
 padding:0;
 margin:20px auto 250px auto;
}
.navbar:before {
 position:absolute;
 display:block;
 content: "";
 z-index:-1;
 width:100%;
 height:18px;
 bottom:-9px;
 left:2px;
 background: -moz-radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 75%);
 background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(0,0,0,0.7)), color-stop(75%,rgba(0,0,0,0)));
 background: -webkit-radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 75%);
 background: -o-radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 75%);
 background: -ms-radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 75%);
 background: radial-gradient(center, ellipse cover,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 75%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#00000000',GradientType=1 );
 opacity:.4;
}
.navbar:after {
 position:absolute;
 display:block;
 content: "";
 z-index:-1;
 width:100%;
 height:100%;
 top:0;
 left:0;
 -webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
 box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
}
.navbar > li {
 position:relative;
 float:left;
 display:inline-block;
 list-style-type:none;
 text-align:center;
 margin:0;
 border-left:0;
 border:1px solid rgba(0,0,0,0.5);
 line-height:35px;
 -webkit-box-shadow: inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25);
    box-shadow: inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25);
 -webkit-transition: all 300ms ease-in-out;
 -moz-transition: all 300ms ease-in-out;
 -ms-transition: all 300ms ease-in-out;
 -o-transition: all 300ms ease-in-out;
 transition: all 300ms ease-in-out;
}
.navbar.color1 > li {
 background:#ea7900;
}
.navbar.color2 > li {
 background:#336277;
}
.navbar.color3 > li {
 background:#3e781b;
}
.navbar.color4 > li {
 background:#ad2259;
}
.navbar.color5 > li {
 background:#b20a22;
}
.navbar > li:before {
 position:absolute;
 display:block;
 content: "";
 z-index:1;
 width:100%;
 height:100%;
 left:0;
 top:0;
 background: -moz-linear-gradient(top,  rgba(255,255,255,0.15) 0%, rgba(0,0,0,0.16) 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.15)), color-stop(100%,rgba(0,0,0,0.16)));
 background: -webkit-linear-gradient(top,  rgba(255,255,255,0.15) 0%,rgba(0,0,0,0.16) 100%);
 background: -o-linear-gradient(top,  rgba(255,255,255,0.15) 0%,rgba(0,0,0,0.16) 100%);
 background: -ms-linear-gradient(top,  rgba(255,255,255,0.15) 0%,rgba(0,0,0,0.16) 100%);
 background: linear-gradient(top,  rgba(255,255,255,0.15) 0%,rgba(0,0,0,0.16) 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#26ffffff', endColorstr='#29000000',GradientType=0 );
}
.navbar > li:after {
 position:absolute;
 display:block;
 content:"";
 width:100%;
 height:100%;
 top:0;
 left:0;
 background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OERFQkEzRUJDNUM5MTFFMUE3NzBCMTZBMEExNEQ5NUQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OERFQkEzRUNDNUM5MTFFMUE3NzBCMTZBMEExNEQ5NUQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4REVCQTNFOUM1QzkxMUUxQTc3MEIxNkEwQTE0RDk1RCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4REVCQTNFQUM1QzkxMUUxQTc3MEIxNkEwQTE0RDk1RCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PiSp0pIAAAAySURBVHjaYmBgYOAHYmYGCADR/CDiDxDzQAW5gPgLlM3ACsQKUBqhBYjZkY3CMBMgwACvHQKnyUp+6gAAAABJRU5ErkJggg==");
}
.navbar > li.drpdown a > span{
 margin-right:30px;
}
.navbar > li.drpdown > a:after {
 position:absolute;
 content: "\0025bc";
 z-index:1;
 font-size:8px;
 top:0;
 right:10px;
 color:#fff;
 text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.8);
    filter: dropshadow(color=#000, offx=0, offy=-1);
 -webkit-transition: all 300ms ease-in-out;
 -moz-transition: all 300ms ease-in-out;
 -ms-transition: all 300ms ease-in-out;
 -o-transition: all 300ms ease-in-out;
 transition: all 300ms ease-in-out;
}
.navbar > li.drpdown a:hover:after,.navbar > li a:hover {
 color:#ccc;
}
.navbar > li.drpdown:hover .drpcontent {
 display:block;
}
.navbar > li:first-child {
 border-left:1px solid #1a1a1a;
}
.navbar > li:last-child {
 -webkit-box-shadow: inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25),inset -1px 0px 0px 0px rgba(255, 255, 255, 0.25);
    box-shadow: inset 1px 1px 0px 0px rgba(255, 255, 255, 0.25), inset -1px 0px 0px 0px rgba(255, 255, 255, 0.25);
}
.navbar > li > a {
 position:relative;
 display:block;
 width:100%;
 text-decoration:none;
 font-size:12px;
 color:#fff;
 text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.4);
    filter: dropshadow(color=#000, offx=0, offy=-1);
 z-index:4;
 -webkit-transition: all 300ms ease-in-out;
 -moz-transition: all 300ms ease-in-out;
 -ms-transition: all 300ms ease-in-out;
 -o-transition: all 300ms ease-in-out;
 transition: all 300ms ease-in-out;
}
.navbar > li:hover {
 -webkit-box-shadow: inset 0px -2px 8px 0px rgba(0, 0, 0, 0.35);
 box-shadow: inset 0px -2px 8px 0px rgba(0, 0, 0, 0.35);
}
.navbar > li > a > span {
 position:relative;
 font-weight:bold;
 margin:0 15px 0 0;
}
.navbar > li  .drpcontent {
 position:absolute;
 display:none;
 margin:0;
 padding:20px 0 0 0;
 z-index:5;
 top:36px;
 min-width:200%;
 float:none;
 list-style-type:none;
 border:1px solid #737373;
 border-top:0;
 -webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25),inset 0px 6px 4px -4px rgba(0, 0, 0, 0.5);
 box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25),inset 0px 6px 4px -4px rgba(0, 0, 0, 0.5);
 -webkit-border-radius: 0px 0px 4px 4px;
 border-radius: 0px 0px 4px 4px;
 background: rgb(249,249,249);
 background: -moz-linear-gradient(-45deg,  rgba(249,249,249,1) 0%, rgba(229,229,229,1) 100%);
 background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(249,249,249,1)), color-stop(100%,rgba(229,229,229,1)));
 background: -webkit-linear-gradient(-45deg,  rgba(249,249,249,1) 0%,rgba(229,229,229,1) 100%);
 background: -o-linear-gradient(-45deg,  rgba(249,249,249,1) 0%,rgba(229,229,229,1) 100%);
 background: -ms-linear-gradient(-45deg,  rgba(249,249,249,1) 0%,rgba(229,229,229,1) 100%);
 background: linear-gradient(135deg,  rgba(249,249,249,1) 0%,rgba(229,229,229,1) 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#e5e5e5',GradientType=1 );
 -webkit-transition: opacity 300ms ease-in-out;
 -moz-transition: opacity 300ms ease-in-out;
 -ms-transition: opacity 300ms ease-in-out;
 -o-transition: opacity 300ms ease-in-out;
 transition: opacity 300ms ease-in-out;
}
.navbar > li:not(:last-of-type) .drpcontent {
 left:-1px;
}
.navbar > li:last-child .drpcontent {
 right: -1px;
}
.drpcontent li {
 position:relative;
 text-align:left;
 border-bottom:1px solid rgba(0, 0, 0, 0.2);
 font-size:12px;
 line-height:35px;
 height:35px;
 font-weight:bold;
 -webkit-box-shadow: inset 0px -1px 0px 0px rgba(255, 255, 255, 0.2);
 box-shadow: inset 0px -1px 0px 0px rgba(255, 255, 255, 0.2);
 overflow:hidden;
}
.drpcontent li:before {
 position:absolute;
 display:block;
 content: "";
 width:100%;
 height:100%;
 top:-100%;
 left:0;
 background: #cecece;
 -webkit-transition: all 500ms ease-in-out;
 -moz-transition: all 500ms ease-in-out;
 -ms-transition: all 500ms ease-in-out;
 -o-transition: all 500ms ease-in-out;
 transition: all 500ms ease-in-out;
 opacity:0;
}
.drpcontent li:after {
 position:absolute;
 display:block;
 content: "\0025b6";
 height:20px;
 width:20px;
 top:0;
 left:6px;
 font-size:8px;
 -webkit-transition: all 500ms ease-in-out;
 -moz-transition: all 500ms ease-in-out;
 -ms-transition: all 500ms ease-in-out;
 -o-transition: all 500ms ease-in-out;
 transition: all 500ms ease-in-out;
}
.drpcontent li:hover:before {
 top:0;
 opacity:0.8;
}
.drpcontent li:hover:after {
 color:#fff;
 left:12px;
}
.drpcontent li:last-child:hover:before {
 -webkit-border-radius: 0px 0px 4px 4px;
 border-radius: 0px 0px 4px 4px;
}
.drpcontent li a {
 display:block;
 height:100%;
 width:100%;
 position:relative;
 color:#000;
 text-decoration:none;
 width:100%;
 padding-left:20px;
 -webkit-transition: all 500ms ease-in-out;
 -moz-transition: all 500ms ease-in-out;
 -ms-transition: all 500ms ease-in-out;
 -o-transition: all 500ms ease-in-out;
 transition: all 500ms ease-in-out;
}
.drpcontent li:hover a{
 color:#fff;
 padding-left:26px;
}
.drpcontent li:first-child {
 border-top:1px solid #a6a6a6;
}
.drpcontent li:last-child {
 border:0;
 -webkit-box-shadow:none;
 box-shadow:none;
 -webkit-border-radius: 0px 0px 4px 4px;
 border-radius: 0px 0px 4px 4px;
}
.icon20{
 position:relative;
 float:left;
 display:block;
 width:20px;
 height:20px;
 margin:6px 8px 0 8px;
 background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAAoCAYAAAA16j4lAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NjJERkRDNTBDNUQ0MTFFMUI3QjJDOTZFNDMzQ0IwMjciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NjJERkRDNTFDNUQ0MTFFMUI3QjJDOTZFNDMzQ0IwMjciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MkRGREM0RUM1RDQxMUUxQjdCMkM5NkU0MzNDQjAyNyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo2MkRGREM0RkM1RDQxMUUxQjdCMkM5NkU0MzNDQjAyNyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Psj8MzMAAA91SURBVHja7FxbbBTV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") no-repeat;
 -webkit-transition: all 300ms ease-in-out;
 -moz-transition: all 300ms ease-in-out;
 -ms-transition: all 300ms ease-in-out;
 -o-transition: all 300ms ease-in-out;
 transition: all 300ms ease-in-out;
}
.icon20.home {background-position:0 0;}
.icon20.upload {background-position:-20px 0;}
.icon20.download {background-position:-40px 0;}
.icon20.comments {background-position:-60px 0;}
.icon20.theme {background-position:-80px 0;}
.icon20.login {background-position:-100px 0;}
.navbar > li:hover .icon20.home {background-position:0 -20px;}
.navbar > li:hover .icon20.upload {background-position:-20px -20px;}
.navbar > li:hover .icon20.download {background-position:-40px -20px;}
.navbar > li:hover .icon20.comments {background-position:-60px -20px;}
.navbar > li:hover .icon20.theme {background-position:-80px -20px;}
.navbar > li:hover .icon20.login {background-position:-100px -20px;}
Save templates

HTML Code: 
You can add this code to widget  HTML / Javascript.


<script type="text/javascript" src="https://bloggerknown.googlecode.com/files/jquery.min.js"></script>
<ul class="navbar color1">
 <li><a href="#"><i class="icon20 home"></i><span>Home</span></a></li>
 <li><a href="#"><i class="icon20 upload"></i><span>Upload</span></a></li>
 <li><a href="#"><i class="icon20 download"></i><span>Download</span></a></li>
 <li class="drpdown"><a href="#"><i class="icon20 comments"></i><span>Posts</span></a>
  <ul class="drpcontent">
   <li><a href="#">Latest Posts</a></li>
   <li><a href="#">Popular Posts</a></li>
   <li><a href="#">Private Posts</a></li>
  </ul>
 </li>
 <li><a href="#"><i class="icon20 login"></i><span>Login</span></a></li>
 <li class="drpdown"><a href="http://www.bloggerknown.blogspot.com/"><i class="icon20 theme"></i><span>Themeselector</span></a>
  <ul class="drpcontent" id="themeselect">
   <li><a href="#" data-color="color1">Orange</a></li>
   <li><a href="#" data-color="color2">Marine</a></li>
   <li><a href="#" data-color="color3">Green</a></li>
   <li><a href="#" data-color="color4">Purple</a></li>
   <li><a href="#" data-color="color5">Red</a></li>
  </ul>
 </li>
</ul>


Replace # with the URL and replace the blue text with the name you want the navigation menu.
Extras!!!. If there is an error on your blog in the navbar. Please replace the text that reads navbar on CSS3 code above.

Read More

How to Add Facebook Like Box to Your Website/Blog

How to Add Facebook Like Box to Your Website/Blog

Add Facebook Like Box
The previous troutal we have learned how to create facebook page for website/blog and business and in this post we will learn how to add Facebook like box or Facebook button to website/blog.

A Facebook “Like Box” on your web site is a good way to increase the number of people who “like” your Facebook Fan page. When we add a Facebook box into our site our fan follow easily our site through Facebook and easily get all update via Facebook. Let’s see how we can add the Facebook Like Box(the newer version of Fan Box) to a website or blog in a few minutes.



Note: If you probably did not create Facebook fan page for your website then please read our previous post how to create Facebook page for website or blog.

Follow steps to add Facebook like box to your website/blog.

  1. Go the Like Box Social Plugin Facebook page
  2. Enter the web page address or URL of your Fan page in in the first box; for example: http://www.facebook.com/bloggerknown
  3. Customize the width, color and what things you would like to appear in the Like Box that will be shown on your page
  4. Click the Get Code button and copy the text in the iframe text box (Do not copy the XFBML text box)
  5. put this code is the place you want to show , 
  6. Blogger > Go to Blog Dashboard > Layout > Add Gadget > Edit HTML and past code in html box.
If you want to change the design options simply repeat all the steps above. If you have any problem then please use comment box for feedback and other suggest.

Read More

Follow Me on Facebook.com

About

Followers

Popular Posts