[Solucionado] Cambiar el color del menú horizontal

[TonyG]

Lo tengo "casi"

He modificado las imágenes de "\modules\blocktopmenu\img" (después de buscarlas como loco por toda la carpeta del tema) dándoles un tono verdoso. pues bien, como podéis ver la barra del menú si sale verde pero al pasar el ratón los botones de las categorías (que se despliegan hacia abajo) siguen estando grises.

No encuentro las imágenes que corresponden a estos

 

Versión de PrestaShop: 1.5.0.17

URL de su tienda: http://www.centrodigital.com.es/TTQ/

Nombre del tema utilizado: default

 

 

Saludos desde la Orilla del Guadiana

Edited October 19, 2012 by TonyG (see edit history)

[TonyG]

¡Ja! Es que los que bajan no están hechos con imágenes de fondo.

Hay que cambiar el color de fondo de

.sf-menu li li

y

.sf-menu ul li:hover, .sf-menu ul li.sfHover,

.sf-menu ul li a:focus, .sf-menu ul li a:hover, .sf-menu ul li a:active

y, no se, puede que alguno mas.

[juandelarce]

Tony, soy nuevo en el foro, y me gustaría que me indicaras como has cambiado esos colores y los desplegables, porque me ha encantado como te ha quedado la página. y necesito hacer algo parecido con colores cremas.

 

Te agradecería mucho esa información.

 

Saludos

 

Juan de Arce.

[TonyG]

Hola juandelarce

 

Lo primero es no buscar el menú dentro del tema porque no está ahí.

Está en "modules/blocktopmenu".

 

Aquí hay que cambiar dos cosas.

 

La primera son las imágenes de fondo que se utilizan para las opciones principales del menú (las que se ven al principio)

Dentro de la carpeta "img" tienes esos archivos "bg_blocktopmenu.png", "bg_blocktopmenu_li_hover.png", etc.

Todos son de color mas o menos gris con un pequeño degradado.

Pues bien, los abres con tu editor de imágenes y los cambias al tono crema que te guste.

Para no liarla es importante que no cambies los nombres y los tamaños de las imágenes.

Una vez cambiadas todas (el "arrows-ffffff" y el "shadow", en principio, no hace falta cambiarlas) las subes a la carpeta correspondiente del servidor (haz copia de los originales, por si acaso)

Con esto tienes cambiada la primera parte del menú. Como verás cuando seleccionas una opción y se despliega la lista hacia abajo con las opciones sigue siendo gris, así que vamos con la

 

Segunda cosa a hacer.

Dentro de la carpeta "css" hay un fichero que se llama "superfish-modified.css"

Lo abres y buscas

 

.sf-menu li li {
background: rgba(113, 113, 113, 0.9);
}

y lo cambias a

 

.sf-menu li li {
background: #004500;
}

 

Luego buscas

 

.sf-menu ul li:hover, .sf-menu ul li.sfHover,
.sf
-menu ul li a:focus, .sf-menu ul li a:hover, .sf-menu ul li a:active {
background: #4e4e4e;
outline: 0;
}

 

y lo cambias a

 

.sf-menu ul li:hover, .sf-menu ul li.sfHover,
.sf-menu ul li a:focus, .sf-menu ul li a:hover, .sf-menu ul li a:active {
background:   #030;
outline: 0;
}

 

Subes el fichero y listo

Los códigos de color que te he puesto son lo que he usado yo (los verdes) y les he quitado la transparencia. Tu tendrás que usar los que vayan "a juego" con el color que le hayas dado a la barra.

 

Espero que estas indicaciones te sirvan

 

Saludos desde la orilla del Guadiana

[yeyujja]

Está genial TonyG, justo lo que quería!! Muchas gracias!

 

Pero a ver si tu sabes como hacer otra cosa porque no doy con ello... Me gustaría que cuando se pinche en uno de los enlaces de ese menú horizontal se quede marcado con otro color, para que el usuario sepa que está navegando en esa categoría, tu sabes cómo podría hacerlo??

 

Saludos,

[TonyG]

Me alegro yeyujja de que te haya servido

 

Lamentablemente esto otro supera mis capacidades

He probado

 

.sf-menu a:active {
 background: transparent url(../img/bg_blocktopmenu_li_active.png) repeat-x 0 0;
}

pero sólo funciona mientras tienes pulsado el botón.

Si te vale de algo.

 

A ver si aparece alguien que realmente sepa y te echa una mano

 

Saludos desde la orilla del Guadiana

[jollos]

Hola, estoy intentando cambiar el color, y no hay manera, me explico

de momento lo tengo en local, supongo que eberia funcionar igual.

He modificado los dos arhivos, pero aumenta mucho el tamaño en disco, no se si puede influir.

Tambien he modificado los archivos tal y como dices pero no veo diferencia.

puede ser debido a la version, tengo la 1.5.2?

Gracias

[amapita]

Buenas a todos! Felicitaros por el trabajo que hacéis, a TonyG le ha quedado muy bonita la tienda que quesos ¡Vaya pinta tienen!.

Soy muy novata en esto y también me gustaría cambiar el color del menú, he seguido vuestros pasos pero cuando abro los archivos de imagen con photoshop no me deja hacer nada y no sé como modificar su color. Lo demás lo habéis explicado muy bien y creo que sabré hacerlo...

Gracias.

Edited November 15, 2012 by amapita (see edit history)

[jollos]

Prueba con el Fyreworks, esta en el paquete del photoshop, alli selecionas el color, coges el bote de pintura y pulsas en la imagen a retocar.

Yo lo he intentado y no he logrado cambiar el color, aunque no se si es valido para el 1.5.2 no sirve.

 

Un saludo

[amapita]

voy a probar, muchas gracias.

[josu]

amapita y jollos, en photoshop teneis que cambiar en >imagen>modo a RGB para poder cambiar el color y luego guardarlo para web. Los GIF y PNG suelen estar en modo Color Indexado y no se puede cambiar el color.

Un saludo

[Ricardo Pi]

Ostras, lo conseguí... ya me estaba volviendo loco porque no me cambiaba el color de la barra.

He tenido que cambiar también el color a la imagen " arrows-ffffff "

Gracias a todos

[Kami Solutions]

Pues yo he modificado los archivos bg_blocktopmenu_li_seleted.png, blocktopmenu_hover.gif y etc

 

Y me sigue saliendo en gris, no lo entiendo...quizás en la versión de prestashop 1.5.3.1 lo han cambiado.

 

He borrado la caché, forzado la compilación, borrado cookies y de todo, pero no me sale...estoy empezando a desesperar