Cambiar fondo y rollover de items en menú WordPress

  • Autor Autor JamesPierre
  • Fecha de inicio Fecha de inicio
J

JamesPierre

Dseda
No recomendado
Verificado
Verificación en dos pasos activada
Buenas noches Betas

En vista que me he pasado googleando y al no encontrar respuesta de sam google
Queria consultarles y pedirles un apoyo.

Como puedo cambiar el color del fondo de cada item y cambiar el rollover, por ejemplo.

Item1 | Item2 | item3 | item4


HTML: 
<!-- end .header-row clearfix -->   

   <div id="main">
      <div class="main-navigation">
<div id="wizemenu" class="menu-top-menu-container"><ul id="menu-top-menu" class="menu"><li id="menu-item-744" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-420 current_page_item active"><a href="http://www.miweb.com/">Portada</a></li>
<li id="menu-item-748" class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Eventos</a></li>
<li id="menu-item-749" class="rock menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Zona Rock</a></li>
<li id="menu-item-750" class="discos menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Discotecas</a></li>
<li id="menu-item-751" class="bares menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Bares</a></li>
<li id="menu-item-752" class="contacto menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Contacto</a></li>
</ul></div>	

      </div><!-- end .main-navigation -->	

   </div><!-- end #main -->     
</div><!-- end #header -->

Que cada item tenga su color de fondo de texto.
Mi pregunta es la siguiente.
Ees posible realizar esta acción y si es así, como puedo hacerlo?
Una guia, un tutorial o alguna señal para hacer posible este dilema que se me ha presentado, le estaré muy agradecido por la ayuda...

Un abrazo y buen día.
 
Última edición:
En tu style.css inserta algo así:

HTML: 
li.menu-item-748 {
background: #el color que quieras;
}

y así por cada item.
 
Última edición:
En tu style.css

agrega esto:

Insertar CODE, HTML o PHP: 
#wizemenu  #menu-item-748 {
background-color: red;
}

#wizemenu  #menu-item-749 {
background-color: green;
}

#wizemenu  #menu-item-750 {
background-color: purple;
}

#wizemenu  #menu-item-751 {
background-color: blue;
}

#wizemenu  #menu-item-752 {
background-color: brown;
}

cambia los colores por los que quieras!! saludos
:encouragement:
 
Última edición:
krusty72 dijo:
En tu style.css inserta algo así:

HTML: 
li.menu-item-748 {
background: #el color que quieras;
}

y así por cada item.
Hacer clic para expandir...
Hola, muchas gracias por responder, probe y nada, no funciono 🙁 alguna idea?






jose roman 1316 dijo:
En tu style.css

agrega esto:

Insertar CODE, HTML o PHP: 
#wizemenu  #menu-item-748 {
background-color: red;
}

#wizemenu  #menu-item-749 {
background-color: green;
}

#wizemenu  #menu-item-750 {
background-color: purple;
}

#wizemenu  #menu-item-751 {
background-color: blue;
}

#wizemenu  #menu-item-752 {
background-color: brown;
}

cambia los colores por los que quieras!! saludos
:encouragement:
Hacer clic para expandir...

Hola amigo, gracias por tomarte la molesta en hacer ese codigo, me ilusione, probe y no funciono, puse tal cual, puedes ayudarme por inbox?
 
Pega el código que insertaste.
 
JamesPierre dijo:
Hola, muchas gracias por responder, probe y nada, no funciono 🙁 alguna idea?








Hola amigo, gracias por tomarte la molesta en hacer ese codigo, me ilusione, probe y no funciono, puse tal cual, puedes ayudarme por inbox?
Hacer clic para expandir...

solo saca #wizemenu del ejemplo que te dieron... ya que esta mal... para ser completo seria:
#wizemenu #menu-top-menu #menu-item-748 ... con sacar lo que te dije funciona...
Edit fiddle - JSFiddle

Otra cosa #menu-item-748, lo que esta en negrita es el ID del objeto del menu... si el menu es creado desde el codigo de WP, pues por cada objeto que le metas al menu tendras que colocarle su respectivo CSS
 
Última edición:
cicklow dijo:
solo saca #wizemenu del ejemplo que te dieron... ya que esta mal... para ser completo seria:
#wizemenu #menu-top-menu #menu-item-748 ... con sacar lo que te dije funciona...
Edit fiddle - JSFiddle

Otra cosa #menu-item-748, lo que esta en negrita es el ID del objeto del menu... si el menu es creado desde el codigo de WP, pues por cada objeto que le metas al menu tendras que colocarle su respectivo CSS
Hacer clic para expandir...

Pero que mie.... por eso amo este foro.... Ya salio como lo deseaba. Gracias [MENTION=9679]cicklow[/MENTION] por siempre apoyar a los que poco sabemos...
gracias también a krusty72 y jose roman 1316 por dedicarse un momento de su tiempo y ayudarme... un abrazo Dios los bendiga.

- - - Actualizado - - -

cicklow dijo:
solo saca #wizemenu del ejemplo que te dieron... ya que esta mal... para ser completo seria:
#wizemenu #menu-top-menu #menu-item-748 ... con sacar lo que te dije funciona...
Edit fiddle - JSFiddle

Otra cosa #menu-item-748, lo que esta en negrita es el ID del objeto del menu... si el menu es creado desde el codigo de WP, pues por cada objeto que le metas al menu tendras que colocarle su respectivo CSS
Hacer clic para expandir...

Si amigo, muy entendido. gracias nuevamente.
 
Hay que estar conectado o registrado para responder aquí.
Atrás
Arriba