De banner die achter thema-elementen verdwijnt oplossen (nieuwe versie)

Overzicht

De banner wordt weergegeven als de webcomponent pandectes-cmp. Thema-CSS stijlt deze niet op dezelfde manier als het Legacy-element #pandectes-banner.

Sticky headers, mededelingenbalken, chatknoppen en sommige apps gebruiken een zeer hoge z-index. Als ze boven de banner staan, kunnen bezoekers niet op Accept of Decline klikken.

Verhoog bij de nieuwe banner de stapelvolgorde onder Cookie banner > Style (surfaces / z-index). De maximale waarde is 2147483647.

Voordat je begint

• Controleer of de banner is ingeschakeld (of ingeschakeld voor admins) en of Pandectes Core aan staat in het thema.
• Reproduceer het probleem op de webshop, niet alleen in de voorvertoning in de app, want de voorvertoning ziet er anders uit dan het live thema.

De z-index verhogen in Style

1. Open Shopify Admin > Apps > Pandectes GDPR Compliance.
2. Ga naar Cookie banner > Style.
3. Zoek surfaces / z-index.
4. Voer een waarde in die hoger is dan het overlappende element (vaak 999999 of het maximum 2147483647).
5. Klik op Save.
6. Ververs de webshop (harde verversing) en probeer Accept / Decline opnieuw.

Als Style niet genoeg is

Voeg een regel toe onder Style > Custom styling. Beperk deze tot de webcomponent. Zie Custom styling with CSS.

Voorbeeld:

pandectes-cmp {
  z-index: 2147483647;
}

Andere controles

• Op mobiel kan een Bar onderaan onder een sticky add-to-cart-balk komen te liggen. Wijzig de mobiele positie of gebruik een mobiele afwijking. Zie How to use different banner layouts on mobile and desktop (New Version).
• Chatwidgets gebruiken vaak een hoge z-index. Verplaats de consent widget naar de tegenoverliggende hoek. Zie How to enable and customize the Consent widget (New Version).
• Als knoppen op iPhone helemaal niet reageren, onderschept mogelijk een thema-script de tikken. Zie The banner or the application, in general, is not working, what can I do?.

Gerelateerde artikelen

• How to customize banner style, colors, logos, and buttons (New Version)
• My banner is not showing up: Troubleshooting

Bijgewerkt op: 19/10/2026