Laat klanten een optie kiezen

Wanneer klanten een productpagina in je webshop bezoeken, wordt standaard de eerste beschikbare variant geselecteerd. Met deze aanpassing deactiveer je het automatisch selecteren van de eerste beschikbare variant. Op die manier wordt de klant gevraagd om handmatig een variant te selecteren voordat deze wordt weergegeven.

Kies een optie

Thema's met en zonder secties

Stappen voor thema's met secties

Je thema selecteren

De stappen voor deze aanpassing variëren naargelang je thema. Klik op de knop voor je thema voordat je de onderstaande instructies volgt:

Stappen voor thema's zonder secties

Voeg termen toe aan je variantmenu's

Prompts toevoegen aan je vervolgkeuzelijsten voor varianten:

  1. Klik in de directory Fragmenten op Een nieuw fragment toevoegen.
  2. Benoem je nieuwe fragment pick-an-option.

Een nieuw fragment toevoegen

  1. Plak deze code die wordt gehost op GitHub in het nieuwe fragmentbestand.
  2. Klik op Opslaan.
  3. Klik in de directory Opmaak op theme.liquid.
  4. Zoek de sluitende tag </body> onderaan het bestand. Plak de volgende code op een nieuwe regel boven de sluitende tag </body>:
{% render 'pick-an-option' %}

Het fragment

  1. Klik op Opslaan.
  2. Zoek het bestand met het formulier Aan winkelwagen toevoegen. Dit bevat het attribuut action dat is ingesteld op /cart/add. Dit zou in een van deze vier bestanden moeten staan:

    • de template product.liquid onder Templates
    • de opmaak theme.liquid onder Opmaak
    • het fragment product.liquid onder Fragmenten
    • het fragment single-product.liquid onder Fragmenten
  3. Zoek deze code in het formulier:

<option {% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} data-sku="{{ variant.sku }}" value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money_with_currency }}</option>

of

<option {% if variant == current_variant %} selected="selected" {% endif %} data-sku="{{ variant.sku }}" value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money_with_currency }}</option>

Vervang door:

<option {% if forloop.length <= 1 and variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} data-sku="{{ variant.sku }}" value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money_with_currency }}</option>
  1. Zoek en vervang de volgende code:
    • Minimal, Pop of Supply: Als je Minimal, Pop of Supply gebruikt, zoek dan alle instanties van deze code:
{% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}

Vervang dit door:

{% assign featured_image = product.selected_variant.featured_image | default: product.featured_image %}
  • Andere gratis Shopify-thema's: Als je een ander Shopify-thema gebruikt, zoek dan deze code:
{% assign current_variant = product.selected_or_first_available_variant %}

Vervang door:

{% assign current_variant = product.selected_variant %}
  1. Klik op Opslaan.

De taalinstellingen van de knop Toevoegen aan winkelwagen wijzigen

Je kunt de taalinstellingen van de knop Toevoegen aan winkelwagen wijzigen zodat producten niet worden weergegeven als 'Niet beschikbaar' voordat er een selectie wordt gemaakt.

  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.
  2. Zoek het thema dat je wilt bewerken en klik op ... > Content van standaardthema bewerken.
  3. Typ unavailable in de Filter-sectie om de vertaling van "Niet beschikbaar" weer te geven.
  4. Vervang de tekst Niet beschikbaar om Make a selection.
  5. Klik op Opslaan.

Klaar om te beginnen met verkopen met Shopify?

Probeer het gratis