사이트 헤더가 Upcart를 가려요 - Aftersell & Upcart Docs

이런 문제가 발생하는 이유

일부 Shopify 테마에서는 헤더의 z-index가 Upcart보다 높아 카트가 헤더 아래에 표시돼요. 이 때문에 고객이 카트를 열었을 때 Upcart가 부분적으로 가려지거나 접근할 수 없는 것처럼 보일 수 있어요.

해결 방법

Upcart를 사이트 헤더 앞으로 가져오려면 아래 단계를 따르세요:

이 문서 하단에 제공된 코드를 복사하세요.
Shopify 관리자에서 Upcart Cart Editor를 열고 Settings로 이동한 다음 Custom HTML 탭을 선택하세요. Settings는 탭 행으로 되어 있어요 — Custom HTML이 보이지 않으면 More settings 안에 있어요.
HTML 드롭다운을 클릭하고 **Scripts (Before Load)**를 선택하세요.
필드에 코드를 붙여넣으세요.
Save changes를 클릭하세요.
스토어프론트를 새로고침하고 카트를 테스트하세요.

이 단계를 완료하면 카트가 사이트 헤더 위에 올바르게 표시될 거예요.

필요한 코드:

<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