카트에 추가 버튼 숨기기
상점에서 카트에 추가 버튼을 숨기고 향후 다시 표시할 수 있습니다.
참고: 이 사용자 지정은 동적 결제 버튼과 호환되지 않습니다. 테마에서 동적 결제를 지원하는 경우 제품 페이지에서 동적 결제 버튼을 숨기기 위한 단계를 수행하여 버튼이 표시되지 않도록 합니다.
섹션 지원 및 섹션 미지원 테마
Shopify 관리자에서 온라인 스토어 > 테마로 이동합니다.
편집할 테마를 찾아 ... 버튼을 클릭하여 작업 메뉴를 연 다음 코드 편집을 클릭합니다.
Shopify 앱에서 스토어를 탭합니다.
판매 채널 섹션에서 온라인 스토어를 탭합니다.
테마 관리를 탭합니다.
편집할 테마를 찾아 ... 버튼을 클릭하여 작업 메뉴를 연 다음 코드 편집을 클릭합니다.
Shopify 앱에서 스토어를 탭합니다.
판매 채널 섹션에서 온라인 스토어를 탭합니다.
테마 관리를 탭합니다.
편집할 테마를 찾아 ... 버튼을 클릭하여 작업 메뉴를 연 다음 코드 편집을 클릭합니다.
-
섹션 디렉토리에서
product-template.liquid파일을 클릭하여 엽니다. 카트에 추가 버튼에 해당하는 HTML 코드를 찾습니다. 카트(cart)라는 단어를 사용하여 검색을 시작할 수 있습니다.
카트에 추가 버튼의 코드는 테마별로 다릅니다. Add to cart, AddToCart 또는 add-to-cart 같은 텍스트가 있는 <input> 또는 <button> 태그를 찾습니다.
Debut 테마에서 카트에 추가 버튼 코드는 다음과 같이 표시됩니다.
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>- 코드를 찾으면 Liquid
{% comment %}및{% endcomment %}태그로 둘러쌉니다. 이렇게 하면 스토어에 코드가 표시되지 않지만 나중에 새 템플릿을 변경하려는 경우 쉽게 다시 넣을 수 있습니다.
위의 예제를 사용한 새 코드는 다음과 같습니다.
{% comment %}
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
{{ 'products.product.sold_out' | t }}
{% else %}
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
{% endcomment %}- 저장을 클릭하여 변경 사항을 확인합니다.
카트에 추가 버튼을 다시 표시할 준비가 되면 HTML/CSS 페이지 편집의 product-template.liquid 파일로 돌아가서 {% comment %} 및 {% endcomment %} 태그를 제거하고 저장을 클릭합니다.
Shopify 관리자에서 온라인 스토어 > 테마로 이동합니다.
편집할 테마를 찾아 ... 버튼을 클릭하여 작업 메뉴를 연 다음 코드 편집을 클릭합니다.
Shopify 앱에서 스토어를 탭합니다.
판매 채널 섹션에서 온라인 스토어를 탭합니다.
테마 관리를 탭합니다.
편집할 테마를 찾아 ... 버튼을 클릭하여 작업 메뉴를 연 다음 코드 편집을 클릭합니다.
Shopify 앱에서 스토어를 탭합니다.
판매 채널 섹션에서 온라인 스토어를 탭합니다.
테마 관리를 탭합니다.
편집할 테마를 찾아 ... 버튼을 클릭하여 작업 메뉴를 연 다음 코드 편집을 클릭합니다.
-
템플릿 디렉토리에서
product.liquid파일을 클릭하여 엽니다. 카트에 추가 버튼에 해당하는 HTML 코드를 찾습니다. 카트(cart)라는 단어를 사용하여 검색을 시작할 수 있습니다.
카트에 추가 버튼의 코드는 테마별로 다릅니다. Add to cart, AddToCart 또는 add-to-cart 같은 텍스트가 있는 <input> 또는 <button> 태그를 찾습니다.
Minimal 테마에서 카트에 추가 버튼 코드는 다음과 같이 표시됩니다.
<button type="submit" name="add" id="AddToCart" class="btn">
<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>- 코드를 찾으면 Liquid
{% comment %}및{% endcomment %}태그로 둘러쌉니다. 이렇게 하면 스토어에 코드가 표시되지 않지만 나중에 새 템플릿을 변경하려는 경우 쉽게 다시 넣을 수 있습니다.
위의 예제를 사용한 새 코드는 다음과 같습니다.
{% comment %}
<button type="submit" name="add" id="AddToCart" class="btn">
<span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>
{% endcomment %}- 저장을 클릭하여 변경 사항을 확인합니다.
카트에 추가 버튼을 다시 표시할 준비가 되면 HTML/CSS 페이지 편집의 product.liquid 템플릿으로 돌아가서 {% comment %} 및 {% endcomment %} 태그를 제거하고 저장을 클릭합니다.