Doble fondo para blog.

kahlo84 · #1 (**permalink**) 19/03/2012, 18:43

Hola, tengo este blog en WP: www.bdebelleza.es

Como veis en la página de inicio el fondo está bien, pero si accedeis a una entrada vereis que al tener bastantes comentarios, el blog se hace muy largo y el fondo se corta. Lo de repetir en mosaico no me vale, ya que por la parte de arriba el fondo es negro, y a mi me gustaría que el rosa siguiera hasta abajo sin cortes, así que supongo que necesito poner dos fodos, el de arriba y uno abajo que se vaya repitiendo, pero no sé como se podría hacer. Me podeis echar una mano?

Muchas gracias por vuestro tiempo.

Un saludo.

gebremswar · #2 (**permalink**) 30/03/2012, 17:19

Hola kahlo84, que tal.

Puedes seccionar horizontalmente la imagen de fondo en 3 piezas y repetir la central manteniendo los extremos: superior e inferior en sus respectivos lugares fijos.
Ejemplo:

Código CSS:

Ver originalbackground:url(../images/top.png) /* aquí la posición*/,
    url(../images/center.png)  /* aquí la posición y su repeat*/,
    url(../images/botom.png)  /* aquí la posición*/;
}

Saludos.

kseso? · #3 (**permalink**) 31/03/2012, 15:31

Dos opciones:
1ª: utilizar múltiples valores para background (css3) en el body: top, center y bottom.
2ª: utilizar 3 imágenes en tres elementos: Un elemento superior con el negro y transición a rosa. Uno central para repetir rosa en toda la vertical y la tercera para el pie de página que tendría la transición rosa/negro.

Amplio a la tercera:
3ª: gradientes de css

kahlo84 · #4 (**permalink**) 01/04/2012, 11:09

Muchas gracias a ambos por las respuestas, pero no sé donde insertar ese código porque no veo en el archivo css el fondo actual :S

gebremswar · #5 (**permalink**) 01/04/2012, 12:04

Cita:

Iniciado por kahlo84

Muchas gracias a ambos por las respuestas, pero no sé donde insertar ese código porque no veo en el archivo css el fondo actual :S

Haz uso del firebug o la herramienta para desarrolladores de Chrome.

actualmente el fondo de ese blog esta en esta clase css:

Código CSS:

Ver originalbody.custom-background {
background-color: black;
background-image: url('http://bdebelleza.es/wp-content/uploads/2012/03/fondo-bdebelleza.jpg');
background-repeat: no-repeat;
background-position: top center;
background-attachment: scroll;
}

En donde deberia trabajar asi:

Código CSS:

Ver originalbody.custom-background {
    background: url(../images/top.png) /* aquí la posición*/,
                url(../images/center.png)  /* aquí la posición y su repeat*/,
                url(../images/botom.png)  /* aquí la posición*/;
}

kahlo84 · #6 (**permalink**) 16/07/2012, 18:00

Hola, siento reactivar este viejo tema pero ahora con las vacaciones quería arreglar algunas cosas que tenía pendientes, entre ellas esta.

He vuelto a mirar el css del blog y no encuentro ese código que me comentas, así que no tengo ni idea de dónde insertar el nuevo.

Os iba a pegar aquí el código css pero es demasiado largo, así que a ver como lo podemos hacer.

Un saludo.

gebremswar · #7 (**permalink**) 16/07/2012, 20:54

Te hecho una mano y comparto una captura de lo que me muestra la herramienta para desarrolladores de Google Chrome.

Captura

Cabe aclarar que hay mucho código dentro del body que deberia estar dentro de las etiquetas <head></head>.

kahlo84 · #8 (**permalink**) 17/07/2012, 04:51

Hola muchas gracias por responder. Yo esa línea de código también la veo con el Chrome, pero cuando entro en el editor de WP y el archivo css pues no la veo...

Y eso del body y el head es grave? La verdad es que no tenía ni idea, no entiendo mucho de estas cosas.

Un saludo!

gebremswar · #9 (**permalink**) 17/07/2012, 12:32

Cita:

Iniciado por kahlo84

... pero cuando entro en el editor de WP y el archivo css pues no la veo...

Si te fijas bien, en la imagen y en tu propio navegador, esa hoja de estilos no esta en un fichero .css independiente. Está solamnete entre etiquetas <style></style>; por lo que te recomiendo que verifiques como se esta generando esos estilos ya que es probable que que se genere desde php.

Cita:

Iniciado por kahlo84

Y eso del body y el head es grave?!

Pues las etiquetas meta solo deberían ir entre las etiquetas <head></head> y no en body.

kahlo84 · #10 (**permalink**) 17/07/2012, 13:59

Pues he mirado todos los archivos, el index.php, header, footer, archive, page... vamos todos, y lo más parecido a background que he encontrado ha sido esto en el archivo functions.php:

// Add support for custom backgrounds
add_custom_background();