Hoe voeg ik een Instagram feed toe aan mijn Mijnwebwinkel webshop?

Mijnwebwinkel laat je geen HTML-code op een pagina plakken. Je plaatst de widget daarom met Google Tag Manager. Een tag in Google Tag Manager vervangt een korte tekst op je pagina, [instagram-feed], door je widget. Dezelfde stappen werken voor Facebook-, X-, TikTok- en YouTube-widgets.

​

In SnapWidget

1. Maak je widget, of open een bestaande widget op je dashboard.
2. Klik op Get Widget. Klik bij een bestaande widget op Update & Get Widget.
3. Klik in het venster You’re One Step Away op Copy To Clipboard.

​

Koppel Google Tag Manager aan je webshop

1. Ga naar Google Tag Manager en log in met je Google-account. Maak een account en een container aan. Kies als doelplatform Web. De code die Google toont, hoef je niet te plaatsen. Mijnwebwinkel doet dat voor je.
2. Ga in je beheeromgeving naar Marketing > Google-services en open het tabblad Google Tag Manager.
3. Klik op Maak verbinding met Google en kies je Google-account.
4. Zet Gebruik Google Tag Manager aan, kies je container en klik op Opslaan.

​

Maak de tag in Google Tag Manager

1. Open in Google Tag Manager de container die je aan je webshop hebt gekoppeld. Klik op Tags en daarna op Nieuw.
2. Geef de tag een naam, bijvoorbeeld “SnapWidget”. Klik op Tagconfiguratie en kies Aangepaste HTML.
3. Plak deze code in het HTML-veld:
   <script src="https://snapwidget.com/js/snapwidget.js"></script>
   <script>
     var iframe = 'PLAK-HIER-JE-IFRAME';
     var elements = document.getElementsByTagName("p");
     [].forEach.call(elements, function (element) {
       if (element.textContent === "[instagram-feed]") {
         var iframeDiv = document.createElement("div");
         iframeDiv.innerHTML = iframe;
         element.parentNode.replaceChild(iframeDiv, element);
       }
     });
   </script>
   
4. Zoek in de SnapWidget-code die je hebt gekopieerd de regel die begint met <iframe en eindigt met </iframe>. Kopieer alleen die regel. Vervang in het HTML-veld PLAK-HIER-JE-IFRAME door die regel. Laat de enkele aanhalingstekens eromheen staan. De iframe-code moet op één regel blijven en mag geen enkel aanhalingsteken (') bevatten.
5. Gebruikt je widget Lightbox of Shoppable (Lightbox) als Photo Link? Dan heeft je SnapWidget-code twee extra regels: één met snapwidget-lightbox.css en één met snapwidget-lightbox.js. Kopieer beide regels en plak ze bovenaan in het HTML-veld.
6. Klik op Opslaan. Google Tag Manager meldt dat de tag geen trigger heeft. Klik op Trigger toevoegen en kies Alle pagina’s.
7. Klik op Opslaan. Klik daarna op Verzenden en Publiceren.

​

Plaats de widget op je webshoppagina

1. Ga in je beheeromgeving naar Inhoud > Pagina’s en open de pagina waar de widget moet komen.
2. Typ in de tekst van de pagina [instagram-feed] op een eigen regel. Maak de tekst niet dikgedrukt. Sluit de regel af met Enter, niet met Shift+Enter.
3. Klik op Opslaan.

Wil je een tweede widget plaatsen? Maak dan een tweede tag met een eigen tekst, bijvoorbeeld [instagram-grid]. Gebruik die tekst in de if-regel van de tag en op je pagina.

​

Controleer je widget

Open de pagina in je webshop. De widget staat op de plek van [instagram-feed]. Zie je nog de oude pagina? Open de pagina dan in een privévenster of leeg de cache van je browser.