FROM CACHE - es_header
Esta comunidad ahora recibe asistencia de una red de pares. El equipo de atención al cliente de Shopify ya no ofrece servicio a esta comunidad. Te animamos a conectar con otros emprendedores y partners para pedir ayuda y compartir tus experiencias. Sigue avisando de asuntos que incumplan nuestro Código de Conducta o contenidos que se deberían eliminar.

Re: Ayuda para destacar ítem en menú superior

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
215 27 64

É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 5659308712


Email: alfredomendozamg@gmail.com

Ver la solución en mensaje original publicado

AlfredoMendoza
Shopify Partner
215 27 64

É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 5659308712


Email: alfredomendozamg@gmail.com

Ver la solución en mensaje original publicado

5 RESPUESTAS 5

AlfredoMendoza
Shopify Partner
215 27 64

É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 5659308712


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
215 27 64

É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 5659308712


Email: alfredomendozamg@gmail.com

MDellafiori
Curioso(a)
6 0 0

Ahora si! Muchísimas gracias 😊