> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Upcart HTML-locatiebibliotheek

> Leer waar aangepaste HTML en JavaScript in de cart drawer verschijnen.

<div id="overview">
  # Overzicht
</div>

Met Upcart kun je HTML of JavaScript invoegen op specifieke locaties in de winkelwagen met behulp van de **Custom HTML**-editor. Dit geeft je volledige controle over de lay-out, zichtbaarheid en voorwaardelijke inhoud binnen de winkelwagenervaring.

Gebruik deze gids om te begrijpen hoe elke locatie zich gedraagt en waar je inhoud verschijnt.

<div id="available-html-locations">
  ## Beschikbare HTML-locaties
</div>

<div id="above-announcementsrewards">
  #### **Above announcements/rewards**
</div>

Wordt direct onder de winkelwagen-header weergegeven, vóór alle modules.\
Gebruik dit om sitebrede berichten, labels of dynamische banners toe te voegen.

<div id="below-headerannouncementsrewards">
  #### **Below header/announcements/rewards**
</div>

Wordt direct na de Announcements- en Rewards-modules weergegeven, net vóór de productlijst.

<div id="between-each-line-item">
  #### **Between each line item**
</div>

Herhaalt je HTML na elk product in de winkelwagen.\
Ideaal voor het tonen van disclaimers of aanvullende productspecifieke informatie.

<div id="below-cart-items">
  #### **Below cart items**
</div>

Wordt onder de productlijst weergegeven, na alle regelartikelen in de winkelwagen. Gebruik dit voor berichten, banners of aangepaste inhoud die onder de producten maar boven de upsells en add-ons moet verschijnen.

<div id="above-footeradd-ons">
  #### **Above footer/add-ons**
</div>

Verschijnt onder de productlijst en upsells, maar boven de Add-ons-sectie.\
Ideaal voor berichten die aansluiten op garantie- of verzendbeschermingsaanbiedingen.

<div id="above-checkout-button">
  #### **Above checkout button**
</div>

Wordt weergegeven in het footergebied, net boven de checkout-knop en het subtotaal.\
Vaak gebruikt om prijsuitsplitsingen, verzendmeldingen of voorwaarden te tonen.

<div id="below-checkout-button">
  #### **Below checkout button**
</div>

Ook in de footer, gepositioneerd na de checkout-knop en vóór de express-betaalknoppen. Add-ons worden bovenaan de footer weergegeven, ruim hierboven.\
Handig voor secundaire CTA's of juridische mededelingen.

<div id="bottom-of-cart">
  #### **Bottom of cart**
</div>

Wordt buiten het footergebied weergegeven, helemaal onderaan de cart drawer.\
Neemt de achtergrondkleur van de footer niet over.

<div id="on-empty-cart-screen">
  #### **On empty cart screen**
</div>

Wordt alleen getoond wanneer de winkelwagen leeg is.\
Wordt direct **onder** het bericht "Your cart is empty" en boven de aanbevelingenmodule weergegeven — handig voor een ondersteunende regel of een link naar een collectie.

<div id="scripts-before-load">
  #### **Scripts (Before Load)**
</div>

Onzichtbare plaatsing die wordt gebruikt om JavaScript uit te voeren **voordat** de winkelwagen laadt.\
Gebruik dit voor het definiëren van variabelen, het instellen van voorwaarden of het aanpassen van het gedrag van Upcart.

* Alle plaatsingen van aangepaste HTML worden beheerd onder:\
  **Upcart > Cart Editor > Settings > Custom HTML**

<div id="visual-reference">
  ## Visuele referentie
</div>

Raadpleeg de gelabelde lay-out hieronder voor een duidelijk beeld van waar elke locatie in de winkelwagen wordt weergegeven

<Frame>
  <img src="https://mintcdn.com/aftersell/uxKAdY-e0h16xa48/images/upcart/html-locations-labeled-cart-drawer.gif?s=fd801e149233b51066ee15010556c375" alt="Gelabelde Upcart cart drawer die toont waar elke aangepaste HTML-locatie wordt weergegeven" width="700" height="1080" data-path="images/upcart/html-locations-labeled-cart-drawer.gif" />
</Frame>