Skip to main content
⚠️ Belangrijke mededeling Deze aanpassing werkt alleen met Versie 1 van de Upcart-cartmodules. Als je je winkelwagen onlangs hebt geüpgraded naar Versie 2, werken deze aanpassingen mogelijk niet. Je moet dan de nieuwe selectors voor Versie 2 gebruiken uit de migratiegids. Als je aanpassingen niet werken zoals verwacht, kun je je winkelwagen ook terugzetten naar Versie 1 in plaats van Versie 2 te gebruiken. We werken momenteel aan nieuwe aanpassingstemplates voor Versie 2 van de modules; deze zijn binnenkort beschikbaar.

Overzicht

Als je productafbeeldingen er uitgerekt, samengedrukt of afgesneden uitzien in Upcart, wordt dit meestal veroorzaakt door een stylingconflict met het thema. Sommige Shopify-thema’s passen globale afbeeldingsstyling toe die invloed heeft op hoe productafbeeldingen in Upcart worden weergegeven. Je kunt dit probleem oplossen door een korte CSS-aanpassing rechtstreeks toe te voegen in de editorinstellingen van Upcart.

Zo los je het op

Volg deze stappen om een CSS-aanpassing toe te passen die de verhoudingen van je productafbeeldingen behoudt.

Toegang tot de Custom CSS-instellingen

  1. Open de Upcart-app vanuit je Shopify-dashboard.
  2. Ga naar de Cart Editor.
  3. Open Settings en selecteer het tabblad Custom CSS. Settings is een rij tabbladen — als je Custom CSS niet ziet, staat deze achter More settings.

De CSS toevoegen

  1. Kopieer en plak het volgende CSS-fragment in het veld Custom CSS:
  1. Sla je wijzigingen op.
  2. Vernieuw je storefront en open Upcart om te bevestigen dat de afbeeldingen nu correct worden weergegeven.

Waarom dit gebeurt

Sommige Shopify-thema’s passen globale CSS-regels toe die afbeeldingen op een manier verkleinen of bijsnijden die invloed heeft op hoe ze verschijnen in apps van derden zoals Upcart. Deze regels kunnen de standaardstyling van Upcart overschrijven en de verhoudingen van afbeeldingen vervormen. Het bovenstaande CSS-fragment zorgt ervoor dat productafbeeldingen hun oorspronkelijke beeldverhouding behouden en correct worden weergegeven op zowel desktop- als mobiele apparaten.