Skip to main content

​
Overzicht

Als ongeldige of kapotte HTML wordt toegevoegd aan het Custom HTML-veld van de Cart Editor, kan dit de lay-out breken en de editorinterface onbruikbaar maken. Deze gids laat zien hoe je de lay-out tijdelijk herstelt, zodat je de kapotte code veilig kunt verwijderen en de volledige functionaliteit kunt terugzetten.

​
Wat het probleem veroorzaakt

Dit probleem treedt meestal op wanneer een merchant:
  • <style>- of <script>-tags invoegt zonder de juiste structuur
  • HTML-tags niet sluit of verkeerd combineert
  • Content toevoegt aan het Custom HTML-veld die de lay-out breekt
Als gevolg hiervan wordt de Cart Editor onleesbaar of onbruikbaar en kan het gebruikers buitensluiten van bewerken of zelfs scrollen op de pagina.

​
Tijdelijke oplossing met Developer Tools

Volg deze stappen om de lay-out tijdelijk te herstellen met de Developer Tools van je browser, zodat je toegang krijgt tot het Custom HTML-veld.

​
Stap 1: Open DevTools

  1. Open de Cart Editor in de Upcart-app
  2. Klik met de rechtermuisknop ergens op de pagina en selecteer Inspect, of druk op:
    • Cmd + Option + I (Mac)
    • Ctrl + Shift + I (Windows)

​
Stap 2: Vind de kapotte lay-outcontainer

  1. Klik in het tabblad Elements van DevTools op de selector-tool (linksboven in DevTools)
  2. Beweeg over de Cart Editor-lay-out en zoek de groen gemarkeerde sectie links van het instellingenpaneel. Deze zou het label moeten hebben:
  3. Ga zes niveaus omhoog in de hiërarchie totdat je bij het volgende komt:

​
Stap 3: Schakel de fixed position uit

  1. Kijk met .Polaris-Frame__Content geselecteerd onder het tabblad Styles
  2. Zoek de eigenschap position: fixed en vink deze uit
Dit zou de pagina moeten ontgrendelen en je weer door de lay-out laten scrollen.

​
Verwijder de ongeldige HTML

Nu de lay-out weer toegankelijk is:
  1. Scrol naar het veld Custom HTML
  2. Zoek naar kapotte HTML of ingesloten CSS die het probleem kan hebben veroorzaakt
Voorbeeld van wat de lay-out doorgaans breekt:
  1. Kopieer de inhoud ergens anders als back-up en verwijder deze vervolgens
  2. Sla je wijzigingen op

​
Controleer of het is opgelost

Na het opslaan zou de Cart Editor weer normaal moeten laden. Als het probleem aanhoudt, controleer dan opnieuw op achtergebleven ongeldige tags of neem contact op met de merchant om te bevestigen wat er is toegevoegd.

​
Best practices om dit probleem te voorkomen

  • Voeg alleen volledige en geldige HTML in
  • Vermijd het toevoegen van inline <style>-blokken rechtstreeks in HTML-locaties
  • Gebruik de sectie Custom CSS in plaats van CSS toe te voegen in HTML-velden
  • Bekijk je wijzigingen altijd eerst in Sandbox-modus als je twijfelt