Cajas de Facebook, Twitter y Google+ para tu Blog

El objetivo de La Academia de Marketing Online es ayudarte a construir un blog rentable en Internet, paso a paso, compartiendo contigo todo lo que he aprendido durante los últimos 15 años en este sector.

Creo que uno de los errores más grandes que podría cometer sería asumir que todos mis Lectores están al mismo nivel, que cuentan con los mismos conocimientos, o dar por supuesto que saben ciertas cosas que en realidad pueden no ser tan obvias para aquellos que se inician en esta apasionante aventura.
No quiero que ningún Lector se quede atrás, ni que nadie se sienta desmoralizado porque vamos demasiado rápido, por tanto cuando me llega la misma consulta varias veces de Lectores diferentes creo que es útil crear una respuesta algo más detallada y compartirla con todos vosotros.
En este artículo voy a responder detalladamente a una de las preguntas que recibo con más frecuencia: ¿cómo se crea una caja de seguidores de Facebook, Twitter o Google+ para insertar en un blog?
Estos módulos – que habrás visto miles de veces típicamente en la barra lateral de otros blogs – son muy fáciles de crear, y a continuación te voy a enseñar exactamente cómo puedes hacerlo tú también.

Cómo Crear un Like Box de Facebook para tu Blog
La caja de Facebook – históricamente conocida como “Like Box” aunque su nombre oficial es “Facebook Page Plugin” – se ha renovado recientemente y es una buena forma de generar interactividad en tu blog.
El objetivo es que si alguien aterriza en tu blog y le gusta tu contenido, pueda seguir las actualizaciones de tu página fácilmente en Facebook con un sólo click.
Por defecto, el Like Box de Facebook suele incluir las fotos de perfil de un grupo aleatorio de tus seguidores, el número de “Me Gusta” que tiene la página en Facebook que estás promocionando, un enlace de texto al canal, un botón de “Like” y un botón de “Compartir” (aunque como veremos más adelante todos estos aspectos se pueden personalizar).
Para crear una caja de Facebook para tu blog, lo primero que tienes que hacer es dirigirte a esta página de desarrolladores de Facebook (no te asustes por el nombre, realmente no tienes que desarrollar nada porque el proceso es tremendamente sencillo).
Caja de Facebook
Verás que tienes 6 opciones:
Facebook Page URL: Es un campo obligatorio que tendrás que completar con la URL completa de tu Fan Page en Facebook (por ejemplo, en mi caso https://www.facebook.com/AprendeMarketingOnline).
Width: El ancho en píxeles que quieres para tu módulo (el valor mínimo es de 280px y el máximo es de 500px). En general este tipo de cajas se insertan en la columna de navegación lateral del blog, y un valor habitual es de 300px aunque tendrás que hacer distintas pruebas para ver cómo queda mejor.
Height: La altura en píxeles que quieres para tu módulo (el valor mínimo es de 130 px). Esto es cuestión de gustos, pero personalmente me gustan más las cajas equiláteras – cuadrados – así que si has especificado un ancho de 300px prueba con una altura también de 300px.
Show Friend’s Faces: Esta opción (habilitada por defecto) permite mostrar u ocultar pequeñas fotografías con las caras de tus seguidores en la propia caja de Facebook. Mi recomendación es que lo mantengas, ya que es indudable que hay un efecto social y el hecho de que tus nuevos Usuarios vean caras de personas reales que ya te sigan tiende a facilitar que ellos también te sigan.
Hide Cover Photo: Si marcas esta opción, la imagen de portada de tu Fan Page desaparecerá, y en su lugar quedará simplemente el nombre de tu página en Facebook y tu propia imagen de perfil. En la siguiente imagen puedes ver la diferencia perfectamente:
Caja de Facebook
Show Page Posts: Ésta última opción te permite mostrar automáticamente u ocultar las últimas actualizaciones de estado que has publicado en tu Fan Page, y por defecto está desactivado. Dependiendo de la altura que especifiques para tu caja de Facebook, probablemente no tenga mucho sentido incluirlo pero una vez más la decisión es tuya. ¡En tu blog mandas tú!
Cuando hayas configurado la caja según el aspecto deseado, simplemente tendrás que hacer click en el botón azul de “Get Code” y se abrirá una ventana emergente con dos trozos de código así:
Caja de Facebook
La fórmula exacta para implementar este código en tu blog dependerá de la herramienta que estés utilizando.
Si utilizas WordPress (aprende aquí a crear tu blog con WordPress paso a paso) habitualmente tendrás que abrir el archivo “header.php” con el editor de plantillas que encontrarás en el menú de “Apariencia” (dentro del “Dashboard” de WordPress, y pegar el primer trozo de código inmediatamente después de la etiqueta “body”:
Luego, tendrás que crear un nuevo Widget a través de la opción correspondiente (también en el menú de “Apariencia”), posicionarlo donde quieras incluir tu caja de Facebook y pegar el segundo trozo de código.

Si utilizas Blogger (la herramienta gratuita de creación de blogs de Google), primero tendrás que editar el código HTML de tu plantilla (recuerda siempre hacer una copia de seguridad). Localiza la etiqueta:

Y pega el primer trozo de código entre las etiquetas de apertura y cierre “body”. Finalmente, desde el menú de “Diseño” de Blogger, añade un Gadget del tipo HTML, sitúalo donde quieres que aparezca tu caja de Facebook, y pega el segundo trozo de código.

¡Ya está! No ha sido tan complicado, ¿verdad?

Por cierto, si quieres modificar el aspecto visual del código una vez insertado en tu página, puedes hacerlo directamente modificando los componentes del segundo trozo de código según estos parámetros:

Caja de Facebook

De esta forma, si quieres probar distintas medidas o ver cómo queda tu caja sin las fotos de tus seguidores, simplemente puedes modificar el código y guardar tu plantilla sin necesidad de volver a esta página inicial de Facebook para configurarlo todo desde cero.

¡Listo!

Cómo Crear una Caja de Twitter para tu blog

En primer lugar, para crear una caja de Twitter tendrás que estar identificado así que dirígete a http://www.twitter.com y accede a tu cuenta.

Una vez estés identificado, copia y pega esta URL en tu navegador: https://twitter.com/settings/widgets.

Desde esta página, selecciona la opción de crear un nuevo widget así:

Caja de Twitter

La opción por defecto es la de añadir cualquier cronología pública de Twitter en tu blog, configurando las distintas opciones de la herramienta incluyendo la fuente de tu cronología (es decir, tu nombre de Usuario en Twitter) y las distintas opciones de visualización:

Caja de Twitter

Al igual que vimos cuando creamos la caja de Facebook, aquí la clave es probar distintas opciones hasta dar con una combinación apropiada para tu propio blog.

Como verás, la caja de Twitter tiene un ancho predefinido de 600px que probablemente será demasiado ancho para tu columna lateral, con lo cual tendrás que reducir este valor para que el widget no se salga de tu página.

Podrás elegir una plantilla clara (por defecto) u oscura, y si lo deseas modificar el color de los enlaces para que encaje con la estética de tu blog. Ya sabes, ¡prueba y error!

Cuando hayas concluido la personalización, haz click en el botón azul de “Crear Widget” (verás en la parte superior de la página un mensaje de confirmación) y copia el código que aparecerá en el formulario inferior:

Caja de Twitter

La implementación de la caja de seguidores de Twitter en tu blog es bastante más sencilla que la de Facebook, ya que en este caso no es necesario modificar el código fuente de tu página editando la etiqueta “body”. Simplemente tendrás que crear un nuevo Widget si utilizas WordPress (o un nuevo Gadget HTML si utilizas Blogger), situarlo donde quieras y pegar el código de Twitter.

¡Voilá! Ya hemos aprendido cómo incluir dos de los módulos de interacción social más importantes, pero si te has quedado con ganas de más vamos a ver el tercero.

Cómo Crear una Caja de Google+ para tu blog

Bien es cierto que Google+ no es la red social más popular del mundo en estos momentos, pero se rumorea que tiene ciertos efectos positivos (no confirmados) en materia de posicionamiento web.

Hay que reconocer que la red social de Google funciona muy bien, especialmente si estás acostumbrado a utilizar otros productos de la compañía como YouTube o Gmail, así que en función de tu situación particular quizás optes por tener una presencia algo más destacada en Google+ en cuyo caso te vendrá bien incluir la cajita correspondiente en tu blog para facilitar la interacción con tus Usuarios.

Vamos a ver cómo se hace.

Para empezar, aquí todo el mundo tiene su propio nombre para todo, y el nombre oficial de la caja de Google+ es “Insignia”. Jejeje. Para volverse loco con tanta chapa, caja, cajita, widget, gadget y ahora insignia. En fín…

En primer lugar, dirígete a la URL https://developers.google.com/+/web/badge/?hl=es y asegúrate de estar identificado en Google.

Caja de Google Plus

Como puedes ver, el proceso de configuración es muy clarito y lo primero que tienes que hacer es seleccionar tu nombre de Usuario de Google+ en el desplegable. Si has creado una página corporativa en Google+ es posible que tengas distintas opciones, así que asegúrate de especificar la cuenta que realmente vayas a utilizar para interactuar con tus Usuarios (no tu cuenta personal).

Visualmente podrás seleccionar si quieres un insignia (con la correspondiente imagen de cabecera que puedes personalizar desde tu perfil de Google+) o simplemente el icono de esta red social que es bastante más soso.

Podrás configurar la orientación (horizontal o vertical), y especificar el ancho de la insignia junto con el tema de color, si quieres que aparezca tu foto de portada y la descripción de tu perfil.

Por último, selecciona el idioma que quieres para tu insignia que fundamentalmente afecta el texto del botón de “Seguir”.

Cuando tengas todo configurado a tu gusto – una vez más la prueba y error es fundamental – simplemente tendrás que insertar la primera etiqueta en la sección “head” o justo antes de la etiqueta de cierre “body” de tu blog, y la segunda etiqueta donde quieras que aparezca el widget:

Sí, al igual que en el caso de Facebook me temo que para insertar la insignia de Google+ adecuadamente en tu blog tendrás que modificar el código fuente o las plantillas de tu página, pero no tienes nada que temer; así es como se aprende, aunque antes de tocar nada te recomiendo siempre hacer una copia de seguridad por si las moscas…. Una simple coma de más insertada accidentalmente podría inutilizar tu blog, pero si tienes una copia de seguridad de tu plantilla no tendrás problema en restaurar la última versión operativa y las cosas volverán a la normalidad.

No quiero meterte miedo, pero antes o después todos sufrimos uno de estos desastres (antes o después también te sucederá a ti) y precisamente en esos momentos es cuando más aprendemos : )

Conclusión

Y ahí lo tienes, ya has aprendido cómo incluir en tu blog cajas (o “widgets”) de Facebook, Twitter o Google+ en tu blog para interactuar con tus Usuarios.

Ojo, el hecho de que ahoras sepas hacerlo no significa que debas hacerlo… ¡Al menos no las tres cajas! Si lo piensas, no tiene mucho sentido llevar a tus Usuarios desde tu blog a cualquiera de estas tres redes sociales, si realmente no actualizas esas redes con regularidad ¿verdad?

Más vale incluir solamente uno de los widgets que hemos visto anteriormente, y que realmente los Usuarios que decidan seguirte en esa red social reciban contenido de valor añadido que les haga volver una y otra vez.

¡Hasta la próxima!

Este artículo apareció primero en OscarFeito.com