5 nov. 2012

Añadir gadget redes sociales en blogger



Tutorial blogger: Como añadir gadget redes sociales en blogger

En este tutorial voy a explicar cómo añadir un gadget que incluya las redes sociales donde nos pueden encontrar todos los lectores de nuestro blog.

Para el ejemplo del presente tutorial crearemos un gadget donde mostraremos los iconos de las redes sociales donde nos pueden encontrar los lectores del blog y un enlace a nuestro perfil de usuario. En este ejemplo las redes sociales que voy a incluir son las siguientes:

  1. 1. Twitter
  2. 2. Facebook
  3. 3. Google+
  4. 4. Linkedin
  5. 5. Youtube
  6. 6. Metroblog

El gadget redes sociales en blogger quedará de la siguiente manera en vuestro blog:


Ejemplo: Crear gadget en nuestro Blogger con las redes sociales que utilizamos. Cuando un lector de nuestro blog pinche en alguno de los iconos se mostrará la página de nuestro perfil.
  1. Paso 1 Nos dirigimos a la sección Diseño de nuestro blogger.
  2. Paso 2 En este momento se abre una página donde se muestra una representación visual de nuestro blog.
  3. Paso 3 Para el ejemplo actual he creado el gadget redes sociales en el panel lateral derecho, en dicho panel hacemos clic en la opción Añadir un gadget.
  4. Paso 4 En este momento se abrirá una ventana donde podremos seleccionar el tipo de gadget que queremos añadir.
  5. Paso 5 Dentro de la pestaña Lo básico seleccionamos la opción HTML/Javascript
  6. Paso 6 Al seleccionar dicha opción se abre una página donde configuraremos el gadget redes sociales de la siguiente manera:
    1. - Título: Escribir el título que queremos que se muestre al visualizar el gadget redes sociales. En mi caso he puesto "Sígueme en las redes sociales".
    2. - Contenido: Espacio destinado para poner el código HTML que queremos mostrar en el gadget redes sociales, en nuestro caso deberemos poner el siguiente:
// Icono y link a tu perfil de twitter
<a href='URL twitter' target='_blank'><img alt='twitter' src="http://2.bp.blogspot.com/-HoByHzmab00/T-WiFnncFXI/AAAAAAAAAuM/eIStHRliy7Y/s000/twitter.png" title='twitter'/></a>

// Icono y link a tu perfil de facebook
<a href='URL facebook' target='_blank'><img alt='facebook' src="http://4.bp.blogspot.com/-KGUfFpIGxDo/T-WiF2abbMI/AAAAAAAAAuU/YUHVZnWeTAQ/s000/facebook.png" title='facebook'/></a>

// Icono y link a tu perfil de google+
<a href='URL google+' target='_blank'><img alt='google plus' src="http://4.bp.blogspot.com/-FbyQUvCfcsc/T-WiGWwdzZI/AAAAAAAAAuc/23NBI95QlmY/s000/gplus.png" title='google plus'/></a>

// Icono y link a tu perfil de Linkedin
<a href='URL linkedin' target='_blank'><img alt='linkedin' src="http://3.bp.blogspot.com/-HPHUoa0ufsw/T-WiGqwz3YI/AAAAAAAAAuk/MEYc0chl5zs/s000/linkedin.png" title='linkedin'/></a>

// Icono y link a tu perfil de Youtube
<a href='http://www.youtube.com/user/masetru' target='_blank'><img alt='Youtube' src="http://static.tiendy.com/shops/mimomimascota/theme/assets/icono_youtube.png" title='Youtube'/></a>

// Icono y link a tu perfil de Metroblog
<a href='http://NombreUsuario.metroblog.com/' target='_blank'><img alt='Metroblog' src="http://blog.mp3.es/wp-content/uploads/2013/03/metro-last-light.png" title='Metroblog'/></a>

En el código de arriba deberéis sustituir el texto URL twitter, URL facebook, URL google+ y URL linkedin por la URL de vuestros perfiles en cada una de estas redes sociales.

Podríamos personalizar el código del gadget redes sociales de muchas maneras, yo os propongo las siguientes:
  1. - Personalizar el contenido de la meta etiqueta title.
  2. - Modificar contenido de la meta etiqueta alt.


Si te ha gustado el artículo sobre cómo añadir gadget redes sociales en blogger puedes visitar a alguno de nuestros patrocinadores, con esto me ayudarás a mantener el Blog y pueda escribir más artículos.

ARTÍCULOS QUE TE PUEDEN INTERESAR

Cómo guardar la configuración de una red wifi en Windows 7
Cómo abrir puertos windows 7
Atajos de teclado de Windows
Windows 7 no muestra la fecha