WooCommerce-snelcodes: Een uitgebreide gids

Belangrijkste hoogtepunten

• Eenvoudig aanpassen – Voeg dynamische WooCommerce elementen toe zonder codering.
• Snelle installatie – Kopieer en plak shortcodes moeiteloos in pagina’s.
• Flexibele productweergave – Toon uitgelichte, recente of categorie-specifieke producten.
• Betere gebruikerservaring – Verbeter de navigatie met knoppen voor het volgen van bestellingen en het winkelwagentje.
• Eenvoudige probleemoplossing – Herstel veelvoorkomende fouten met eenvoudige syntaxcontrole.
• Alternatieve opties – Gebruik WooCommerce blokken of plugins voor meer maatwerk.
• Hosting is belangrijk – Een betrouwbare host zoals Bluehost zorgt voor soepele prestaties.

Inleiding

Als een van de populairste e-commerce platformen ter wereld biedt WooCommerce een groot aantal functies waarmee je producten en diensten online kunt verkopen.

Maar wist je dat er een functie is waarmee je nog meer uit je e-commercewinkel kunt halen?

We hebben het over shortcodes.

Als je ze niet kent, hoef je je geen zorgen te maken. We leggen uit wat ze zijn en hoe je ze kunt gebruiken om je webwinkel te optimaliseren. Daarnaast gaan we in op effectieve manieren om fouten in shortcodes op te lossen.

Klaar om alles te leren over WooCommerce shortcodes? Laten we erin duiken.

Wat zijn WooCommerce shortcodes?

WooCommerce shortcodes zijn WordPress codefragmenten die een specifieke functie op je website uitvoeren. Deze stukjes code hebben een vooraf gedefinieerde functionaliteit en zijn speciaal gemaakt voor WooCommerce.

Alle shortcodes hebben dezelfde structuur – korte teksten tussen vierkante haken. Als er meerdere teksten worden gebruikt, worden ze aan elkaar gekoppeld met underscores en komma “s. Zodra u de syntaxis of de handler-functie begrijpt, kunt u beginnen met het toevoegen van shortcodes aan uw websitepagina” s.

WooCommerce shortcodes kunnen worden gebruikt met parameters of argumenten (args), waarmee je je website nog verder kunt aanpassen. Een parameter is het attribuut dat door een shortcode wordt aangepast, terwijl een argument de waarde is die aan dat attribuut wordt toegekend.

Als je bijvoorbeeld een shortcode voor producten gebruikt, kun je het aantal weer te geven producten instellen (parameter) en het aantal kolommen dat je wilt (argument).

Hier vind je een overzicht van de parameters en argumenten in een WooCommerce shortcode:

[related_products limit=”4″]

In dit voorbeeld is “limiet” de parameter, terwijl “4” het argument is. Met parameters kun je shortcodes aanpassen zodat ze op verschillende manieren kunnen functioneren, afhankelijk van je wensen of eisen. Niet alle WooCommerce shortcodes gebruiken echter parameters.

Waarom zou je WooCommerce shortcodes gebruiken?

Met WooCommerce shortcodes kun je je e-commerce shop aanpassen door verschillende functies aan je berichten en pagina’s toe te voegen zonder enige codeerervaring. Door gebruik te maken van reeds bestaande code kun je een aanzienlijke hoeveelheid tijd besparen die je zou hebben besteed aan het schrijven van je eigen code.

Shortcodes bieden een snelle en handige manier om het ontwerp van uw website te verbeteren voor meer conversies. Met deze codeknipsels kun je een superieure winkelervaring creëren en je merk onderscheiden van concurrenten.

Hoe WooCommerce shortcodes gebruiken

Nu je weet wat WooCommerce shortcodes zijn en waarom ze belangrijk zijn, laten we eens kijken hoe je ze kunt gebruiken. Het toevoegen van shortcodes aan je WooCommerce winkel is vrij eenvoudig, zelfs als je geen kennis hebt van codering.

Maar voordat je wijzigingen aanbrengt aan je website, kun je het beste een back-up maken van je gegevens. Zo kun je je website herstellen naar de vorige staat als er iets misgaat.

Als je de Classic Editor gebruikt, hoef je alleen maar de gekozen shortcode te kopiëren en op de gewenste pagina te plakken.

Aan de andere kant vereist de Gutenberg blok-editor dat je de shortcode toevoegt aan een shortcode blok. In deze tutorial laten we je zien hoe je shortcodes toevoegt aan je WordPress website met de Gutenberg editor.

Laten we beginnen:

1. Log in op je WordPress dashboard.
2. Ga naar ‘Pagina’s’ in het linkermenu en selecteer ‘Nieuwe toevoegen’. Je kunt een nieuwe of bestaande pagina gebruiken.
3. Klik op het “zwarte plus-pictogram” (+) om een blok te maken.

4. Zodra je op het plus-pictogram hebt geklikt, zie je het shortcodeblok. Klik erop om het toe te voegen aan de editor. Je kunt ook [/] typen op de pagina en zoeken naar “shortcode”.

5. Typ of plak de gewenste shortcode in het daarvoor bestemde veld.

6. Bekijk een voorbeeld van de pagina om te controleren of alles er goed uitziet.
7. Klik op de knop “Publiceren” in de rechterbovenhoek van de pagina.

Dat is het! Je hebt met succes een WooCommerce shortcode aan je pagina toegevoegd. Nu je weet hoe je deze code snippets kunt gebruiken, laten we eens kijken naar de verschillende shortcodes die je kunt gebruiken om je WordPress website te verbeteren.

WooCommerce shortcodes en hoe ze te gebruiken

Hoewel er veel WooCommerce shortcodes zijn, dienen ze allemaal verschillende doelen. We hebben een lijst samengesteld van enkele van de populairste shortcodes die je kunt gebruiken om de functionaliteit van je online shop te verbeteren.

1. WooCommerce pagina snelcodes

Als je de WooCommerce Setup Wizard hebt doorlopen, is het je misschien opgevallen dat pagina shortcodes automatisch worden gegenereerd. Hier vind je de populairste shortcodes en hoe je ze kunt gebruiken.

Winkelwagen

De WooCommerce winkelwagen shortcode vereenvoudigt het toevoegen van een winkelwagenpagina aan je webwinkel. Het creëert een standaard winkelwagenpagina, zodat je er geen vanaf nul hoeft op te bouwen.

Deze shortcode geeft niet alleen alle producten weer die je klanten aan hun winkelwagen hebben toegevoegd, maar ook het subtotaal, de hoeveelheid en de prijs van elk product. De WooCommerce winkelwagen shortcode ziet er als volgt uit:

[woocommerce_cart]

Bestelling volgen

Deze shortcode maakt een standaardformulier aan dat online shoppers kunnen gebruiken om de status van hun bestellingen te controleren. Zodra het formulier is aangemaakt, moeten klanten hun bestel-ID’s en factuure-mails invoeren om hun bestellingen te volgen.

Om een bestelvolgformulier te maken, voert u de onderstaande shortcode in:

[woocommerce_order_tracking]

Zo ziet het bestelvolgformulier eruit op de voorkant van je winkel:

Mijn account

Deze shortcode geeft de accountgegevens van een klant weer. Hiermee kunnen klanten hun persoonlijke gegevens bekijken, wijzigen en bijwerken. Ze kunnen bijvoorbeeld hun vorige bestellingen bekijken, hun wachtwoorden en e-mailadressen wijzigen en in- en uitloggen bij hun accounts.

De shortcode hiervoor is:

[woocommerce_my_account]

Kassa

Deze WooCommerce shortcode maakt een afrekenpagina. Zo bevat het velden voor klanten om hun factuurgegevens en verzendinformatie toe te voegen. Deze shortcode bevat ook de knop “Bestelling plaatsen”.

Om de afrekenpagina aan je WooCommerce website toe te voegen, voer je de volgende shortcode in:

[woocommerce_checkout]

Omdat meer dan 70% van de online winkelwagentjes wordt verlaten, is het aanpassen van je WooCommerce afrekenpagina een effectieve manier om de conversie van je website te optimaliseren.

Je kunt je afrekenpagina aanpassen met plugins zoals de YITH WooCommerce Checkout Manager. Met deze plugin kun je bestaande velden aanpassen en aangepaste velden toevoegen om het afrekenproces te stroomlijnen.

2. WooCommerce productsnelkoppelingen

Met WooCommerce product shortcodes kun je aangepaste productpagina’s maken en producten weergeven waar je maar wilt. Laten we eens bekijken hoe je ze kunt gebruiken om je producten op verschillende manieren op je website weer te geven.

Producten

Geef elk item dat op voorraad is weer met de shortcode Producten:

[producten]

De productenpagina kan verder worden aangepast om producten weer te geven in oplopende (ASC) of aflopende volgorde (DESC).

Als je bijvoorbeeld producten in oplopende volgorde wilt weergeven, ziet de shortcode er als volgt uit:

[products order=”ASC”]

Als je nog meer aanpassingen wilt doen, heb je de optie om het aantal producten dat wordt weergegeven te beperken:

[products limit=”5″ order=”ASC”]

Andere parameters voor deze shortcode zijn:

• Bestel per
• Categorie
• Kolommen
• Pagineren
• SKU
• Label
• Klasse
• Best verkocht
• Top_gewaardeerd
• In_verkoop

Het is het vermelden waard dat parameters als best_selling, top_rated en on_sale niet samen moeten worden gebruikt.

Recente producten

Met deze shortcode kun je recente producten op je website weergeven. Als je spannende nieuwe producten hebt gelanceerd, kun je deze shortcode gebruiken om ze onder de aandacht te brengen en klanten te verleiden tot een aankoop.

Laten we zeggen dat je je zes nieuwste producten in drie rijen wilt weergeven. De shortcode hiervoor zou zijn:

[products limit=”6″ columns=”3″ orderby=”id” order=”DESC” visibility=”visible”]

Deze shortcode geeft een lijst van producten op basis van hun unieke ID “s, die worden gegenereerd wanneer productpagina” s worden aangemaakt.

Aanbevolen producten

Als er bepaalde producten zijn waar je de aandacht van je klanten op wilt vestigen, dan is deze WooCommerce shortcode iets voor jou. De basis shortcode is:

[featured_products]

Als je echter twee items in één rij wilt weergeven, ziet de shortcode er als volgt uit:

[featured_products limit=”2″ columns=”2″]

Producten in de uitverkoop

Als je producten wilt laten zien die in de aanbieding zijn, kunnen WooCommerce shortcodes een grote hulp zijn. Om drie producten in de uitverkoop weer te geven, gerangschikt op populariteit, kun je deze shortcode gebruiken:

[products limit=”3″ columns=”3″ orderby=”popularity” on_sale=”true”]

Hoogst gewaardeerde producten

Bij het zoeken naar producten die aan hun behoeften voldoen, gaan de meeste klanten op zoek naar de best beoordeelde artikelen. Hier komt de shortcode voor best beoordeelde producten om de hoek kijken. Hiermee kun je items met de hoogste beoordelingen weergeven in je online winkel.

De shortcode hiervoor is:

[top_rated_products]

Deze shortcode moet niet worden gebruikt in combinatie met on_sale of best_selling.

Best verkopende producten

Met shortcodes voor best verkopende producten kunt u uw best verkopende producten laten zien. Je kunt ze weergeven op je homepage om ze onder de aandacht te brengen zodra een potentiële klant je website bezoekt.

Als je een vierkolomsraster van je vier best verkopende producten wilt weergeven, is de shortcode als volgt:

[products limit=”4″ columns=”4″ best_selling=”true”]

Product tags

Met producttags kun je alleen producten met een bepaalde tag weergeven. De shortcode voor deze functie is vrij eenvoudig. Om bijvoorbeeld producten met de tag “broek” weer te geven, kun je de shortcode gebruiken:

[products tag=”pants”]

3. WooCommerce productcategorie shortcodes

Een andere veelgebruikte WooCommerce shortcode is de productcategorie shortcode. Hier zijn de twee belangrijkste shortcodes en hun gebruikssituaties.

Productcategorie

Met deze shortcode kun je producten uit een specifieke categorie op elke pagina weergeven. Als je klanten naar een nieuwe productcategorie wilt lokken, kan deze shortcode handig zijn:

[product_category]

Om bijvoorbeeld producten uit de categorie broeken weer te geven, kun je deze shortcode gebruiken:

[product_category category=”pants”]

Je kunt ervoor kiezen om dit verder aan te passen. Je kunt bijvoorbeeld zes producten uit de categorie broeken in drie kolommen en in aflopende volgorde weergeven met deze shortcode:

[product_category category=”pants” limit=”6″ columns=”3″ order=”DESC”]

Je kunt ook meer productcategorieën toevoegen en ze scheiden met komma’s. In het onderstaande voorbeeld voegen we jassen toe aan de categorie broeken.

[product_category category=”pants,jackets”]

Productcategorieën

Met de shortcode Productcategorieën kun je al je productcategorieën in één keer weergeven:

[product_categories]

Dus als je verschillende categorieën hebt, zoals broeken, t-shirts en jassen, zal deze shortcode al deze opties weergeven.

Deze shortcode kan ook worden gebruikt om specifieke categorie-ID’s te markeren. Bijvoorbeeld:

[product_categories ids=”5,6,7″]

4. Andere handige WooCommerce shortcodes

Naast de WooCommerce shortcodes die hierboven staan vermeld, zijn er nog andere handige shortcodes om aan je website toe te voegen.

Verwante producten

Zoals de naam al zegt, kun je met deze shortcode producten weergeven die gerelateerd zijn aan de producten die een klant op je website bekijkt. De basis shortcode is:

[related_products]

Het accepteert argumenten zoals limiet, orderby en kolommen. Je kunt bijvoorbeeld vier gerelateerde producten weergeven door een limietparameter toe te voegen aan de shortcode:

[related_products limit=”4″]

De limietparameter bepaalt het aantal gerelateerde producten dat je aan elke klant wilt tonen.

Hier is nog een voorbeeld:

[related_products limit=”4″ columns=”4″]

Hiermee kun je gerelateerde producten laten zien in een raster met vier producten per rij.

Product pagina

Met de shortcode Productpagina kun je een enkele productpagina weergeven op ID of SKU. Stel dat je een product wilt weergeven waarvan de ID 28 is.

De shortcode zou zijn:

[product_page id=”28″]

Als je graag blogberichten schrijft, kun je deze shortcode gebruiken om een specifiek product in je bericht op te nemen, zodat je lezers er gemakkelijk toegang toe hebben.

Om de ID van een product te vinden, log je in op je WordPress admin dashboard en navigeer je naar “Producten” > “Alle Producten”. Beweeg de muis over een specifieke producttitel en je ziet de unieke ID van het product.

Product tabel

Met de WooCommerce Producttabel kun je producttabellen toevoegen aan je webwinkel en klanten een prettige winkelervaring op één pagina bieden. Klanten kunnen de producten vinden die ze nodig hebben, de gewenste hoeveelheden selecteren en producten aan hun winkelwagen toevoegen zonder dat ze meerdere pagina’s hoeven te bezoeken.

Daarnaast bevat deze plugin tonnen aanpassingsopties. Je kunt bijvoorbeeld specifieke productcategorieën selecteren die je wilt laten zien. Je kunt er ook voor kiezen om productvariaties weer te geven met behulp van dropdown menu’s.

Ten slotte kun je de producttabel op elk deel van je website weergeven met de shortcode:

[cwpt_table]

In winkelwagen

Met de add-to-cart shortcode kun je de add-to-cart knop voor een enkel product weergeven. Het is een handige functie als je niet de volledige productdetails wilt weergeven.

Een blogbericht is een geweldige plek om de knop Toevoegen aan winkelwagentje te gebruiken. De WooCommerce shortcode hiervoor is:

[add_to_cart id=”99″]

Problemen oplossen met WooCommerce shortcodes

Als je ooit problemen ondervindt bij het gebruik van WooCommerce shortcodes, dan zijn hier een aantal handige tips die je kunt gebruiken om problemen op te lossen.

• Controleer of je de shortcode hebt ingesloten tussen <pre> tags. Als dit het geval is, ga dan naar de teksteditor om deze ongewenste tags te verwijderen.
• Zorg ervoor dat de aanhalingstekens recht (“) zijn en niet gekruld (”).
• Gebruik vierkante haakjes.
• Zorg ervoor dat elke attribuutwaarde die volgt op het gelijkheidsteken tussen aanhalingstekens staat.
• Gebruik de nieuwste versie van WooCommerce.
• Schakel over naar een ander thema, want je huidige thema kan conflicteren met de WordPress shortcode die je wilt gebruiken.
• Als je vermoedt dat een plugin de fout veroorzaakt, deactiveer dan elke plugin een voor een en blijf testen of de shortcode werkt.

Alternatieven voor WooCommerce shortcodes

Als je op zoek bent naar andere manieren om producten op je website te laten zien en je winkel aan te passen, zijn hier enkele alternatieven voor WooCommerce shortcodes die je kunt gebruiken.

WooCommerce blokken

WooCommerce blokken zijn een geweldig alternatief voor shortcodes. Ze bieden verschillende blokken die je kunt gebruiken om je e-commerce winkel te bouwen en aan te passen.

Door WooCommerce-blokken te gebruiken, kun je een raster van je best verkopende producten weergeven, beoordelingen van specifieke categorieën markeren, alle producten van je winkel weergeven en shoppers de mogelijkheid bieden om hun winkelwagen vanaf elke pagina te bekijken.

WooCommerce shortcode plugins

Verschillende plugins op de markt laten je shortcodes toevoegen aan je website zonder enige technische kennis. Intense is zo’n plugin. Het biedt meer dan 100 shortcodes en 19 aangepaste posttypes.

Aangepaste posttypes bieden je een manier om contentmarketing uit te breiden tot meer dan alleen blogposts. Deze plugin is mobiel responsief en is gemaakt met de prestaties van je website in gedachten, zodat je een superieure gebruikerservaring kunt creëren.

Bluehost WooCommerce hosting: Gemakkelijk je winkel draaiende houden

Als je op zoek bent naar een probleemloze manier om je online winkel op te zetten en te beheren, dan zijn de WooCommerce hostingpakketten van Bluehost het overwegen waard. Deze plannen zijn speciaal ontworpen voor e-commerce bedrijven en worden geleverd met WooCommerce voorgeïnstalleerd, zodat je meteen kunt beginnen met verkopen – zonder technische hoofdpijn.

Bovendien krijg je het eerste jaar een gratis domein, een gratis SSL-certificaat voor veilige transacties en 24/7 klantenservice voor het geval je ooit hulp nodig hebt. Of je nu je eerste online winkel lanceert of een bestaande winkelpagina uitbreidt, Bluehost biedt een solide basis met betrouwbare prestaties en ingebouwde tools om winkelbeheer tot een fluitje van een cent te maken.

Wil je je richten op het laten groeien van je bedrijf in plaats van je bezig te houden met hosting gedoe? Bluehost’s WooCommerce hosting maakt dat mogelijk.

Laatste gedachten

Met WooCommerce shortcodes kun je productkenmerken en -voordelen benadrukken, snel toegang geven tot informatie, het afrekenproces vereenvoudigen en je bedrijfsdoelen bereiken. Dit aanpassingsniveau is moeilijk te overtreffen.

En met een zeer concurrerend e-commerce landschap is het belangrijk om je bedrijf op een solide basis te bouwen. Hiervoor moet je een betrouwbare webhostingprovider kiezen, zoals Bluehost.

Onze WooCommerce hostingpakketten worden geleverd met tools en functies die het bouwen en beheren van websites vereenvoudigen. Bovendien krijg je toegang tot realtime ondersteuning, zodat je altijd hulp krijgt wanneer je die nodig hebt.

Neem vandaag nog contact met ons op om te ontdekken hoe wij u kunnen helpen uw online winkel te laten groeien.

FAQs