Fan box facebook en blogguer

Hoy veremos como poner una fan box de facebook en tu blog =3
es muy sencillo,  lo primer que tenemos que haces es crear una pagina de nuestro blog en facebook en esta direccion http://www.facebook.com/pages/create.php

ahora pulsaremos  "agregar un panel para tus fans en tu sitio web"



pulsamos en agregar panel en blogger  ( en cualquier otra opcion tambien es muy facil, pero este tutorial es para blogger)




ponemos los datos de nuestro blog y listo... =3


a menos que desidamos personalizar los colores del panel    ESTO ES SOLO PARA USUARIOS "AVANZADOS"  pero bueno les dare una pista de como hacerlo

Necesitamos crear  una plantilla css para nuestro fan box
para crear la plantilla css   usaremos  esta de base

.fan_box
.full_widget
.connect_top {
border: none;
background-color: #111111;
float:left;
padding-top:30px;
}
.fan_box
.full_widget {
border: none;
background-color:#111111;
}
.connect_top a {
color: #cccccc;
}
.connect_top {
background-color: #111111 !important;
}
.connect_top a:hover {
color: #CC0000;
}
.fan_box
.connections {
background-color: #111111;
border: none;
color: #666666;
}
.fan_box
.connections_grid
.grid_item
.name {
color: #666666;
}
.fan_box
.connections_grid
.grid_item
.name a:hover{
color: #ffffff;
}
.connect_button{
color:#666666;
background-color:#111111;
}
.UIActionButton_Text, .UIActionButton_Wrap{
background:#222222 none no-repeat scroll 0 0;
display:block;
}
.UIActionButton_BlueText .UIActionButton_Text {
color:#cccccc;
}
.name_block{
background-color:#111111;
width:180px;
margin:0;
padding:0;
}
.name a:hover{
color: #ffffff;
}
a:hover{
color:#ffffff;
}

No explicare que es cada linea... los nombres son un poco intuitivos.. y la verdad no se que es cada linea pero si lo piden quisas lo escriba en otro post.
solo les dire quie   #fffffff  son  codigos de color en hexadecimal  y cambiandolos es como cambiamos el color de nuestra fan box


ahora montamos nuestra plantilla css un servidor
nota: el archivo tiene que tener extencion .css

Expandimos  la opcion de Edtirar contenido  y buscamos la linea que diga stream = " " y enseguida colocaremos esto

css = "la direccion web de tu css"

 y con esto queda.. y ya tenemos una  fan box de facebook en blogger