FROM CACHE - es_header
RESUELTAS

Ayuda para destacar ítem en menú superior

MDellafiori
Curioso(a)
6 0 0

Hola!

 

Mi tienda está en www.dogdynasty.cl y lo que quisiera hacer es destacar "Elige tu Regalo!" de color rojo en el menú superior.

 

Estoy usando el tema Supply de shopify, y he intentado agregar este código al final de Tienda Online>Editar código>recursos>theme.scss.liquid, pero no pasa nada 🤔

 

//For Desktop

#Details-HeaderMenu-2 >summary.list-menu__item{

color: #fff;

}

#Details-HeaderMenu-2> .header__menu-item .icon-caret{

color: #fff;

}

#Details-HeaderMenu-2{

background:red;

}

 

//For Mobile

#Details-menu-drawer-menu-item-2{

background: red;

}

Saqué ese código de otra respuesta en Shopify.

 

 

Algo así quisiera lograr:

 

Captura de pantalla 2023-06-06 200546.png

 

 

 

Agradezco de antemano su ayuda 🙂

 

2 SOLUCIONES ACEPTADAS

AlfredoMendoza
Shopify Partner
196 24 63

Éxito.

Hola @MDellafiori 

 

Para poder lograr eso haz lo siguiente:

 

  1. Borra el código que agregaste a tu archivo theme.scss.liquid
  2. Dentro del archivo theme.scss.liquid agrega el siguiente fragmento de código al final del archivo.

 

#navBar ul li:nth-child(2) {
  background-color: red;
  color: white;
}

 

 

Guarda los cambios y recarga tu página. Con el código anterior el estilo que quieres se vería igual tanto en vista móvil como en escritorio.

 

 

 

Saludos.

Espero mi respuesta haya sido de ayuda, si fue así por favor dale Me gusta para hacérmelo saber.



WhatsApp:+52 5646279452


Email: alfredomendozamg@gmail.com

Ver la solución en mensaje original publicado

AlfredoMendoza
Shopify Partner
196 24 63

Éxito.

Hola @MDellafiori 

 

Tienes razón, disculpa por el problema:

Reemplaza el código anterior por el siguiente:

#AccessibleNav, #MobileNav{
   > li:nth-child(2) {
       background-color: red; color: white;
     }
}

 

Eso debería solucionar el problema en el resto de listas.
Saludos.

Espero mi respuesta haya sido de ayuda, si fue así por favor dale Me gusta para hacérmelo saber.



WhatsApp:+52 5646279452


Email: alfredomendozamg@gmail.com

Ver la solución en mensaje original publicado

5 RESPUESTAS 5

AlfredoMendoza
Shopify Partner
196 24 63

Éxito.

Hola @MDellafiori 

 

Para poder lograr eso haz lo siguiente:

 

  1. Borra el código que agregaste a tu archivo theme.scss.liquid
  2. Dentro del archivo theme.scss.liquid agrega el siguiente fragmento de código al final del archivo.

 

#navBar ul li:nth-child(2) {
  background-color: red;
  color: white;
}

 

 

Guarda los cambios y recarga tu página. Con el código anterior el estilo que quieres se vería igual tanto en vista móvil como en escritorio.

 

 

 

Saludos.

Espero mi respuesta haya sido de ayuda, si fue así por favor dale Me gusta para hacérmelo saber.



WhatsApp:+52 5646279452


Email: alfredomendozamg@gmail.com

MDellafiori
Curioso(a)
6 0 0

Funcionó perfecto! Muchas gracias 😊

MDellafiori
Curioso(a)
6 0 0

Mentira jajaj... todos los segundos ítems de todos los menús ahora son rojos 😅

 

Captura de pantalla 2023-06-08 203015.png

AlfredoMendoza
Shopify Partner
196 24 63

Éxito.

Hola @MDellafiori 

 

Tienes razón, disculpa por el problema:

Reemplaza el código anterior por el siguiente:

#AccessibleNav, #MobileNav{
   > li:nth-child(2) {
       background-color: red; color: white;
     }
}

 

Eso debería solucionar el problema en el resto de listas.
Saludos.

Espero mi respuesta haya sido de ayuda, si fue así por favor dale Me gusta para hacérmelo saber.



WhatsApp:+52 5646279452


Email: alfredomendozamg@gmail.com

MDellafiori
Curioso(a)
6 0 0

Ahora si! Muchísimas gracias 😊