Variation Swatches for WooCommerce: installeren, instellen en problemen oplossen
Laatst bijgewerkt:
Standaard toont WooCommerce bij een variabel product een keuzelijst: “Kies een optie”. Met Variation Swatches for WooCommerce maak je daar knoppen van: kleurvlakjes, afbeeldingen of labels zoals S, M en L. Dat is duidelijker voor klanten, zeker op mobiel. De plugin werkt met de eigenschappen (attributen) van WooCommerce; als die niet goed zijn ingericht, verschijnen de knoppen ook niet.
Wat doet Variation Swatches?
- Knoppen als kleur, afbeelding of label in plaats van een keuzelijst.
- Uitgegrijsde of doorgestreepte opties voor combinaties die niet bestaan of niet op voorraad zijn.
- De betaalde versie voegt onder meer knoppen in productoverzichten, een andere productafbeelding per kleur en extra vormen en tooltips toe.
Installeren
- Installeer de plugin via Plugins → Nieuwe plugin en activeer hem.
- Ga naar Producten → Eigenschappen en kies per eigenschap het type: kleur, afbeelding of label.
- Geef per waarde (bijvoorbeeld “Rood”) de kleur of afbeelding op.
- Controleer een variabel product op desktop en mobiel.
Instellingen die ertoe doen
- Globale eigenschappen versus eigen eigenschappen per product. Knoppen met kleur of afbeelding werken het best met globale eigenschappen onder Producten → Eigenschappen.
- Vorm en grootte van de knoppen, en of de naam als tooltip verschijnt.
- Gedrag bij niet-beschikbare combinaties: verbergen, uitgrijzen of doorstrepen.
- Drempel voor AJAX-variaties: bij producten met veel variaties laadt WooCommerce de beschikbaarheid later in; dat beïnvloedt hoe de knoppen reageren.
Veelvoorkomende problemen en oplossingen
Er verschijnen geen knoppen, alleen de keuzelijst. De eigenschap is als eigen eigenschap in het product aangemaakt in plaats van als globale eigenschap, of het type staat nog op “keuzelijst”. Zet de eigenschap om naar een globale en kies het type.
Niet-beschikbare combinaties zijn toch klikbaar. Bij producten met meer variaties dan de drempel laadt WooCommerce de beschikbaarheid pas na een keuze. De knoppen kunnen dan niet vooraf uitgrijzen. Verhoog de drempel met een klein codefragment of accepteer dit gedrag; bij heel veel variaties maakt verhogen de pagina trager.
Knoppen werken niet in een eigen productsjabloon. Het sjabloon van je paginabouwer gebruikt een eigen variatieformulier. Gebruik het standaard widget voor “toevoegen aan winkelwagen” van WooCommerce in je Elementor Pro- of themasjabloon.
Afbeelding wisselt niet bij een kleur. Er is geen afbeelding ingesteld bij de variatie zelf. Geef elke variatie een eigen afbeelding.
Alternatieven en vergelijking
Veel thema’s, zoals Astra met Pro-add-on of themes met eigen WooCommerce-functies, hebben al een eigen versie van kleurknoppen. Gebruik er één. Wil je extra keuzes zonder eigen voorraad, zoals graveren, dan gebruik je Product Add-Ons in plaats van variaties.
Veilig bijwerken
Back-up eerst, werk bij en controleer een paar variabele producten, ook met een niet-beschikbare combinatie en op mobiel.
Wanneer schakel je hulp in?
Moeten je eigenschappen opnieuw worden ingericht, of werken de knoppen niet in je eigen sjabloon? Wij helpen met installeren, instellen, bijwerken en het oplossen van fouten.
Variation Swatches for WooCommerce Pro bestellen
Premium plugins vanaf €5 — dankzij onze bulk-inkoop
- Inclusief setup en installatie
- Inclusief onbeperkte support
Wij leveren Variation Swatches for WooCommerce Pro met licentie, installeren de plugin en stellen hem voor je in. Liever zelf bij de maker kopen kan ook; dan helpen we met installeren en instellen.
- Kies de plugin.
- Vul je domeinnaam in (en het aantal websites).
- Je krijgt van ons de prijs en een betaallink.
- Na betaling installeren en stellen wij de plugin voor je in; support is onbeperkt.
Veelgestelde vragen
Waarom zie ik nog steeds een keuzelijst in plaats van knoppen?
De eigenschap is waarschijnlijk per product aangemaakt in plaats van als globale eigenschap, of het type staat nog op keuzelijst. Zet het om onder Producten > Eigenschappen.
Kan ik een afbeelding als knop gebruiken?
Ja, kies het type afbeelding bij de eigenschap en geef per waarde een afbeelding op.
Waarom zijn niet-beschikbare opties toch klikbaar?
Bij producten met veel variaties laadt WooCommerce de beschikbaarheid pas later in. Daardoor kunnen de knoppen niet vooraf uitgrijzen.
Werkt de plugin in productoverzichten?
Knoppen in productoverzichten horen bij de betaalde versie van de plugin.
Kan ik Variation Swatches for WooCommerce Pro met licentie via Layg bestellen?
Ja. Premium plugins vanaf €5 — dankzij onze bulk-inkoop, inclusief setup en installatie en inclusief onbeperkte support. Vul bij "Variation Swatches for WooCommerce Pro bestellen" je domeinnaam en het aantal websites in en klik op Bestellen / prijs opvragen. Je krijgt de prijs en een betaallink; daarna installeren en stellen wij de plugin voor je in.
Hulp nodig met Variation Swatches?
Wij helpen met installeren, instellen, bijwerken en het oplossen van fouten en conflicten. Vertel wat er speelt; je hoort vooraf wat we gaan doen.
Hulp aanvragen Site plat? SpoedhulpLees ook: alle WordPress-plugins · WooCommerce · Product Add-Ons · YITH Wishlist · FiboSearch · WooCommerce-webshop