Como crear un icono o botón para que enlazen tu blog


Si queremos crear un icono o botón para que puedan enlazar nuestro blog de blogger, deberemos hacer lo siguiente:



Crear un blog de blogger blogspot

  

1) Vamos a esta página: lucazappa.com


2) Nos encontraremos con la siguiente pantalla:


3) Aquí crearemos un icono como el de arriba dividio en dos partes. En el bloque de arriba vemos que pone "pixels from the... (0 to 80)" Si ponemos el valor 40, el icono que creemos estará igualado, es decir, left box y right box tendrán el mismo tamaño.

4) Modificar los valores a nuestro gusto y cuando esté listo le damos a create para ver el resultado final. Una vez finalizado le damos a save it! (a la derecha del logo creado). Nos aparecerá una ventana para guardarlo en nuestro PC. Si queremos podremos subirlo a imageshack.us directamente clicando en el enlace host to imageshack. Nos guardamos el link.

5) Ahora sólo queda crear una ventana o gadget para poder añadir un código HTML para que lo copien nuestros lectores y nos enlacen. Para ello hacemos lo siguiente: Vamos a Diseño -> Elementos de página -> Añadir un gadget -> HTML/Javascript.

6) Pegaremos el siguiente código:


<center><div class="widget-content">

<a href="http://www.TUBLOG.com/" target="_blank"><img width="80" alt="TU TEXTO" src="http://LINKDETUICONO.png" height="15"/></a>

<br/>

<textarea><a href="http://www.TUBLOG.com/" target="_blank"><br/><img width="80" alt="TU TEXTO" src="http://LINKDETUICONO.png" height="15"/></a></textarea></div>
</center>


Nota: Si te fijas en este código, al principio y al final poner "center". Es para que quede centrado este gadget. A mitad de código nos encontramos con br, es para crear un espacio. Se puede eliminar si se desea.

Pones tus datos y ya está listo.

44 comentarios:

  1. excelente explicacion y muy util !

    gracias.

    ResponderEliminar
  2. Hola Viviana y Sofia! Me alegro que te sea útil. Llevaba días pensando en hacer esta entrada.

    Un saludo y gracias a ti.

    ResponderEliminar
  3. wenas buen post aunque aun no me he enterado para que sirve clico sobre de el y me sale mi misma pagina jejeje weno al grano en que parte coloco este gatget de mi blog,pq con esa caja de texto queda muy mal y explicame para que sirve que se muestre esa caja de texto con codigos gracias de antemano

    ResponderEliminar
  4. Hola goyu73, muchas gracias por tu comentario.

    Sirve para que los usuarios de tu web pongan ese icono en su web y asi te enlacen.

    La caja de texto sirve para que puedan copiar el codigo para luego pegarlo en la sidebar.


    Espero haberme explicado, un saludo goyu!

    ResponderEliminar
  5. Hola.
    Que gusto es para mi escribir este mensaje, solo queria agradecerte por la ayuda que nos haz brindado dando tus conocimientos para mejorar nuestra pagina web.
    Como webmaster lo importante que es el generar trafico hacia un sito, para que este empiece su crecimiento se necesita dedicación y conocimiento por ello he escrito un entrada donde explico como conseguir esos enlaces para aumentar nuestro PageRank,me gustaría que me visitaras y si el contenido es agradable para ti pues, me gustaría tu ayuda para que me enlazaras en tu blog. Al final de mi blog puedes encontrar tu enlace en mi blog.

    Gracias por tu ayuda.
    jongale
    http://ghgdinero.blogspot.com/2009/09/generar-trafico-en-paginas-web.html

    ResponderEliminar
  6. Concuerdo con el de arriba eres muy buena persona al compartirnos tu conociminto sobre esto, una cosa yo llgue aqui solo por crear un indice y ahora te tengo en mis favoritos, esta herramienta me fue muy buena.

    PD. Tu esfuerzo a sido premiado y te he enlazado a mis dos blogs, les hechas un vistazo cuado puedas ¿Vale?

    ResponderEliminar
  7. @ goyu73. Gracias a ti por ser un fiel seguidor de este humilde blog.

    @ Jongale. Gracias por tu comentario y por tus consejos. Lamentablemente no puedo enlazar el blog de todos los visitantes de este blog, sino me convertiría en un directorio jeje. Siento esto, espero que lo entiendas. Agradezco mucho tu enlace y enhorabuena por tu muy fantástico blog. Saludos.

    @ Gigaman x. Gracias por tus palabras y sobre todo gracias por enlazarme, te lo agradezco de corazón. Saludos.

    ResponderEliminar
  8. Hola!! antes de nada darte las gracias otra vez por la gran ayuda que me estas dando, gracias. He puesto el codigo tal cual lo dices, y en el texto he puesto lo que quiero que salga debajo del cuadro, igual que tu tienes aqui, sin embargo no me aparece el texto, aparece dentro del codigo, no se si hice algo mal, sale el cuadro pero no el texto de abajo, no si me explique bien...a ver si me puedes ayudar por favor. Y gracias de antemano!!!

    ResponderEliminar
  9. Hola Olga. Me alegro de volverte a ver po aquí :)

    Para poner un texto y que éste esté fuera de la caja debes poner el texto antes de div class="widget-content"

    Espero que te sirva, si no es lo que quieres por favor comunícamelo. Saludos ;)

    ResponderEliminar
  10. Hola!! gracias, aqui estoy deborando todo tu blog...jejej..pero mira, acabo de volver a hacerlo como me has dicho y ahora me salia el texto pero se me descoloco el boton, asi que mira, lo dejare asi y ya esta para no complicarme mas...jejej muchas gracias!!! aqui sigo!!

    ResponderEliminar
  11. Hola Olga. Después del código del paso 6) verás que hay unas explicaciones. No las has seguido. Debes poner tus propios datos. Revísalo, porque sino no van a poder enlazarte correctamente.

    ResponderEliminar
  12. Hola, pero si que puse mis datos!!! el blog, y el texto y el link de la foto!!!

    Pero voy a hacerlo otra vez a ver que pasa, porque si que lo he puesto...sino no se como hacerlo....

    ResponderEliminar
  13. Pues a mí me aparece el logo que yo tengo puesto en esta misma entrada (el que pone crear blog). El código que debes pegar es el último que aparece, y en él debes poner tu propio icono y tus datos (link de tu web, link de tu icono y tu texto).

    ResponderEliminar
  14. Lo volvi a hacer, a ver ahora!! El icono es el mismo porque yo lo puse asi, pero si pinchas en el veras que vas a mi pagina, dime si esta mal que lo haya puesto igual y lo cambio....

    ResponderEliminar
  15. Hola Olga. Claro que no me molesta, pero opino que deberías tener tu propio icono para que te enlacen. En el mundo del marketing es importante tener tu propia imagen para diferenciarte ;)

    Un saludo.

    ResponderEliminar
  16. Ah,ok, tienes razon, voy a cambiarlo ahora, gracias por tu sinceridad, no me habia dado cuenta que lo de crear blog es por el nombre de tu blog...que cabeza la mia..perdon...jjj

    ResponderEliminar
  17. Si pongo un banner de que tamaño sugieres que sea?

    ResponderEliminar
  18. @ Olga. Lo de "crear blog" va por mi blog jejeje. Gracias a ti ;)

    @ MaxXx. Te recomiendo las medidas de 80x15 que son las del icono que empleo en esta entrada. Pero si lo deseas también puedes poner otras medidas superiores, pero personalmente nunca pasaría de un tamaño 125x125. No creo que haya mucha gente dispuesta a regalar tanto espacio de su blog para enlazar al tuyo.

    Un saludo a los dos. Gracias por comentar.

    ResponderEliminar
  19. Hola! No sabes como esta sirviendo tu Página, hace mes y medio hice un blog www.bebeunico.blogspot.com y pues aun me falta mucho para dejarlo como quiero, pero gracias a ti se me esta haciendo más facil.
    Anny

    ResponderEliminar
  20. Hola Anny, me alegro que mi blog te esté sirviendo, es un placer para mí. Un saludo y bienvenida al blog, espero volverte a ver por aquí.

    ResponderEliminar
  21. Hola.

    Tu pagina es genial.
    Para ser sincero, desde que di con esta gran página he implementado algunas cositas y me gusta como está quedando mi blog.
    Pero mira que me pasa algo:

    En mi blog, tengo el Main Wrapper y 2 sidebars.
    He creado el cruadro de enlace y lo añado a la barra lateral pegada al costado derecho.
    Cuando lo guardo y veo el blog, la ventana del navegador se amplia horizontalmente porque el cuadro "amplia el ancho" del blog.

    Te agradecería mucho si pudieras decirme como solucionarlo.
    Gracias.!

    ResponderEliminar
  22. Hola, bienvenido al blog y gracias por tu consulta. ¿En cual de tus dos blogs te ocurre eso? ¿Podrías ponerlo de nuevo para que pueda ver el problema? Gracias.

    ResponderEliminar
  23. Mira, ya he añadido de nuevo el widget para que le eches un vistazo.
    Es en el primer blog.

    Gracias de antemano por tu ayuda. =D

    ResponderEliminar
  24. Estoy revisando tu plantilla y parece que todo está bien. No entiendo qué es lo que te ocurre. ¿Lo has pegado en un gadget HTML/Javascript verdad? Trata de quitar el texto de abajo de muchas gracias y deja únicamente el código de esta entrada pero con tus propios datos.

    ResponderEliminar
  25. Hola.

    Ya lo he logrado.
    Despues de jugar y probar un rato con atributos del textarea lo he logrado, el problema estaba en la parte de atribución de valores en css de la plantilla, donde estaba predefinido todas las textareas de un tamaño enorme.

    Ya está listo y funcionando.
    http://pasaralanacho.blogspot.com
    Muchas gracias por tu guía.

    ResponderEliminar
  26. Me alegro que ya esté todo bien :) Saludos.

    ResponderEliminar
  27. gracias :) apenas me aventure a abrir mi blog y me hacia ilusion tener banner (asi no me enlacen todavia) jaja .. no sabia como enlazarlo y el codigo que pusiste al final me sirvio mucho, solo modifique el tamaño
    mil gracias.

    ResponderEliminar
  28. Hola Libertad. Me alegro que te haya servido. Gracias a ti ;)

    ResponderEliminar
  29. bien!!! funcionó a la perfección, aunque te confieso algo? yal o tenia en el blog y todo y me dije...pero porque pone crear blog???? jajajaj. Casi me da algo cuando digo, claro! si es el nombre de su blog, jaja, que pardilla. Eres un crack....(creo que me he enamorado de ti, pero que no lo sepa mi chico) GRACIAS

    ResponderEliminar
  30. hola quisiera que me ayudes quisiera saber como promociono mi banner porfa ayudame tengo solo 15 años http://ronnysaldarriaga.blogspot.com/

    ResponderEliminar
  31. Muchisimas Gracias! Gracias a tu Blog m¡ el mio quedo muy lindo jaja!

    ResponderEliminar
  32. soy muy nuevo en esto de los blogs y me has ayudado muchisimo eres un crack te tengo en mis favoritos

    ResponderEliminar
  33. Mil gracias por las instrucciones, me sirvieron de mucha ayuda =)
    Ayer mismo cree mi blog y ya tengo banner para que me enlacen! Me siento emocionada y todo xDD
    Esta clarisimo que seguire tu blog ^^
    En serio, no se como agradecerte!

    ResponderEliminar
  34. me sirve pero nose donde poner el coso que hice en esta pagina lucazappa.com

    ResponderEliminar
  35. Hola, gracias por el código y la esplicación me ayudaron bastante, quería colocar una enlaze a mi blog pero no encontraba ¿cómo?, te llevo a mi blog, y nuevamente muchas gracias eres un trome o un crack.

    saludos desde Cajamarca- Perú

    ResponderEliminar
  36. Necesito ayuda en eso, yo quiero insertar unos botones para compartir como tiene este sitio. El que más quiero es el de bitacoras.com pero no se bien como hacerlo, en una parte del código me dice que debo reemplazar por un "enlace a la entrada" o algo asi y no se que debo poner ahi.

    ResponderEliminar
  37. Pues no sé qué es lo que hago mal, pero no me sale :-( Intento crear un botón de mi blog y sigo todos los pasos, lo he intentado con la extensión de la imagen jpg y png, pero nada :-((( Me sale la caja con el texto html, eso bien, pero sobre ésta sólo aparece el nombre del blog en azul subrayado como enlace, pero no la imagen que he creado para el botón. ¿Qué estoy haciendo mal? Lo he repetido mil veces.

    De todas formas, gracias :-) Saludos.

    ResponderEliminar
  38. ME ENCANTO TODO , ESTOY LEYENDO DE A POCO, ¿COMO SE PONEN LAS FLECHITAS ESAS DE ABAJO A LA DERECHA QUE TE LLEVAN ARRIBA DEL BLOG? GRACIAS.

    ResponderEliminar
  39. Me encantó lo que explicaste, me quedó genial! Soy nueva en esto de los blogs pero me estas sirviendo de mucha ayuda.

    ResponderEliminar