Dölj Lägg till i varukorgen-knappar

Varning

Detta är en avancerad handledning och den stöds inte av Shopify. Kunskap om webbdesignspråk som HTML, CSS, JavaScript och Liquid krävs. Vi föreslår att du anlitar en Shopify-partner om du inte är bekväm med att fortsätta med följande handledning.

Varning

Vintage-teman är inte tillgängliga i temabutiken. Dessa teman har inte funktionerna som ingår i Shopifys Online Store 2.0-teman och Shopifys gratis Vintage-teman får inte uppdateringar utöver säkerhetsfixar.

Observera

Denna anpassning är för Shopifys vintageteman och gäller inte teman för webbutik 2.0.

• Hitta temats arkitekturversion
• Utforska temaanpassningar för Online Store 2.0

Du kan dölja knapparna Lägg till i varukorgen i ditt skyltfönster och visa dem igen i framtiden.

Observera

Denna anpassning är inte kompatibel med dynamiska kassaknappar. Om ditt tema stöder dynamisk kassa kan du förhindra att knapparna visas genom att följa stegen för att dölja dynamiska kassaknappar på produktsidorna.

Avsnitt och icke-sektionerade teman

Obs! Stegen i den här handledningen varierar beroende på om du använder ett tema med avsnitt eller ett tema utan avsnitt. Med ett tema med avsnitt kan du dra och släppa för att arrangera layouten på din startsida, men inte med ett tema utan avsnitt.

Gå till temasidan Redigera kod för att ta reda på om ditt tema stöder avsnitt. Om det finns filer i Avsnittskatalogen använder du ett avgränsat tema. Icke-sektionerade teman släpptes före oktober 2016 och har inga filer i Avsnittskatalogen.

Om du använder ett avgränsat tema klickar du på knappen Avgränsade teman-knapp och följer anvisningarna. Om du använder ett äldre, icke-avsnittsbaserat tema klickar du på knappen Icke-avgränsade teman och följer anvisningarna.

Sectioned

1. Från din Shopify-admin går du till Webbshop > Teman.
2. Hitta det tema du vill redigera, klicka på knappen … för att öppna åtgärdsmenyn och klicka sedan på Redigera kod.
3. I katalogen Avsnitt klickar du för att öppna din product-template.liquid-fil. Hitta HTML-koden för knappen Lägg till i varukorg. Du kan söka efter ordet varukorg till en början.

Koden för knappen lägg till i varukorg varierar från tema till tema. Leta efter en <input>- eller <button>-tagg med text som Add to cart, AddToCart eller add-to-cart.

I temat Debut ser knappen lägg till i varukorg ut så här:

<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>

1. När du hittar koden ska du slå in den i Liquid-taggarna {% comment %} och {% endcomment %}. Det hindrar koden från att visas i din butik men gör det möjligt för dig att enkelt lägga tillbaka den om du vill ändra din nya mall senare.

Med hjälp av exemplet ovan skulle den nya koden se ut så här:

{% 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 %}

Varning

Se till att du inte kommenterar bort taggarna <form> för din produktsida. Dina kommentarstaggar bör inte omge några <form>- eller </form>- taggar, eftersom kunder då kan uppleva fel när de tittar på din produktsida.

1. Klicka på Spara för att bekräfta dina ändringar.

När du är redo att visa knapparna Lägg till i varukorg igen går du tillbaka till din product-template.liquid-fil på sidan Redigera HTML/CSS, tar bort taggarna {% comment %} och {% endcomment %} och klickar på Spara.

Non-sectioned

1. Från din Shopify-admin går du till Webbshop > Teman.
2. Hitta det tema du vill redigera, klicka på knappen … för att öppna åtgärdsmenyn och klicka sedan på Redigera kod.
3. I katalogen Mallar klickar du för att öppna din product.liquid-fil. Hitta HTML-koden för knappen Lägg till i varukorg. Du kan söka efter ordet varukorg till en början.

Koden för knappen lägg till i varukorg varierar från tema till tema. Leta efter en <input>- eller <button>-tagg med text som Add to cart, AddToCart eller add-to-cart.

I temat Minimal ser knappen lägg till i varukorg ut så här:

<button type="submit" name="add" id="AddToCart" class="btn">
  <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>

1. När du hittar koden ska du slå in den i Liquid-taggarna {% comment %} och {% endcomment %}. Det hindrar koden från att visas i din butik men gör det möjligt för dig att enkelt lägga tillbaka den om du vill ändra din nya mall senare.

Med hjälp av exemplet ovan skulle den nya koden se ut så här:

{% comment %}
<button type="submit" name="add" id="AddToCart" class="btn">
  <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>
{% endcomment %}

Varning

Se till att du inte kommenterar bort taggarna <form> för din produktsida. Dina kommentarstaggar bör inte omge några <form>- eller </form>- taggar, eftersom kunder då kan uppleva fel när de tittar på din produktsida.

1. Klicka på Spara för att bekräfta dina ändringar.

När du är redo att visa knapparna Lägg till i varukorg igen går du tillbaka till din product.liquid-mall på sidan Redigera HTML/CSS, tar bort taggarna {% comment %} och {% endcomment %} och klickar på Spara.