Website-Header überlappt Upcart - Aftersell & Upcart Docs

Warum das passiert

In manchen Shopify-Themes hat der Header einen höheren z-index als Upcart, wodurch der Warenkorb darunter erscheint. Dadurch kann Upcart teilweise verdeckt oder unzugänglich wirken, wenn Kundinnen und Kunden den Warenkorb öffnen.

So behebst du es

Folge den Schritten unten, um Upcart vor deinen Website-Header zu bringen:

Kopiere den Code, der am Ende dieses Artikels bereitgestellt wird.
Öffne in deinem Shopify-Adminbereich den Upcart Cart Editor, gehe zu Settings und wähle den Tab Custom HTML. Settings ist eine Reihe von Tabs — wenn du Custom HTML nicht siehst, findest du es unter More settings.
Klicke auf das HTML-Dropdown und wähle Scripts (Before Load).
Füge den Code in das Feld ein.
Klicke auf Save changes.
Aktualisiere deinen Storefront und teste deinen Warenkorb.

Nach diesen Schritten sollte der Warenkorb korrekt über deinem Website-Header angezeigt werden.

Erforderlicher Code:

<script>  
	// Find UpCart  
	let upcart = document.querySelector("#upCart");  
  
	// Find the site's body  
	let body = document.body;  
	  
	// If we found both  
	if(upcart && body)  
			// Move upcart to the top of the body's children so it takes priority over site header  
	    body.firstChild.before(upcart)  
</script>

⌘I