Fondos en CMS o microsites internos

Guillem2

Nuevo usuario
Buenas a tod@s,

Alguien sabe cómo incluir un blackground en una CMS concreta? o si por el contraro es mejor crear alguna variante de Microsite:S.

La idea es que necesito crear un espacio nuevo para una campaña concreta de venta, diferenciar el estilo de la home con el de la campaña concreta. En ese apartado obviamente necesito incorporar un bloque donde se cargan los productos de tal evento.

Saludos y muchas gracias
 

ptazta

Miembro
Si, bueno, si creas un div y le pones background-color, te añade el div con el color de fondo, pero según sea tu plantilla aparecerá de una manera u otra.
Has probado a crear una pagina .phtml con sus propios estilos e importarla a un bloque estatico???
 
Upvote 0

Larry

Miembro
Puedes crearte una Pagina nueva desde CMS y en ella le puedes definir un diseño personalizado, es decir, te creas dentro de skin/frontend/default/tu_tema_personalizado/styles.css y en esa hoja de estilos la diseñas. Despues solo te queda modificar en el Pagina que has creado, en el apartado de Diseño. Te deja incluso añadir las fechas en las cuales el diseño estara activo.

Saludos.
 
Upvote 0

Guillem2

Nuevo usuario
Buenas de nuevo,

Cómo procedo a identificar la CSS X en el style? Dado que el nombres que genera es CMS-timberland (q es el name que le di). Entiendo que luedo dentro de css puedo añadir atributos a la pagina, el problema es como la identifico para que la llame.

Saludos i gracias
 
Upvote 0

Guillem2

Nuevo usuario
Buenas Larry,

No se como identificar la pagina cms que quiero modificar. En mi caso es una cms que se llama timberland. Como la identifico o llamo para aplicar los CSS?

Gracias
 
Upvote 0

Larry

Miembro
Pero has creado un bloque estatico o una pagina CMS? porque si es una Pagina CMS hay una opcion que es Diseño Personalizado, donde puedes asignarle el tema que tu quieras.

Saludos.
 
Upvote 0

Guillem2

Nuevo usuario
A ver, corrigeme larry.

He puesto div referencias cogidas de una pagina web (ver mas abajo), en contenido no en diseño. Como se hace en diseño por si quiero programarlo?


Fuente: URL

Estilo background-color

background-color nos ayuda a determinar el color de fondo de un determinado estilo. Por ejemplo, en el siguiente código podrás comprobar como le hemos puesto al fondo del estilo un color rojo.

<div style="background-color:#FF0000;">Este texto irá sobre fondo rojo</div>
Y el resultado lo podemos ver visualmente a continuación:

Este texto irá sobre fondo rojo

Estilo background-image

Gracias a este estilo, en lugar de un color de fondo como hacíamos anteriormente, podemos aplicar una imagen de fondo. El código se escribe de la siguiente manera:

<div style="background-image:url(fondo.jpg)">Este texto irá sobre una imagen de fondo</div>
La url será el nombre de la imagen con su camino relativo o absoluto.

Estilo background-repeat

Este atributo se usa para especificarle a la imagen que hemos usado de fondo si queremos o no que se repita y, en caso afirmativo, indicarle de qué modo queremos que se repita.

Si queremos que la imagen se repita en vertical y horizontal utilizaremos el atributo “repeat”, si queremos que la imagen se repita sólo en horizontal usaremos “repeat-x”.Y usaremos “repeat-y” para que se repita la imagen sólo en vertical. Si queremos que no se repita se lo indicaremos con “no-repeat”.

En el código siguiente veremos como a la imagen que hemos puesto de fondo en el estilo anterior, le hemos indicado que no se repita.

<div style="background-image:url(fondo.jpg); background-repeat: no-repeat;"> Este texto va sobre una imagen de fondo, no se repite.</div>
Estilo background-position

Gracias a este estilo de background podemos fijar el punto de inicio para la imagen de fondo. Mediante este atributo podemos fijar el punto de inicio verticalmente (top, center y bottom) y horizontalmente (left, center y right). Si expresamos dos coordenadas, la primera será la horizontal y la segunda la vertical.

En el siguiente código verás cómo hemos seguido con el ejemplo anterior, pero esta vez fijando también el punto: a la izquierda y arriba.

<div style="background-image:url(fondo.jpg); background-repeat: no-repeat; background-position:left top;"> Este texto va sobre una imagen de fondo, no se repite y está fijado.</div>
Si pinchas en el enlace siguiente, podrás ver el ejemplo completo: Ejemplo de estilo de fondos
 
Última edición:
Upvote 0
Arriba