Agregar banner en background lateral para WordPress

benny · 8 Jul 2014

buenas gente, estoy necesitando agregar un banner en el background en los laterales para un wordpress, la idea es que ocupe los espacios en blanco del sitio y que a medida que hacemos scroll la imagen con el link siga ahi...

lo que yo tengo es una imagen del ancho de toda la pagina donde lo que se muestra son los dos laterales....

no puedo dar con algún código que me funcione... alguna sugerencia?, codigo, script, plugin?...

les dejo una imagen para de muestra...

HostingFront · 8 Jul 2014

Hola Benny,

La imagen adjuntada da un error.

Saludos :victory:

benny · 8 Jul 2014

ahi la subi de nuevo...

de paso actualizo, di con el codigo para que se muestre la imagen de esa manera, el codigo es este:

<div class="back-central" style="background: url('URL DE LA IMAGEN DE FONDO AMARILLA') no-repeat fixed center top transparent;"></div>

con este codigo puedo hacer que la imagen de fondo se quede quieta pero no logro hacer que tenga un link....

alguna idea?

Emanuel Andrei · 8 Jul 2014

Lo mejor es hacer la imagen de fondo en el .css de tu template y despues poner el codigo para que cuando se hace click, te lleve a un enlace en concreto.

Codigo .css con background fijo y imagen responsive (colocalo en el .body):

Insertar CODE, HTML o PHP:

background-image: url(RUTA DE LA IMAGEN EN TU HOST (p.e: "../images/sexy-background.jpg" o ruta completa del enlace de la imagen); 
        background-repeat: no-repeat;
        background-position: center center;
        background-attachment: fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;

Codigo del index a agregar despues del <body>:

Insertar CODE, HTML o PHP:

<a class="NOMBRE DE LA FUNCION EN DONDE ESTA EL CODIGO DEL .CSS (p.e: body)" href="URL DE LA WEB A LA QUE REDIRIGE" target="_blank">Este texto del vinculo no se va a ver...</a>

Pruebalo y cuenta-nos que tal :encouragement:

P.D: Si quieres que los dos banners sea diferentes en los dos lados, simplemente colocas el codigo mismo que te di de la imagen haciendo dos clases en el .css con las dimensiones que quieres que tengan los baners y en el .html llamas 2 veces a la misma funcion con class="nombre de la funcion en el .css". Lo unico que lo tendras mas "dificil" sera probar para que te quede bien en pagina, pero nada mas.

benny dijo:
ahi la subi de nuevo...

de paso actualizo, di con el codigo para que se muestre la imagen de esa manera, el codigo es este:

con este codigo puedo hacer que la imagen de fondo se quede quieta pero no logro hacer que tenga un link....

alguna idea?

jcarlos · 8 Jul 2014

Gracias por el Porte, pero una pregunta donde colocamos el codigo, header, footer, index, function ?

benny dijo:
ahi la subi de nuevo...

de paso actualizo, di con el codigo para que se muestre la imagen de esa manera, el codigo es este:

con este codigo puedo hacer que la imagen de fondo se quede quieta pero no logro hacer que tenga un link....

alguna idea?

Emanuel Andrei · 8 Jul 2014

jcarlos dijo:
Gracias por el Porte, pero una pregunta donde colocamos el codigo, header, footer, index, function ?

En el wordpress el codigo de la plantilla siempre va en el header.

shevchencko dijo:
estimados:
tengo la siguiente duda. estoy haciendo un sitio web y necesito lo siguiente.

les pondre esta web de ejemplo es de chicas scort escortvipsantiago.cl - Acompañantes y Escorts en Chile | Escorts (call girls) in Santiago, Chile
necesito eso mismo... que al apretar una foto de una de las chicas se abre unaventana con las fotos de la chica..

alguien me podria decir como se hace eso.. porfavor seria de gran ayuda.
saludos
y gracias desde ya
bye

Abre un post aparte con tu duda :encouragement:

benny · 8 Jul 2014

gracias.. pero no logro que camine...
me olvide de mencionar que la imagen, si bien muestra los dos lados amarillos como el primer post, en realidad es una imagen con los lateras...
te puedo pasar el css que estoy usando yo a ver si me lo podés ubicar??
gracias de ante mano.

EmiLL dijo:
Lo mejor es hacer la imagen de fondo en el .css de tu template y despues poner el codigo para que cuando se hace click, te lleve a un enlace en concreto.

Codigo .css con background fijo y imagen responsive (colocalo en el .body):

Insertar CODE, HTML o PHP:

background-image: url(RUTA DE LA IMAGEN EN TU HOST (p.e: "../images/sexy-background.jpg" o ruta completa del enlace de la imagen); background-repeat: no-repeat; background-position: center center; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;

Codigo del index a agregar despues del <body>:

Insertar CODE, HTML o PHP:

<a class="NOMBRE DE LA FUNCION EN DONDE ESTA EL CODIGO DEL .CSS (p.e: body)" href="URL DE LA WEB A LA QUE REDIRIGE" target="_blank">Este texto del vinculo no se va a ver...</a>

Pruebalo y cuenta-nos que tal :encouragement:

P.D: Si quieres que los dos banners sea diferentes en los dos lados, simplemente colocas el codigo mismo que te di de la imagen haciendo dos clases en el .css con las dimensiones que quieres que tengan los baners y en el .html llamas 2 veces a la misma funcion con class="nombre de la funcion en el .css". Lo unico que lo tendras mas "dificil" sera probar para que te quede bien en pagina, pero nada mas.

Emanuel Andrei · 8 Jul 2014

benny dijo:
gracias.. pero no logro que camine...
me olvide de mencionar que la imagen, si bien muestra los dos lados amarillos como el primer post, en realidad es una imagen con los lateras...
te puedo pasar el css que estoy usando yo a ver si me lo podés ubicar??
gracias de ante mano.

No es necesario. Con poner el enlace de la web, tengo mas que suficiente.

benny · 8 Jul 2014

dale, te mando pm porque no me dejan pasar la demo..

- - - Actualizado - - -

bueno actualizo, gracias a algunos datos que me paso [MENTION=49777]EmiLL[/MENTION] di con un plug que parece que funciona muy bien con esto, http://wordpress.org/plugins/background-manager/
saludos