2 formas de poner un Banner en tu Blog de WordPress.com


Curso Web 20 bannerComo el banner de la imagen, podemos insertar banners en nuestras páginas de WordPress.com y con los widgets de texto e imagen podemos insertar un banner en las barras laterales y pié de página (footer) de nuestro sitio web. En este artículo aprenderás a crear un banner y colocarlo en tu sitio web para dirigir a tus usuarios a otras páginas internas o externas de tu sitio web.

Tamaños más usados y recomendados para hacer un Banner:

Aunque lo ideal es crear un banner a medida, a continuación tienes los tamaños más usados y en pixels. También es recomendable guardar los archivos en formato .png. Si quieres hacerlos medida, entra en la página de las características de la plantilla WordPress que estés usando y que encontrarás clicando en el enlace que hay al pié de página de tu sitio web.

Horizontales:

  • 728 px de ancho por 90 px de alto (ideal para cabeceras)
  • 728 px de ancho por 360 px de alto (tamaño grande cabeceras)
  • 851 px de ancho por 315 px de alto (tamaño portada de Página de Facebook)
  • 461 px de ancho por 60 px de alto (páginas y artículos)
  • 435 px de ancho por 150 px de alto (páginas y artículos)
  • 435 px de ancho por 75 px de alto (páginas y artículos)
  • 550 px de ancho por 400 px de alto (páginas y artículos)

Verticales:

  • 120 px de ancho por 600 px de alto (ideal barras laterales de un ancho pequeño)
  • 160 px de ancho por 600 px de alto (ideal barras laterales de un ancho mediano)
  • 300 px de ancho por 600 px de alto (ideal barras laterales de un ancho grande)
  • 120 px de ancho por 240 px de alto (ideal barras laterales de un ancho pequeño)

Cuadrados y Rectangulares:

  • 125 px de ancho por 125 px de alto (cuadrado ideal barras laterales y footers pequeñas)
  • 180 px de ancho por 150 px de alto (rectángulo ideal barras laterales y footers pequeñas)
  • 250 px de ancho por 250 px de alto (cuadrado ideal barras laterales y footers medianas)
  • 200 px de ancho por 200 px de alto (cuadrado ideal barras laterales footers medianas)
  • 300 px de ancho por 250 px de alto (rectángulo ideal barras laterales y footers grandes)
  • 100 px de ancho por 72 px de alto (rectángulo tamaño facebook ads)

¿Dónde y cómo hacer un Banner?

Para hacer un banner puedes usar plantillas gratis o si tienes conocimientos de edición de imágenes, puedes hacer el tuyo personalizado y al tamaño que creas conveniente.

¿No tienes editor de imágenes para hacer tu banner a medida? Prueba ipiccy.com, es online, sin registro, es fácil de usar y es gratis!

Plantillas Banners Gratis:

  • Template box→ (secillos banners para descarga)
  • Designshock→ (20 increíbles plantillas en psd (Photoshop), la descarga es gratis a cambio de un email, te llegará un email con el enlace de descarga)
  • Naldzgraphics.net→ (22 increíbles plantillas banners en psd)

Editores de Banners Online:

Cómo usar los widgets de imagen y texto para insertar un banner en la barra lateral o footer

Widget de Texto: colocar banner en 3 pasos.

  1. Crea un borrador de página o articulo, la intención no es publicar nada, es solo para usar el editor de páginas. Subimos el banner a través de la opción “añadir objeto”, e  insertamos la imagen y el enlace del banner.
  2. Copiamos el código en HTML, que encontraremos en la pestaña “Texto” del editor.
  3. Vamos a Apariencia/Widget y seleccionamos el Widget de Texto y lo arrastramos a una barra lateral o footer, finalmente pegamos el código HTML y guardamos.Widget de Texto WordPress.com Insertar Banner

Widget de Imagen: colocar banner en 3 pasos

  1. Subimos la imagen del banner en Medios/Añadir Nuevo. Editamos la imagen y copiamos el enlace de origen que encontraremos en la esquina superior derecha.
  2. Entramos en Apariencia/Widgets, seleccionamos en widget de imagen y lo arrastramos a la barra lateral o footer
  3. Pegamos en enlace anterior de la imagen y añadimos el enlace de destino, y guardamos.Widget Imagen WordPress.com Insertar Banner

27 thoughts on “2 formas de poner un Banner en tu Blog de WordPress.com

  1. Excelente!! muchas gracias… de casualidad sabes como poner un banner que ocupe una parte de la pantalla y lo de atrás este de negro? que se pueda cerrar? no se si me explico 😀

    Gracias!!

  2. Muchas gracias Mario, ha sido muy útil!! lo único que no logro ver es dónde tengo que indicar el link de la web para que me lleve al pinchar en la foto?, porque lo único que no veo en las pantallas que me salen a mí es el URL de enlace cuando se hace click sobre la imagen que te aparece a tí.

    Muchas gracias por todo!

  3. Hola Mario, una pregunta. Qué widget utilizas para la imagen? Acabo de bajar Image widget pero no me da la posibilidad de agregar la URL de enlace cuando se hace click sobre la imagen. Me podrías decir cual usas? Muchas gracias. Carina

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