Skip to main content
⚠️ Aviso importante Esta personalización solo funciona con la Versión 1 de los módulos de carrito de Upcart. Si actualizaste recientemente tu carrito a la Versión 2, es posible que estas personalizaciones no funcionen. Tendrás que usar los nuevos selectores proporcionados para la Versión 2 en la guía de migración. Si tus personalizaciones no funcionan como esperas, también puedes revertir tu carrito a la Versión 1 en lugar de usar la Versión 2. Actualmente estamos trabajando en nuevas plantillas de personalización para la Versión 2 de los módulos, y estarán disponibles pronto.

Descripción general

Si tus imágenes de producto se ven estiradas, aplastadas o recortadas en Upcart, esto generalmente se debe a un conflicto de estilos del tema. Algunos temas de Shopify aplican estilos globales de imagen que afectan cómo se muestran las imágenes de producto dentro de Upcart. Puedes arreglar este problema agregando una breve personalización de CSS directamente en los ajustes del editor de Upcart.

Cómo arreglarlo

Sigue estos pasos para aplicar una personalización de CSS que preserve las proporciones de tus imágenes de producto.

Acceder a los ajustes de Custom CSS

  1. Abre la app de Upcart desde tu panel de Shopify.
  2. Navega al editor de carrito.
  3. Abre Settings y selecciona la pestaña Custom CSS. Settings es una fila de pestañas — si no ves Custom CSS, está detrás de More settings.

Agregar el CSS

  1. Copia y pega el siguiente fragmento de CSS en el campo Custom CSS:
  1. Guarda tus cambios.
  2. Refresca tu tienda y abre Upcart para confirmar que las imágenes ahora se muestran correctamente.

Por qué sucede esto

Algunos temas de Shopify aplican reglas de CSS globales que redimensionan o recortan las imágenes de maneras que afectan cómo aparecen en apps de terceros como Upcart. Estas reglas pueden anular los estilos predeterminados de Upcart y distorsionar las proporciones de las imágenes. El fragmento de CSS de arriba asegura que las imágenes de producto mantengan su relación de aspecto original y se muestren correctamente tanto en dispositivos de escritorio como móviles.