Holaa!!
En esta ocasión crearemos un espacio en tu blog donde los visitantes pueden dar like a tu página de facebook (sí, exactamente como el que ves a la derecha de este blog)
Primer Paso:
Debes asegurarte de tener una FanPage de Facebook.
Segundo Paso:
Bien para iniciar debes dar click a la siguiente imagen que te conducirá a la página de
Page Plugin:
Y ahora rellenar los campos según te indico a continuación:
- Facebook Page URL: Aquí pones el link de tu página en Facebook.
- Tabs: Ahi puedes escribir "timeline" si quieres que se vean tus publicaciones de la página de Facebook, o "messages" si quieres que se vean los mensajes que dejan los fans.
- Width: El ancho, en píxeles, que tendrá el cuadro, intenta que se ajuste al lugar donde la colocarás.
- Height: El alto, en píxeles, del cuadro. Cuanto más grande hagas la caja, más fotos contendrá.
- Use Small Header: Para disminuir el tamaño de la foto de portada.
- Adapt to plugin container width: Marcando esto, el ancho del recuadro se adaptará al ancho del espacio donde lo colocarás.
- Hide Cover Photo: Ocultar la foto de portada.
- Show Friend's Faces: Márcalo si deseas que se vean las fotos de tus fans.
SEGUIMOS..!!
Ahora, estando todo listo, le das click al botón Get Code y saldrá una ventana emergente parecida a esta:
Como es para Blogger usaremos el código de la parte inferior, lo copiamos
Ahora vamos a la sección de
Diseño de nuestro blog y creamos un
Gadget de
JavaScript donde pegamos el código y aceptamos.
Tercer Paso:
Debes saber que no está en la programación de Blogger el funcionamiento del Page Plugin, por lo que debemos agregar algo pequeño al código de tu blog:
Se trata de esto:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/es_ES/sdk.js#xfbml=1&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Lo copias y nos dirigimos a
Plantilla, y luego a
Editar HTML
Ahora buscamos donde diga "Body", ¿lo encontraste?, bien, no lo toques.. nos vamos al espacio de abajo que esté más cerca y pegamos el código
Deberá quedarte de esta manera con el código pegado:
Muy bien, solo queda Guardar Plantilla, y el trabajo ha concluido
Hasta la próxima ;)
