Tecnología

Blog de DiyDownloads Idea guardada 3 veces
La valoración media de 4 personas es: Muy buena

Cómo insertar botones de Redes Sociales en Blogger

Hoy les traigo el Tutorial de cómo insertar los botones de las Redes Sociales en Blogger.

Lo primero que vamos a hacer es Descargarnos los Botones que más nos gusten y alojarlos en hosting (hay muchos gratuitos), pero yo uso el Google Drive, que me parece más sencillo y más completo.

Una vez tengamos las imágenes subidas a Google Drive, tenemos que averiguar su URL, (si no sabes cómo hacerlo, te lo indico aquí): Tutorial URL Imágenes Google Drive

Una vez sepas ya cuáles son las URLs de las imágenes que vas a insertar para los botones, nos vamos al Blog y clicamos en Diseño:

Imagen 0

Luego clicamos en Añadir Gadget:
Imagen 1


De la lista que nos aparece, elegimos HTML:

Imagen 2


Copiamos este enlace: 

<a href='DIRECCIÓN DE VUESTRA RED SOCIAL' target='_blank'><img alt=”NOMBRE DE LA RED SOCIAL” src='URL DE LA IMAGEN' title='NOMBRE DE LA RED SOCIAL' width="60" /></a>

(Tenemos que sustituir lo que está en Negrita por los datos nuestros)

Ejemplo el Facebook mio sería así:


<a href='https://www.facebook.com/Diydownloads' target='_blank'><img alt=”facebook” src='URL DE LA IMAGEN' title='Facebook' width="60" /></a>

Y tan sólo me quedaría poner la URL de mi imagen....

Cada Enlace pertenece a un sólo Botón y por tanto a una sola Red Social, si queréis poner varios botones seguidos, por ejemplo...facebook, twitter y Pinterest, el ejemplo sería el siguiente:

<a href='https://www.facebook.com/Diydownloads' target='_blank'><img alt=”facebook” src='URL DE LA IMAGEN' title='Facebook' width="60" /></a>

<a href='https://twitter.com/Diydownloads' target='_blank'><img alt=”twitter” src='URL DE LA IMAGEN' title='Twitter' width="60" /></a>

<a href='http://www.pinterest.com/diydownloads/' target='_blank'><img alt=”pinterest” src='URL DE LA IMAGEN' title='Pinterest' width="60" /></a>

Con lo cual tendríamos que copiar en Contenido los 3 enlaces:

Imagen 3


(No os olvides que también hay que añadir las URLs de las imágenes....)

Una vez hayamos pegado todos los enlaces que queramos que nos salgan, le damos a Guardar.

Y luego clicamos en Guardar Disposición.

Le echamos un vistazo a nuestro blog y si vemos que los botones nos han quedado muy pequeños o muy grandes para nuestro gusto, sólo tenemos que volver al gadget que acabamos de crear y modificar los enlaces poniendo otro tamaño en dónde les he resaltado aquí en negrita:

<a href='https://www.facebook.com/Diydownloads' target='_blank'><img alt=”facebook” src='URL DE LA IMAGEN' title='Facebook' width="60" /></a>

<a href='https://twitter.com/Diydownloads' target='_blank'><img alt=”twitter” src='URL DE LA IMAGEN' title='Twitter' width="60" /></a>

<a href='http://www.pinterest.com/diydownloads/' target='_blank'><img alt=”pinterest” src='URL DE LA IMAGEN' title='Pinterest' width="60" /></a>

Y ya estarían los botones listos!!!

Cualquier duda comentadla que os ayudaré encantada!!!
¿Vulnera este post tus derechos? Envía una notificación de una presunta infracción de derechos. También puedes hacerlo a través de nuestro formulario de contacto.
¿Qué te ha parecido esta idea?

Recomendamos

¡No te pierdas nuestra selección diaria!

Suscríbete y recibirás en tu correo nuestras mejores ideas

Suscríbete ahora

Relacionado

BLOG blogging intermedio ...

Instalar los iconos de redes sociales en el header y sidebar de blogger

En una entrada anterior te conté cómo instalar una fuente llamada fontawesome para utilizar iconos en tus listas, páginas y entradas de blogger, para darles ese toque diferente y original que las haga especiales y visualmente atractivas. Puedes volver a revisar la entrada e instalar la fuente que te digo en el siguiente botón: CÓMO INSTALAR ICONOS EN BLOGGER Hoy, vamos a utilizar nuestros iconos p ...

general social

Cómo poner botones para que te sigan en las redes sociales en Blogger

Poner botones para redes sociales con los que tus usuarios puedan seguirte te ayudará a incrementar la presencia de tus contenidos en Internet. Si bien muchas veces preferimos utilizar botones al final de nuestra entradas para que nuestros usuarios compartan si lo desean nuestras entradas, es importante también que puedan seguirnos por las redes sociales si así lo desean. Qué mejor sitio para que ...

acuarelas diseño watercolour ...

Iconos de Redes Sociales

Hola!!! Hace unas semanas estuve ocupada haciendo estos pequeños iconos de varias redes sociales para colocar el gadget de sígueme en el blog, que ya hacía tiempo que lo tenía en mente, pero un día por otro lo había dejado pasar. Os los podéis descargar desde este enlace. Están preparados en dos tamaños, 48x48 y 32x32, para que uséis el que os vaya mejor.Os voy a explicar también como los he puest ...

general social

Cómo poner botones para redes sociales al final de tus entradas

Muchos Bloggers prefieren añadir botones para redes sociales al pie de sus entradas para que los usuarios puedan compartir el contenido que ha sido de su agrado. Vamos a aprender a colocar en el pie de entradas botones para compartir en Facebook, Twitter y Google+ nuestras creaciones.¿Qué son los botones para las redes sociales en un Blog?: Los componentes oficiales o no oficiales de las distinta ...

watercolour acuarelas free printable ...

Iconos de Redes Sociales

Hola!!! Hace unas semanas estuve ocupada haciendo estos pequeños iconos de varias redes sociales para colocar el gadget de sígueme en el blog, que ya hacía tiempo que lo tenía en mente, pero un día por otro lo había dejado pasar. Os los podéis descargar desde este enlace. Están preparados en dos tamaños, 48x48 y 32x32, para que uséis el que os vaya mejor.Os voy a explicar también como los he puest ...

internet blog tblog ...

Consultoría Blogger - Resolviendo dudas de tutoriales 3

Hola a todos!!! Ya estamos de nuevo a final de mes y vengo a resolver las dudas de tutoriales antiguos que os han surgido y que se habían quedado pendientes de resolver. Cómo añadir un menú con imágenes en Blogger Este es el código que Celia proporcionaba para poner el menú con imágenes: <div > <table> <tbody> <tr> <td> <a href="URL DE TU PÁGINA/ETIQUETA" ...

Tutoriales Redes Sociales Web

Como Personalizar botones de compartir.

Que feliz que me hace regresar al blog. Como algunos de ustedes saben, me fui de vacaciones, y regreso supercontenta, Mexico tiene lugares hermosos, llenos de historia y cultura, pero bueno esa es otra historia. Hoy vengo con un tutorial, que ya buena falta hacia por aquí en el blog. Este va a petición de mi amiga Marysol, que me ha pedido un tutorial para cambiar esos botones sociales para compar ...

avanzado BLOG blogging ...

Cómo instalar un slider de imágenes en blogger

Esta semana he recibido un correo con esta duda: ¿Cómo instalar un slider de imágenes debajo del cabecero en blogger? Y no es la primera vez que me preguntan por el mismo tema. Este tipo de correos no puedo contestarlos uno a uno, prefiero anotar las dudas y cuándo se repiten mucho, desarrollar un tutorial en el blog, para que pueda verlo todo el mundo. Si me conoces un poco, ya sabes que no soy m ...

internet blog básico ...

Cómo poner botones interactivos en tu blog

¿Te has fijado en los botones que uso en todos mis blogs de blogger? Como los que puedes ver en la barra lateral de este blog anunciando mis cursos y ebooks para bloggers y diseñadores. Son botones interactivos, yo elijo los colores y escribo el texto, el resto lo hace solito blogger gracias al código que tengo instalado en mi plantilla. Y eso es lo que voy a compartir contigo hoy. ¡Verás que es m ...

general medios sociales promocionar tu blog

Cómo poner otros botones para compartir en el blog

Os habréis dado cuenta ya que los iconos para compartir que trae Blogger, son bastante pequeñitos y discretos: Por eso yo los cambié hace ya tiempo por otros que pasan un pelín menos desapercibidos: Tampoco quiero ser "pesada" y poner unos gigantescos, pero esos me parece que se ven lo suficientemente bien como para "recordar" a la gente que pueden compartir mi post en las re ...