Hola,
Deseo cambiar el color del texto del precio antes y después de un producto (que el precio antes sea rojo) . Gracias
Topic summary
Un usuario solicita cambiar el color del precio de comparación (precio antes del descuento) a rojo en su tienda Shopify.
Solución proporcionada:
- Los temas de Shopify no tienen función nativa para personalizar el color del precio de comparación de forma independiente
- Se puede lograr mediante CSS personalizado en Tienda online > Temas > Personalizar > Configuración del tema > CSS personalizado
- Código sugerido:
.price-item--regular { color: red !important; }
Resultado:
- El código funcionó correctamente para el usuario original
Problema adicional identificado:
- Otro usuario reporta que el código también cambia el color de los precios regulares (productos sin comparación)
- Queda pendiente una solución para aplicar el color rojo únicamente al precio de comparación sin afectar precios regulares
Hola, @Bionnabishealth :
Gracias por escribirnos. Entiendo que deseas configurar un color diferente para el precio de comparación en tus productos, ¿cierto? Será un placer poder ayudar y arrojar luz sobre esta cuestión.
A modo de contexto, la opción de personalizar el diseño y color de la sección del precio de comparación depende del tema que estás usando en tu tienda. Para los temas de Shopify, no existe una función nativa que permita configurar el color del precio de comparación de manera independiente. Solo es posible personalizar el color de todo el texto de la página de manera general a través del editor de temas. Para ello, puedes dirigirte a la sección Tienda online > Temas > Personalizar > Configuración del tema > Colores.
Dicho esto, una de las principales ventajas de Shopify es que puedes editar el código de tu tienda para implementar diseños personalizados a las diferentes secciones/elementos de tu página. En este caso, es posible ajustar el color del precio de comparación con una simple edición de código CSS mediante la herramienta de CSS personalizado. Te dejo el extracto de código que debes añadir y cómo implementarlo:
.price-item–regular {> color: red !important;> }
- Dirígete a la sección Tienda online > Temas.
- Haz clic en Personalizar.
- En los iconos de la izquierda, selecciona Configuración del tema.
- Localiza la sección CSS personalizado.
- Pega el código que te comparto.
- Guarda la configuración.
Hecho esto, el precio de comparación de tu tienda se debería mostrar en color rojo. En caso de que este extracto de código no funcione, ¿podrías confirmarme el tema que estás usando en tu tienda? Puedes revisar esta cuestión a través de Tienda online > Temas > Personalizar, haciendo clic en los Tres puntos en la esquina superior izquierda. Aparte, sería de ayuda si pudieras también compartir la URL de tu tienda.
Mientras revisas esto, me pregunto cómo está siendo tu experiencia con Shopify hasta el momento. Dime, ¿cómo va el resto de cuestiones con la configuración de tu negocio y tu tienda online?
Teo muchas gracias!!! Funciono a la perfección
1 Like
Funciona, pero también se cambian los otros precios que no tienen comparación. Hay alguna manera de cambiar solo el precio de comparación y que no se modifique los regulares?