Añadir botones sociales de “seguir blog” en tu sidebar│WordPress.com

Iconos socialesEsto no es una novedad, ni mucho menos. Simplemente pasa que veo que en WordPress.com no existen muchos sitios que tengan estos botones en su barra derecha o en algún lugar visible de su blog. Y dejame decirte que son muy importantes, ya que permiten obtener nuevos seguidores en las redes sociales, y por ende, tráfico futuro. Las redes sociales son, sin duda alguna, de las mayores fuentes de tráfico para todo blog.

Esta es la botonera social de Un Poquito De Todo

En este post explicaré la manera de insertarlos en tu bitácora de WordPress.com, ya que no existen en la web muchos tutoriales para esta plataforma. La mayoría se dedica a Blogger, y de a poco iré dejando nuevos tutoriales para el servicio de Automattic.

  • Para insertar los botones en tu blog de WordPress.com, lo primero que debes hacer es ir a Escritorio-> Apariencia-> Widgets. Una vez allí, elegiremos el widget cuyo nombre es ‘Texto’.
  • En este widget (‘Texto’), iremos agregando cada código dependiendo de los botones que querramos (un código debajo del otro). A continuación te dejo cada uno extraído de iniciaBlog:
Twitter pequeño

Twitter

<a href=”http://twitter.com/AQUI_TU_USUARIO” target=”_blank”><img alt=”Síguenos en Twitter” src=”https://lh6.googleusercontent.com/–aIk2uBwEKM/T3nN1x09jBI/AAAAAAAAAs8/qzDsbw3kEm8/s32/twitter32.png&#8221; width=32 height=32  /></a>

Facebook pequeño

Facebook

<a href=”http://www.facebook.com/AQUI_TU_PAGINA” target=”_blank”><img alt=”Siguenos en Facebook” src=”https://lh6.googleusercontent.com/-CYt37hfDnQ8/T3nNydojf_I/AAAAAAAAAr0/P5OtlZxV4rk/s32/facebook32.png” width=32 height=32  /></a>

Google pequeño

Google Plus

<a rel=”author” href=”https://plus.google.com/TU_ID_GOOGLE?rel=author” target=”_blank”><img alt=”Siguenos en Google+” src=”https://lh5.googleusercontent.com/-F_FBKktZWZk/T3nN0v4FeAI/AAAAAAAAAsc/7dHTxkxn4cI/s32/google32.png” width=32 height=32  /></a>

Rss pequeño

RSS

<a href=”URL_DE_TU_RSS_AQUI” target=”_blank”><img alt=”Siguenos en por RSS” src=”https://lh3.googleusercontent.com/-YH1AmjXyfVo/T3nN1ApZLnI/AAAAAAAAAsk/XhB4UGXRYm8/s32/rss32.png” width=32 height=32  /></a>

Flickr pequeño

Flickr

<a href=”URL_DE_TU_CANAL_FLICKER” target=”_blank”><img alt=”Siguenos en Flickr” src=”https://lh5.googleusercontent.com/-Pvu1pn6_OeQ/T3nNygodQfI/AAAAAAAAAr4/VucCqUE4WvI/s32/flick32.png” width=32 height=32  /></a>

Tumblr pequeño

Tumblr

<a href=”URL_DE_TU_BLOG_TUMBLR” target=”_blank”><img alt=”Siguenos en Tumblr” src=”https://lh3.googleusercontent.com/-rLA4XAhk6OM/T7YDzA-IqcI/AAAAAAAAA4I/b5-1aH8CnOg/s32/tumblr32.png” width=32 height=32  /></a>

Linkedin

Linkedin

<a href=”http://www.linkedin.com/TU_PERFIL_PUBLICO” target=”_blank”><img alt=”Siguenos en Linkedin” src=”https://lh5.googleusercontent.com/-8C0OdSp_7ZA/T3nN0G_313I/AAAAAAAAAsU/6_Hbu6Of3qU/s32/linkedin32.png” width=32 height=32  /></a>

Youtube

Youtube

<a href=”URL_DE_TU_CANAL_YOUTUBE” target=”_blank”><img alt=”Siguenos en YouTube” src=”https://lh5.googleusercontent.com/-TXzlKCbKzWs/T6mYkDhTXyI/AAAAAAAAA1U/vm95Q2KwrYg/s32/youtube32.png” width=32 height=32  /></a>

Como verás, cada uno de los códigos tiene partes en distintos colores. Esos colores son los datos que vos debes modificar. Te los paso a explicar:

Colo rojo: son los datos correspondientes de cada una de tus redes sociales. O sea, deberás cambiar esos datos e introducir los que correponden a tu red social. Ej.: http://www.facebook.com/unpoquitodetodo.com.ar

Color anaranjado: es el texto que se mostrará al pasar el ratón por encima de cada imagen. Puedes cambiarlo por uno propio. Sería el texto de ayuda al usuario.

Color verde: la URL del ícono. Si no posees un ícono propio, simplemente dejalo como está. Suponiendo que tengas tus propios íconos, entonces aquí indica la URL del mismo.

Color azul: esto indica el tamaño de los íconos, tanto el ancho como el alto. Si posees íconos más grandes y quieres aumentarle el tamaño, entonces cambia esos valores. Si miras a la derecha de Un Poquito De Todo, verás que un botón (RSS) resalta. Su tamaño es 48 x 48 px.

Y esto es básicamente todo lo que debes hacer. Cualquier duda puedes hacérmela llegar a través de un comentario o en nuestra sección contacto, que encontrarás en la barra lateral derecha.

En el próximo post, dejaré a tu disposición algunos packs y colecciones de íconos sociales para que puedas utilizarlos en este tutorial.

Saludos!

IMPORTANTE: este tutorial fue extraído de iniciaBlog y adaptado por Un Poquito De Todo.com.ar para que puedas utilizarlo en WordPress.com.

Quiero invitarte a que te suscribas a nuestro feed haciendo click en los siguientes enlaces: 

Si te pareció interesante este post, no dudes en compartirlo en las distintas redes sociales. Al final de la entrada tienes los botones sociales correspondientes. También es importante que aportes material dejando un comentario debajo de la entrada. 

29 Respuestas a “Añadir botones sociales de “seguir blog” en tu sidebar│WordPress.com

  1. Pingback: Bitacoras.com·

  2. Pingback: Colección de iconos sociales « Un Poquito De Todo·

  3. Excelente. Hay otra forma pero esta limitada solo a algunos enlaces, es a través del menú en el escritorio …Ajustes>Compartir y aparecen Facebook, Twitter, Meneame, Digg, Google+ entre otros. Solo hay que arrastrar el icono al área que dice servicios activados

    Por cierto…sabes algún truco coloque la invitación para hacer comentarios aparezca en el encabezado de las entradas. Te tratado algunos metodos y no me funcionan.

    • Te paso a explicar lo que mencionaste. Eso es justamente para compartir las entradas. Son los botones que aparecen debajo de cada entrada. Este post te explica la manera de insertar íconos en el sidebar del blog, como aparecen en este mismo a la derecha.

      Con respecto a lo que decís, no logro entender bien lo que estás buscando. Si puedes ser más claro estaría encantado en poder ayudarte.

      Un abrazo!

      • Bien….lo que busco es como hacer mas visible la zona donde dices “Deja un Comentario” en tu blog tu colocaste u nmarco mas grande y muy al final del post. Lo que yo busco es que en la parte superior de cada post así como aparecen los letreros de “Calificame” aparezca el letrero “Deja un comentario” grande y muy visible.
        Lo intente poniendo un hipertexto con el link “#respond” y no funcionó. Creo que omití algo

        Tienes alguna idea

  4. Pingback: Insertar cuadros de publicidad 125 x 125 en el sidebar de tu blog de WordPress.com « Un Poquito De Todo·

  5. ALELUYA !!!!!
    Por fin encuentro alguien que esplica de manera simple !!! milllll gracias !!! . Solo dos detallitos…
    1) tengo un problemita, el boton de twitter no se por que no me funciona bien (pero bueno, al menos ya se como cocer un boton en wordpress lol)
    y el 2) tienes algun tutorial para hacer los botones yo misma ? ^^.

    De nuevo mil gracias

    • Hola Yepar. Gracias a vos por tu comentario! Ahora voy a intentar ayudarte con lo que mencionás.

      Bien, en primer lugar mencionas que el botón de Twitter no funciona… Quizá la imagen ya no funciona, pero prueba con otro ícono de Twitter.

      Cuando te refieres a “hacer los botones yo misma”, ¿a qué te refieres? ¿Otro diseño de botones? Si a eso te refieres, pues es cuestión de saber utilizar alguna herramienta como Photoshop, o bien descargar algún pack de íconos y cambiar la URL de la imagen.

      Quizá estoy errado en mi explicación, jaja.. Pero bueno, seguimos en contacto y vamos a llegar a lo que realmente buscás.

      Saludos cordiales🙂

  6. Holaa !!!

    Si, tienes razon es el URL de Twitter que no funciona, encontre uno por internet y por fin logre poner los botoncitos.
    Leyendo tu respuesta me doy cuenta que formule mal mi pregunta😄. Conozco bien los programas de diseño (photoshop, illustrator etc), pero lo que todavia no se es como hacer el URL de una imagen para remplazarla por la parte azulita como nos mostraste.
    Busque por internet y encontre un programa que tengo que instalar, la verdad no entiendo bien. Tambien vi un forum y decian que con PC simplemente es darle click derecho a la imagen, la cosa es que tengo Mac y pues estoy algo perdida… depronto tu sabes algun truco ?

    Muchisisisisismas gracias por tu ayuda y sobretodo por la respuesta rapida😀 (vi en tu pagina que estabas ausente pense que tomaria tiempo para una respuesta jijiji )

    Saludos ! ^^

    • Hola de nuevo. Mmm, sinceramente me volví a perder! La parte azul de este tutorial indica el tamaño de los íconos. Lo que yo entendí sobre la URL (lo que pienso que es tu duda) es como sacar la URL de una imagen. Eso es? O sea, como saber la URL de una imagen?

      Si es eso, es muy sencillo. A cualquier imagen le das click derecho y le das a “copiar url de imagen”. O sino aparecen esas opciones en MAC, otra alternativa es descargar la imagen y subirla a un servidor como imageshack o subirimagenes. Hay muchos servidores para hostear fotos. Si eso no es lo que buscas, seguiremos buscando tu problema y lo vamos a solucionar, quedate tranqui jaja..

      Con respecto a mi ausencia, debo decir que el blog ya no lo sigo, pero si entro siempre por si hay algún comentario o alguna duda que alguien tenga. Ya el blog hace tiempo que no se actualiza, y posiblemente ya no lo haga, pero bueno, lo que hay estará siempre acá, y voy a intentar dar una mano a quién lo necesite🙂

      De nada, gracias a vos! Seguimos en contacto para solucionar tu duda!!

    • Gracias a vos por tu comentario! Me alegro mucho que te haya sido de ayuda. Siempre intento explicar las cosas más fáciles posible🙂 Pido disculpas por mis días de inactividad.

      Un abrazo grande desde Argentina!

    • Hóla!!
      Es posible que hayas activado la casilla que viene en debajo del widget y que pone “Añadir párrafos automáticamente”?. Si es así prueba sin hacerlo.

    • Buenas noches. Si sigues todo al pide de la letra, tendría que funcionar a la perfección. Lo que te puede llegar a pasar es que la plantilla tenga un sidebar muy pequeño y al insertar varios íconos bajen de renglón por el hecho de que ya no caben en el ancho del mismo. También te recomiendo que pruebes con la sugerencia que te ha dado kapan222. Cualquier cosa, vuelves a avisar y vamos a ver si podemos solucionar tu inconveniente🙂

      Si sigues con problemas, quisiera que me digas que plantillas estás utilizando y en qué parte estás intentando insertarlo. Perdón por mi tardía respuesta.

      Un abrazo desde Argentina.

  7. Pingback: Botones sígueme | Servicios XL·

  8. Hola.
    Es una técnica muy buena, pero al introducir el código no me aparecen las imágenes, solo el texto alternativo. Si quito el texto no me aparece nada. Las imágenes están bien linkadas y probadas en los posts. ¿Hay que modificarl el line-height del widget para que quepa?¿O algo?
    Muchas gracias.

    • Hola Juan Carlos. Bien, si haces todo tal cual indica el post, tendría que funcionar. ¿Probaste enlazando sólo una imagen en el widget? Quizá es problema de la plantilla con el ancho de la sidebar. Pero de todos modos, si no entraran a lo ancho tendrían que aparecer por debajo.

      ¿Me puedes decir la plantilla que estás utilizando así puedo probar y así ayudarte?

      Un abrazo.

      • Hola Luis.
        Estoy con la atahualpa, y el codigo que he escrito en el widget de texto es:


        Muchas gracias!!

        • Hola nuevamente. Mira, aquí no aparece el código pero igualmente lo pude ver desde mi gestión de comentarios. Tal cual me lo pasaste está mal. Así no es el código para que se vean las imágenes.

          Te voy a mandar al e-mail el código que necesitás tal cual como debe ir, para lo que necesitás, que, por lo que veo, es un enlace a tu canal de Youtube y otro a tu página de Facebook. Ahora te lo preparo y te lo envío!

          Un abrazo!!

  9. hermano muy bueno …. cuando puedas agrega mas para el blog de WordPress pasate por el mio cuando puedas …. el icono de Twitter no me sale porque sera? .. un saludo desde Venezuela

    • Hola Eternometal! Me alegro que te guste el aporte, agradezco mucho tu comentario🙂 El blog ya no lo sigo, hace mucho tiempo que no publico nuevas entradas. Simplemente lo dejo aquí por si a alguien le sirve, y veo que siempre hay alguien que lo necesita!!

      Te comento que el enlace de Twitter está caído, por eso no funciona. Pero ya mismo lo arreglo, así que cuando leas este comentario y vuelvas a intentar, ya podrás poner correctamente el botón de Twitter!

      Te dejo un abrazo, y cualquier problema que tengas, me lo hacés saber y con gusto te ayudo.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s