{"id":59905,"date":"2024-07-17T10:15:50","date_gmt":"2024-07-17T08:15:50","guid":{"rendered":"https:\/\/kinsta.com\/nl\/?p=59905&preview=true&preview_id=59905"},"modified":"2024-07-29T12:04:19","modified_gmt":"2024-07-29T10:04:19","slug":"woocommerce-shortcodes","status":"publish","type":"post","link":"https:\/\/kinsta.com\/nl\/blog\/woocommerce-shortcodes\/","title":{"rendered":"Complete gids voor WooCommerce shortcodes"},"content":{"rendered":"

WooCommerce<\/a> is de populairste e-commerce plugin<\/a> voor WordPress, waarmee miljoenen bedrijven hun websites kunnen omtoveren tot prachtige online winkels. Maar veel mensen zijn zich echter niet bewust van de mogelijkheden van de shortcodes<\/a>.<\/p>\n

Deze gids legt alles uit wat je moet weten over WooCommerce shortcodes, van essenti\u00eble shortcodes om producten weer te geven en winkelwagentjes te beheren tot geavanceerde aanpassingen voor een gebruikerservaring op maat.<\/p>\n

Laten we eens kijken hoe deze kleine stukjes code je e-commerce website<\/a> aanzienlijk kunnen be\u00efnvloeden.<\/p>\n

<\/div><\/kinsta-auto-toc>\n

Wat zijn shortcodes?<\/h2>\n

Shortcodes werden ge\u00efntroduceerd in WordPress 2.5 in 2008<\/a>. Het zijn kleine stukjes code tussen vierkante haakjes, zoals deze: [shortcode]<\/code>. Ze fungeren als placeholders die WordPress vertellen om een specifieke functie uit te voeren of bepaalde inhoud dynamisch weer te geven.<\/p>\n

In plaats van bijvoorbeeld handmatig een complex productraster te coderen, kun je een shortcode gebruiken om het direct te maken en weer te geven op je website. Dit bespaart tijd en vermindert de kans op fouten, waardoor het gemakkelijker wordt om je site te onderhouden en bij te werken.<\/p>\n

In de loop der jaren zijn shortcodes steeds krachtiger en veelzijdiger geworden. WooCommerce maakt gebruik van deze functie en biedt een reeks shortcodes die specifiek zijn afgestemd op e-commerce functionaliteit.<\/p>\n

Aan de slag met WooCommerce shortcodes<\/h2>\n

Om WooCommerce shortcodes te gebruiken op je WordPress site, moet je ervoor zorgen dat de WooCommerce plugin<\/a> ge\u00efnstalleerd en geactiveerd is.<\/p>\n

Om dat te doen log je in op je WordPress dashboard, navigeer je naar Plugins<\/strong> > Add new <\/strong>en zoek je naar “WooCommerce” Klik vervolgens op Install now <\/strong>bij de WooCommerce plugin en activeer<\/strong> hem.<\/p>\n

Tot slot kun je de WooCommerce installatiewizard volgen om basisinstellingen te configureren, zoals winkelgegevens, betaalmethoden en verzendopties.<\/p>\n

Wanneer je de WooCommerce plugin installeert, wordt je WordPress site automatisch bijgewerkt met de pagina’s Cart<\/strong>, Checkout <\/b>en My account<\/strong>. Je kunt echter nog veel meer doen met je producten, en dat is wat we zullen onderzoeken met shortcodes.<\/p>\n

De basissyntaxis van shortcodes<\/h3>\n

WooCommerce shortcodes bevatten vaak extra attributen om hun uitvoer aan te passen. Dit is de basisstructuur:<\/p>\n

[shortcode attribute1=\"value1\" attribute2=\"value2\"]<\/code><\/pre>\n
De shortcode [products limit=\"4\" columns=\"2\"]<\/code> geeft bijvoorbeeld vier producten weer in een tweekoloms lay-out.<\/p>\n
Hoe je shortcodes toevoegt aan berichten, pagina’s en widgets<\/h3>\n
Shortcodes kunnen bijna overal in WordPress worden toegevoegd. Je kunt ze toevoegen aan een bericht of pagina door ze eenvoudigweg te typen of te plakken in elke teksteditor<\/a> binnen WordPress of in een shortcodeblok als je Gutenberg<\/a> of een paginabouwer<\/a> gebruikt.<\/p>\n
Laten we voor deze gids Gutenberg gebruiken:<\/p>\n
    \n
  1. Navigeer naar Posts<\/strong> of Pages <\/b>in het WordPress dashboard<\/a>.<\/li>\n
  2. Open het bericht\/pagina waar je de shortcode wilt toevoegen.<\/li>\n
  3. Klik op het +<\/strong> pictogram om een nieuw blok toe te voegen.\n
    \"Stappen
    Stappen om een shortcode toe te voegen met Gutenberg blokken in WordPress.<\/figcaption><\/figure><\/li>\n
  4. Zoek en selecteer het blok Shortcode.<\/li>\n
  5. Plak je shortcode in het blok.<\/li>\n<\/ol>\n
    Laten we bijvoorbeeld zeggen dat je een raster van je nieuwste producten wilt weergeven op je homepage. Met behulp van de blokeditor<\/a> zou je de shortcode: [products limit=\"3\" columns=\"3\"]<\/code> invoeren en je pagina bijwerken<\/strong> of publiceren<\/strong>.<\/p>\n
    Dit maakt een raster met drie producten in \u00e9\u00e9n kolom, een dynamische en aantrekkelijke manier om je nieuwste producten te laten zien.<\/p>\n
    \"Een
    Een productraster weergeven met een shortcode in de blokeditor van WordPress.<\/figcaption><\/figure>\n
    Je kunt ook shortcodes toevoegen aan widgets<\/a> door te navigeren naar Appearance <\/b>> Widgets<\/strong>. Voeg een Text <\/b>widget toe aan je gewenste widgetgebied (zijbalk, footer, enz.). Voer je shortcode in het tekstvak binnen de widget in en sla de widget op.<\/p>\n
    Essenti\u00eble WooCommerce shortcodes<\/h2>\n
    WooCommerce biedt een verscheidenheid aan shortcodes waarmee je producten kunt weergeven, de winkelwagen<\/a> kunt beheren en het afrekenproces kunt verbeteren.<\/p>\n
    Laten we eens kijken naar de meest essenti\u00eble WooCommerce shortcodes, hun attributen en gedetailleerde voorbeelden om je te helpen ze effectief te gebruiken in je winkel.<\/p>\n
    Shortcodes die producten weergeven<\/h3>\n
    De shortcode [products]<\/code> is een van de meest veelzijdige WooCommerce shortcodes. Hiermee kun je een lijst met producten weergeven op basis van verschillende criteria.<\/p>\n
    Het heeft zo veel attributen waarmee je producten kunt weergeven zoals jij dat wilt:<\/p>\n