Websites & Trechters: Instagram-feed toevoegen aan je pagina

Met de Instagram-feedwidget voeg je een live Instagram-feed toe aan een trechter (funnel), website of webwinkelpagina. Kies een Instagram-bedrijfsaccount of makersaccount dat al gekoppeld is in Social Planner, selecteer een basisindeling en pas aan hoe je berichten op verschillende apparaten verschijnen.

In dit artikel lees je hoe je de Instagram-feed toevoegt, vormgeeft, bekijkt en publiceert. Je hebt daarvoor geen externe insluittools of eigen code nodig.

Wat is de Instagram-feedwidget?

De Instagram-feedwidget is een ingebouwd element in de paginabouwer van Voluit Suite. Hiermee toon je berichten van een gekoppeld Instagram-account op trechters, websites en webwinkelpagina’s.

Voeg de widget toe via Social Widgets (Sociale widgets), kies een sjabloon en selecteer een Instagram-account dat gekoppeld is in Social Planner. Daarna pas je de feed aan je pagina aan.

Voordelen van de Instagram-feedwidget

Met de Instagram-feedwidget toon je actuele Instagram-content en bepaal je zelf hoe de feed eruitziet en werkt.

• Vijf basissjablonen: begin met een vooraf ingestelde indeling en pas die daarna aan.
• Raster of schuifweergave: wissel op elk moment tussen de beschikbare indelingen.
• Instellingen per apparaat: stel kolommen, rijen en tussenruimte in voor desktop, tablet en mobiel.
• Aanpasbare berichtweergave: kies het berichttype, de tegelstijl, de uitsnede en de details die je wilt tonen.
• Ingebouwd weergavevenster: laat bezoekers ondersteunde berichten, carrousels en video’s bekijken zonder de pagina te verlaten.
• Eigen vormgeving: kies een licht of donker kleurenschema en pas de beschikbare kleuren aan.

Voorwaarden en beperkingen

Koppel een ondersteund Instagram-account voordat je de widget toevoegt. De widget haalt de content op via Social Planner.

• Gebruik een Instagram-bedrijfsaccount of makersaccount dat gekoppeld is in Social Planner.
• Persoonlijke Instagram-accounts worden niet ondersteund.
• Hoe ver de feed teruggaat, hangt af van de content die Instagram via de API beschikbaar stelt.
• Berichten worden stapsgewijs geladen, met maximaal 50 berichten per aanvraag.
• Extra berichten kunnen worden geladen via Load More (Meer laden) of via de navigatie van de schuifweergave, als de gekozen indeling dit ondersteunt.

De Instagram-feedwidget instellen

Voeg de Instagram-feed toe vanuit de paginabouwer, kies een basissjabloon en selecteer het Instagram-account dat je wilt tonen.

Stap 1: open de paginabouwer

Open vanuit je account de pagina die je wilt bewerken:

• Trechter (funnel): ga naar Sites → Trechters, open de trechter en selecteer de betreffende stap.
• Website: ga naar Sites → Websites, open de website en selecteer de betreffende pagina.
• Webwinkel: ga naar Sites → Stores (Sites → Webwinkels), open de webwinkel en selecteer de betreffende pagina.

Stap 2: voeg de Instagram-feed toe

1. Open het elementenpaneel.
2. Selecteer Social Widgets (Sociale widgets).
3. Selecteer Instagram Feed (Instagram-feed).
4. Sleep de widget naar de pagina.
5. Kies een basissjabloon.

Je kunt kiezen uit de volgende sjablonen:

• Profile widget (Profielwidget): een profielkop met een raster van berichten.
• Grid (Raster): alleen een raster van berichten.
• Small widget (Kleine widget): een compacte indeling van 2 × 2.
• Post slider (Schuifweergave van berichten): een horizontale carrousel.
• Dark profile widget (Donkere profielwidget): een profielindeling met een donker kleurenschema.

Na het toevoegen kun je elk sjabloon aanpassen.

Stap 3: selecteer een Instagram-account

1. Selecteer de Instagram-feedwidget.
2. Kies een Instagram-account dat al gekoppeld is in Social Planner.
3. Controleer of de beschikbare berichten verschijnen.
4. Gebruik de tabbladen General (Algemeen), Styles (Stijlen) en Post (Bericht) om de widget aan te passen.
5. Sla de pagina op en bekijk het voorbeeld.
6. Publiceer de pagina zodra deze klaar is.

De indeling van de feed aanpassen

Met de indelingsinstellingen bepaal je hoe berichten op desktop, tablet en mobiel worden weergegeven.

Je kunt:

• Wisselen tussen Grid (Raster) en Slider (Schuifweergave).
• Het aantal kolommen automatisch laten bepalen of zelf 1–10 kolommen instellen.
• 1–5 rijen instellen.
• De tussenruimte tussen berichten instellen op 0–50 px.
• Kolommen, rijen en tussenruimte afzonderlijk instellen per apparaat.
• Op mobiel maximaal 3 kolommen gebruiken.
• Een feedtitel van maximaal 200 tekens toevoegen.

De tabletweergave gebruikt in eerste instantie de mobiele instellingen. Zodra je een instelling specifiek voor tablet aanpast, kun je tablet en mobiel onafhankelijk van elkaar instellen.

De weergave van je profiel en berichten aanpassen

Bepaal welke profielinformatie en berichtdetails bezoekers zien.

Profielkop

Toon of verberg de volledige profielkop of afzonderlijke ondersteunde onderdelen:

• Profielfoto
• Weergavenaam
• @gebruikersnaam
• Aantal berichten
• Aantal volgers
• Aantal accounts dat je volgt
• Volgknop

Berichten

Kies welke berichten je wilt tonen:

• Alle ondersteunde berichten
• Alleen foto’s
• Alleen video’s

Kies een tegelstijl:

• Classic (Klassiek): een afbeelding met een extra laag die verschijnt wanneer je er met de muis overheen beweegt.
• Card (Kaart): een afbeelding met een tekstblok voor het bijschrift.

Kies een uitsnede:

• Square (Vierkant), 1:1
• Portrait (Staand), 4:5

Afhankelijk van de gekozen tegelstijl kun je ondersteunde details tonen, zoals de auteur, datum, Instagram-link, vind-ik-leuks, reacties en het bijschrift.

Instellingen voor de schuifweergave

Bij een schuifweergave kun je het volgende instellen:

• Navigatiepijlen
• Slepen en vegen
• Animatiesnelheid van 0,1–2,0 seconden
• Automatisch afspelen: uitgeschakeld of elke 3–30 seconden

Instellen wat er gebeurt bij een klik op een bericht

Kies wat er gebeurt wanneer een bezoeker een bericht selecteert:

• Het ingebouwde weergavevenster openen.
• Het bericht op Instagram openen.
• Geen actie uitvoeren.

Het ingebouwde weergavevenster ondersteunt carrouselberichten, het afspelen van video’s en toetsenbordnavigatie. Bezoekers kunnen met de pijltjestoetsen door berichten navigeren en met Escape het venster sluiten.

Je bepaalt ook welke ondersteunde details in het weergavevenster verschijnen:

• Auteur
• Volgknop
• Instagram-link
• Vind-ik-leuks
• Bijschrift
• Reacties
• Datum

Kleuren en zichtbaarheid aanpassen

Stem de Instagram-feed af op de vormgeving van je pagina en bepaal op welke apparaten de widget zichtbaar is.

Begin met een kleurenschema Light (Licht) of Dark (Donker). Pas daarna de beschikbare kleuren aan voor:

• De kop
• Berichten
• Navigatiepijlen van de schuifweergave
• Het pop-upvenster
• Load More (Meer laden)

Je kunt ook:

• Een eigen CSS-klasse toevoegen aan de widget.
• De zichtbaarheid per apparaat instellen.
• De widget controleren in de desktop-, tablet- en mobiele weergave.

Een Instagram-account opnieuw koppelen

De Instagram-feed heeft een actieve koppeling met Social Planner nodig om actuele content op te halen.

Als de Instagram-koppeling verloopt, toont de widget de melding Disconnected (Niet verbonden) en de knop Reconnect account (Account opnieuw koppelen).

Als Instagram of Social Planner tijdelijk niet beschikbaar is, kan de gepubliceerde widget eerder opgeslagen content tonen. Is er geen opgeslagen content beschikbaar? Dan wordt de widget verborgen in plaats van een foutmelding op de pagina te tonen.

Veelgestelde vragen

V: Welke Instagram-accounts kan ik gebruiken?

Antwoord: Gebruik een Instagram-bedrijfsaccount of makersaccount dat gekoppeld is in Social Planner. Persoonlijke Instagram-accounts worden niet ondersteund.

V: Heb ik een externe dienst nodig om mijn Instagram-feed te tonen?

Antwoord: Nee. De Instagram-feedwidget is ingebouwd in de paginabouwer. Je hebt geen aparte insluitdienst of eigen code nodig.

V: Kan ik de widget gebruiken op webwinkelpagina’s?

Antwoord: Ja. Je kunt de widget gebruiken op trechters, websites en webwinkelpagina’s.

V: Kan ik de feed anders instellen voor mobiel?

Antwoord: Ja. De widget ondersteunt indelingsinstellingen per apparaat. Op mobiel kun je maximaal drie kolommen gebruiken.

V: Wat gebeurt er als mijn Instagram-koppeling verloopt?

Antwoord: De widget toont de melding Disconnected (Niet verbonden) en de knop Reconnect account (Account opnieuw koppelen).

V: Wat gebeurt er als Instagram tijdelijk niet beschikbaar is?

Antwoord: Eerder opgeslagen content kan zichtbaar blijven. Als er geen opgeslagen content beschikbaar is, wordt de widget verborgen in plaats van een foutmelding te tonen.

V: Hoeveel Instagram-berichten kan de widget laden?

Antwoord: Berichten worden stapsgewijs geladen, met maximaal 50 berichten per aanvraag. Hoe ver de feed teruggaat, hangt af van de content die Instagram voor het gekoppelde account beschikbaar stelt.