Cómo crear un banner para que nos enlacen

sábado, 23 de febrero de 2008

En el siguiente tutorial explicaré como crearnos nuestro propio minibanner para enlazarnos con otra web.

Cuando nos enlazamos con otro blog, conseguimos un acuerdo mutuo de publicidad. Es decir, "tú me dejas que me promocione en tu blog, a cambio de yo promocionarte en el mío". Es una forma de conseguir nuevos lectores y de que tu blog (o página web) se expanda más.

Para ello deberemos hacer un banner. ¿Cómo se hace? De infinitas maneras. El que yo tengo en "Enlázame" lo hice con el Adobe Photoshop CS2 (programa que recomiendo encarecidamente) combinando algunas imágenes y probando cosas. Se puede hacer hasta con el Paint, eso al gusto.

Una página interesante para sacar ideas es CoolText, que nos permite crear de manera online distintos botones, con distintas fuentes, combinaciones de colores y mucho más. Un ejemplo de lo que CoolText nos ofrece podrían ser los siguientes:



Obviamente, hay bastantes más posibilidades con fuentes, colores y estilos. Como complemento a cuando queremos hacer algo rápido y sencillo sin mucho esfuerzo.

Una vez tengamos el banner creado, con las dimensiones que queramos (es cuestión de "prueba y error") nos vamos a una web de hosting de imágenes para subir nuestra imagen. Les recomiendo que si tienen cuenta en gmail usen el servicio Picasa, el cuál nos consume un poco (muy muy poco) espacio de nuestra cuenta en gmail, a cambio de subir nuestra imagen. Si no disponemos de cuenta siempre podemos subir a Imageshack, Imagevenue, etc...

Una vez la tengamos subida, el hosting nos proporcionará un enlace a nuestro archivo recién subido (en el caso de Picasa, accedemos a la imagen como para verla > botón derecho sobre ella > Copiar ruta de la imagen)

Ahora necesitaremos saber qué código HTML/Javascript hace falta para que los que nos enlazen pongan en su web. Una página que nos proporciona esta ventaja es LinkMe. Ponemos el título que queramos que tenga el cuadro, la dirección de nuestra web/blog y el enlace de la imagen que anteriormente copiamos. Hacemos click sobre "Gerar codigo" y la web nos devolverá el código HTML/Javascript de nuestro banner.

En mi caso es el siguiente:

Una vez hecho ésto, vamos a nuestra web y en el propio código pegamos el código que LinkMe nos proporcionó. Para Blogger creamos en un sidebar un widget HTML/Javascript, lo pegamos dentro y lo guardamos.

El resultado es el que pueden ver:




Artículos relacionados


Clawder por em@il Clawder Feed Twitter

21 comentarios:

jesus dijo...

SALUDOS
he seguido el post paso a paso
pero no sale la imagen de picasa
en el baner
da error y no lo entiendo porque he hecho lo que dices
click derecho
copiar ruta
y ponerla en link imagen
y no funciona
estoy ya desesperado
el codigo funciona y al clickar salta a mi pagina
perono se muestra la imagen del banner
con lo cual no sirve de nada
si pudieras echarme un clabe te lo agredeceria
por cierto ya he añadido tu banner porque tu blog es muy bueno
gracias
un saludo

Claw dijo...

Hola!! Gracias por agregarme :)

Puede ser que te estés saltando algún paso.

Pásame el código de tu imagen y el nombre de tu blog y yo te lo hago :)

Un saludo ^^

jesus dijo...

hola tio
jeje
al final ha salido
e subido el banner a imageshack,
pagina que funciona de putísima madre y al insertar el codigo en linkme ha salido perfecto

muchas pero k muchas gracias
las instrucciones de tu post funcionan perfectamente y se siguen bien
yo he tenido problemas solo con picasa pero no tiene nada k ver

si dios quiere visitare mucho este blog porque me ha sido de gran ayuda

gracias por tu ofrecimiento
(si pasas por el blog veras el banner al final como ha kedado en la seccion AGREGA HUMORICIA)

darkcelula dijo...

muchas gracias por este tutorial
en agradecimiento te agrego a mi blog, busque por todas partes un tutorial asi y asta que lo encontre
si quieres despues te pasas por mi blog o me agregas mi correo dark_estamierda@hotmail.com

muchas gracias por el aporte

agite dijo...

Muchas gracias amigo, seguí los pasos ya que, esto es lo más importante, los entendí. ja. saludos!

Gracia Iglesias dijo...

Muchas gracias por este tutorial tan práctico, Claw. No tenía ni idea de como hacerlo y con tus indicaciones he creado mi banner y lo tengo ya en mi blog.
Gracias también a Jesús por el consejo de hospedar la foto en Imageshack, porque también a mí me dio problemas Picasa y con Imageshack lo conseguí.

HARGOS dijo...

Perfecto genial ,yebaba dias intentando hacer un lik-me y gracias a ti lo he consegido ,somos HARGOS de ECOS DE BERGONDO,pongo tu enlace en nuestra pagina .
Un saludo y muchas gracias

Claw dijo...

De nada a todos los que me habeís agradecido :P. Y gracias hargos por el enlace.

Suerte a todos!! :)

Anónimo dijo...

Hola:

He conseguido crear el banner para mi blog, pero es que me ha salido muy grande y no consigo encontrar el sitio donde se puede reducir. ¿Podrías ayudarme?

Claw dijo...

Hola!

Puedes usar alguna herramienta online de redimensionado de imágenes como por ejemplo Resize2Mail

Salu2! :)

Lili c dijo...

HOLA HICE TODO TAL CUAL PERO CUANDO lo publique y alguien intento enlazarme le pidio contraseña del blog y otros datos

es normal???? que hago???


gracias

Claw dijo...

Hola Lili c,

El problema podría deberse al servidor de imágenes donde alojaste la imagen. Si fue en Picasa (álbum de fotos de Google) debes poner la imagen como pública para que el resto de personas la pueda ver.

De todas formas, si tienes dudas pega aquí el código y vemos el por qué. Aloja la imagen en imageshack.us por ejemplo y prueba a ver.

Salu2! :)

L0RR4!NN3 dijo...

hola...me sirvio mucho tu blog...kedo bien el banner y todo..
al terminar todos los pasos lo enlace con mi propio blog...
y no lo enlaza directamente...me pide una contraseñe y usuario...
no se por ke
me podrias ayudar
mi blog
mechanicalorange.blogspot.com

gracias

Claw dijo...

Hola L0RR4!NN3,

¿Donde te pide exactamente el usuario y la contraseña? ¿A qué hosting de imágenes lo subiste? Te paso un enlace con un montón de sitios gratuitos para subir imágenes:

Servidores para subir imágenes

Salu2!

Mosh dijo...

me sirvio muxo este articulo, puse tu banner en mi blog, http://server4hc.blogspot.com Saludos :D

A Lady Blue dijo...

Hola!!

ps habia batallado para crear un banner, pero gracias a tu ayuda ps creé unos, solo q creo q hice algo mal, porque solo aparece el nombre del banner y no se ve la imagen, aunq si se ve el link, si me pudieras decir que hize mal lo agradecere...
ya te sigo...

SALUDOS!!!

yuriluna dijo...

hola muy buena tarde espero estes muy bien, me agrada k haya un blog donde puedan ayudarnos a los principiantes, bueno tengo un problema o un pequeño atasco e creado un baner para k me enlacen pero ahora no se como subirlo a mi blog espero me ayudes a resolver mi dilema gracias te lo agradesere mucho, un soñadora mas yuriluna....

Anónimo dijo...

hola! oye que excelente aporte que colocaste en tu blog brther, esta buenisimo! solo tengo un problema, la imagen no aparece en el sidebar widget HTLM/JAVAscript...el cuadro de referencia para elazar el blog si aparece, no asi la imagen, alguna sugerencia?
Gracias por tu tiempo...

XshilverX dijo...

Muchas gracias por el tutorial, me ha sido muy util, aunque como el link a LINKME ya no funciona he tenido que copiar el codigo manualmente de la imagen. Te he afiliado a mi blog porque me habeis salvado la vida , gracias!

Anónimo dijo...

Hi there,

I have a message for the webmaster/admin here at clawder.blogspot.com.

May I use some of the information from this blog post above if I provide a backlink back to your website?

Thanks,
Jules

Yoli Táboas dijo...

Hola!!
Tu blog es muy bueno y de mucha ayuda, lo agregaré pronto, jeje!!
tengo un problema para crear el link. me podrías enviar la direccion de la página web donde puedo ir para generar el código. es que cuando entro me envía a una página para buscar trabajos, no sé lo que hago mal.
si me pudieras echar una mano te lo agradecería!!
Gracias, saludos!