Ir al contenido principal

Cómo usar un icono diferente al de corazón en mi sitio web

¿Quieres usar un ícono diferente al corazón estándar? ¡Así se hace!

Colin Connor avatar
Escrito por Colin Connor
Actualizado hoy

Esta función está disponible en todos los planes de Goodshuffle Pro.

A veces, el ícono de corazón predeterminado no es el que mejor representa tu marca. Ya sea que prefieras usar una estrella, un carrito de compras u otra imagen personalizada, puedes cambiar fácilmente el corazón de la lista de deseos por algo que vaya más con tu estilo. En este artículo te mostramos cómo hacerlo usando un sencillo fragmento de código CSS si quieres tener control total sobre tu ícono.


Tutorial en video paso a paso

Mira esta demostración rápida para ver cómo se hace:

Cómo personalizar el ícono de la lista de deseos con CSS

Si tienes experiencia editando código básico, usa este fragmento de CSS.
Asegúrate de reemplazar "your-url-here" y "your-other-url-goes-here" con las URLs de tus íconos personalizados.

gspro-item-card gspro-icon {
background-image: url("your-url-here");
background-size: cover;
background-repeat: no-repeat;
}

gspro-item-card gspro-icon svg {
display: none;
}

gspro-wishlist .gspro-c-wishlist__trigger gspro-icon {
background-image: url("your-other-url-goes-here");
background-size: cover;
background-repeat: no-repeat;
}

gspro-wishlist .gspro-c-wishlist__trigger gspro-icon svg {
display: none;
}


¿Necesitas ayuda adicional?

Haz clic en la burbuja de chat azul en la esquina inferior de tu pantalla para enviar un mensaje a nuestro equipo de soporte. ¡Estamos para ayudarte!

Aviso: Este artículo fue traducido usando IA. Si tienes preguntas o necesitas aclaraciones, contáctanos usando la burbuja de chat en la esquina inferior de tu pantalla.

¿Ha quedado contestada tu pregunta?