> ## Knowledge Base Index > Fetch the complete knowledge base index at: https://help.hoppyapps.com/sitemap.xml > Use this file to discover available pages before exploring further. > Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash). # πŸš€ Hoe te installeren Koop One Get One (BOGO) > ℹ️ **Note:** Dit artikel is automatisch vertaald met behulp van AI en kan onjuistheden bevatten. Als er iets mis is, neem dan contact op met ons ondersteuningsteam. Wilt u een klassieker te draaien 🎁 Dat is precies wat de **BONGO (Koop er eentje)** aanbieding in Hoppy Bundles is ontworpen voor. Met deze aanbieding type, kunt u deals zoals: * πŸ›’ Koop 1 β†’ Standaard Prijs * πŸŽ‰ Koop 2 β†’ Ontvang 1 gratis * πŸ”₯ Koop 3 β†’ Ontvang 1 Gratis En toon ze als een nette, klikbare widget direct op uw product pagina. Klanten gewoon kiezen de deal die ze willen, en de gratis item korting wordt automatisch toegepast bij de kassa ✨ ℹ️ BGO gebruikt hetzelfde instellingenscherm als een **Hoeveelheid breuk** bieden **Ja! Het is BOGO** template, zodat je nooit begint vanaf een lege pagina. --- # **πŸ“ Waar de BOGO Widget verschijnt** De BOGO widget verschijnt op uw **Productpagina**, recht onder de knop Toevoegen aan winkelwagen (standaard plaatsing). U kunt het ook overal anders op de product pagina met behulp van de **Aangepaste plaatsing** optie (die later in deze gids wordt behandeld). ℹ️ Het gratis item wordt toegevoegd en gereduceerd **automatisch bij de kassa** Klanten hoeven het gratis item niet toe te voegen aan de winkelwagen zelf of een kortingscode in te voeren. --- # **πŸ› οΈ Voorbeeldinstellingen gebruikt in deze documentatie** In deze documentatie configureren we de volgende BOGO structuur (dit is precies wat Hoppy Bundles voorvullingen voor u: * πŸ›’ 1 paar β†’ Standaardprijs (geen korting) * πŸŽ‰ Koop 2 Ontvang 1 β†’ het 3e item is gratis * πŸ”₯ Koop 3 Ontvang 1 β†’ het 4e item is gratis Het aanbod zal worden toegepast op **specifieke producten** en weergegeven met behulp van de voorgeselecteerde **Ja! Het is BOGO** template. Deze handleiding legt elke instelling uit die u aanraakt tijdens de setup, zodat u precies weet hoe elke optie zich gedraagt βš™οΈ --- # **βœ… Voordat u begint met het inschakelen van de App Embed** Om het BOGO-widget op uw storefront te laten verschijnen, moet de app-embed ingeschakeld zijn in uw Shopify thema. Ga naar: **Shopify Admin β†’ Verkoopkanalen β†’ Online Store β†’ Thema's β†’ Aanpassen β†’ App Inbedden** Dan: * Zoeken **Bundels-app insluiten** * Schakel het IN * Klik op Opslaan ⚠️ **Belangrijk**: Zonder de app embed ingeschakeld, zal uw gepubliceerde aanbod niet zichtbaar zijn op de storefront . Zelfs als alles in de app correct is geconfigureerd. --- # **🎯 Stap 1 Maak een nieuwe BOGO aanbieding** Open de **Hoppy Bundles** app van uw Shopify Admin. Dan: β†’ Klik **Nieuwe aanbieding aanmaken** om de selectiepagina van het aanbodtype te openen. β†’ Zoek de **BONGO (Koop er eentje)** kaart _Koop het ene product en krijg een ander gratis of korting._ En klik **Een BOGO-aanbieding aanmaken**. πŸ’‘ Wilt de klant om een vaste hoeveelheid te kopen en een **verschillend product** Met korting? De **X Y kopen** kaart direct ernaast opent dezelfde setup met inches voorgevulde voor die flow (bijv. Koop 2 Koop 3 Get). --- # **🧩 Stap 2** Het eerste scherm vraagt om de basis voor iets anders. --- ## **🏷️ Aanbodnaam** Dit veld wordt uitsluitend voor interne doeleinden gebruikt. Klanten zullen deze naam nooit zien. U kunt elke herkenbare naam gebruiken, zoals: * Zomer BOGO Verkoop * T-Shirt Koop 2 Ontvang 1 * Zwarte vrijdag BOGO πŸ’‘ Met behulp van de juiste interne naamgeving maakt het gemakkelijker om setups later te identificeren, vooral als uw winkel draait meerdere aanbiedingen. --- ## **πŸ“¦ Aanbieding toepassen op** Deze setting bepaalt op welke producten de BOGO deal van toepassing is. Er zijn 3 opties beschikbaar: * **Alle producten** β†’ de aanbieding geldt voor elk product in uw winkel * **Product** β†’ de aanbieding is alleen van toepassing op de producten die u kiest * **Verzameling** β†’ de aanbieding geldt voor elk product binnen de collecties die u selecteert Als u kiest **Product** of **Verzameling**, a **Selecteer product** ' **Verzameling selecteren** De knop verschijnt. Klik erop om uw Shopify resource picker en kies een of meer items. ⚠️ **Belangrijk**Alleen: **één gepubliceerd aanbod** is toegestaan per product of verzameling. Als een ander gepubliceerd aanbod al betrekking heeft op hetzelfde product, moet u converteren naar een concept voordat het publiceren van deze. --- # **🎨 Stap 3 Kies een sjabloon** Vervolgens zie je de **Selecteer uw voorkeursaanbod** sectie met een rij kant-en-klare widget templates. Omdat je begon met de BOGO kaart, de **Ja! Het is BOGO** template (het violette πŸ’œ) is al voorgeselecteerd voor u U kunt ook een ander startpunt kiezen: * **Bundelen & opslaan** β†’ bouw er een vanaf nul * **Beperkte tijd aanbod** β†’ Oranje-thema niveaus * **Flash Sale Madness!** β†’ roze thema niveau * **Ja! Het is BOGO** β†’ Violetthema BOGO-niveaus (voorgeselecteerd) Zodra u tevreden bent met de selectie, klik **Geselecteerd sjabloon toepassen**. ⚠️ De application knop blijft uitgeschakeld totdat u ten minste één product of verzameling hebt geselecteerd (wanneer **Aanbieding toepassen op** is ingesteld op **Product** of **Verzameling**). Na het aanmelden opent de volledige editor met een **live preview** rechts **bureaublad** en **mobiel** Die updates direct als u instellingen wijzigt ✨ --- # **βš™οΈ Stap 4** Dit is waar je BOGO deal daadwerkelijk vorm krijgt. Je zult zien dat je inkepingen als tabbladen **Aanbod 1**, **Aanbod 2**, **Aanbieding 3** Elk een klikbare deal op de storefront widget. --- ## **✏️ Aanbieding van naam en geselecteerde aanbod** Bovenaan het tabblad Algemeen, een kleine samenvatting kaart toont uw **Aanbodnaam** (klik op de ✏️ pictogram om het te hernoemen) en uw **Geselecteerd aanbod** template. --- ## **πŸ“ Sjabloonindeling** Kies hoe de lagen worden weergegeven: * **Verticaal** β†’ niveaus op elkaar gestapeld (standaard) * **Horizontaal** β†’ niveaus naast elkaar Met de **Verticaal** lay-out, krijg je ook een **Kies een thema** optie met snelle kleurinstellingen (blauw, rood, groen). --- ## **🎁 Bewerken Aanbod Aanbod** Elk tabblad heeft zijn eigen instellingen. Hier is wat elk doet voor een BOGO setup: ### **πŸ’Έ Kortingstype** Deze dropdown is het hart van je niveau. De BOGO-relevante opties zijn: * **Geen korting** β†’ de items worden verkocht tegen standaardprijs (perfect voor uw basisniveau van 1 paar) * **BONGO (Koop er eentje)** β†’ koop de tier hoeveelheid, krijg extra item(s) van de **hetzelfde product** vrij * **X kopen Y vrij krijgen** β†’ koop de tier hoeveelheid, krijg een **verschillend product** Vrij De andere soorten kortingen (**Korting**, **Platte korting**, **Op elke eenheid platte korting**, **Specifieke prijs**) ook hier werken als je ooit wilt een gemengde widget ### **πŸ”’ Hoeveelheid + Kopen / Krijgen** De **Hoeveelheid** veld bepaalt hoeveel items de klant toevoegt wanneer ze dit niveau kiezen en voor BOGO-oplagen, het stelt ook de **Kopen** bedrag automatisch. * Met **BONGO (Koop er eentje)** geselecteerd, zult u zien **Kopen** en **Get** dozen in plaats van een kortingswaarde. Beide zijn alleen-lezen: **Kopen** altijd overeenkomt met de tier hoeveelheid, en **Get** is vastgesteld op **1 gratis item**. * Met **X kopen Y vrij krijgen** geselecteerd, **Kopen** volgt de tier hoeveelheid, maar **Get** is **bewerkbaar** Zodat u kunt bieden aan Koop 2, Krijg 3 πŸ’‘ Wil een klassieker **Koop 1 Ontvang 1 Gratis**β™ͺ Just set a tier **Kortingstype** tot **BONGO (Koop er eentje)** en zijn **Hoeveelheid** tot **1** Klaar. ### **🎁 Product ophalen (Koop X Alleen Y vrij krijgen)** Wanneer een tier gebruikt **X kopen Y vrij krijgen**, een extra **Product ophalen** sectie verschijnt. Klik **Y-product selecteren** om de resource picker te openen en het gratis product te kiezen dat uw klant ontvangt. ℹ️ Dit is hoe je doet Met de vlakte **BONGO (Koop er eentje)** type, het gratis item is altijd meer van de **hetzelfde product**, dus geen Y product nodig is. ### **🏷️ Aanbieding titel, korting label & tag** * **Aanbodtitel** β†’ de hoofdtekst van het niveau, bijvoorbeeld _Koop 2 Ontvang 1_ * **Kortingslabel** β†’ de spaartekst op het niveau, bv. _Koop 2 krijgen 1_ Klik op de πŸ‘οΈ pictogram om het te verbergen * **Tag** β†’ een kleine markeerbadge, bijvoorbeeld _Meest populair_ Ook te verbergen met de πŸ‘οΈ pictogram πŸ’‘ De voorgevulde inkepingen al zeggen ### **🎁 Gratis cadeau (facultatief)** Tik de **Gratis geschenk** vinkje op elke laag, klik dan op **Producten selecteren** om extra gratis cadeauproducten aan dat niveau te bevestigen op de top van het BOGO gratis product zelf. ### **βž• Toevoegen / πŸ—‘οΈ Niveaus verwijderen** * Klik **Aanbieding toevoegen** om nog een niveau toe te voegen (maximum **6** Niveaus) * Klik **Verwijderen** het huidige niveau verwijderen (tenminste **2** Niveaus zijn vereist) --- ## **πŸ“° Titel & voettekst blokkeren** * **Bloktitel** β†’ de kop boven het widget. Voorgevulde **Bogo Aanbieding** Verander het in alles wat je wilt, of verberg het met de πŸ‘οΈ pictogram * **Voettekst** β†’ een kleine regel onder de niveaus (standaard: _Gratis verzending_), ook te verbergen --- # **πŸ› οΈ Stap 5: Instellingen instellen** Nog steeds op de **Algemeen** de **Instellingen** kaart bepaalt hoe het widget zich gedraagt. ## **πŸ‘€ Uiterlijk en uiterlijk** * **Eenheidsprijs tonen** β†’ toont de per-item prijs binnen elke tier * **Totale prijs tonen** β†’ toon het niveau van de totale prijs * **Header en voetteksten verbergen** β†’ verwijdert de widget * **Gebruik aangepaste tekst voor niet op voorraad** β†’ toont uw eigen bericht wanneer het product uit voorraad is (een tekstveld verschijnt hieronder indien ingeschakeld) ## **βš™οΈ Functioneren** * **Laat klanten verschillende varianten kiezen voor elk item** β†’ handig voor BOGO kopen bijvoorbeeld 2 shirts, kies een andere maat / kleur voor elk, en nog steeds krijgen de gratis * **Display widget hieronder Toevoegen aan winkelwagenknop** β†’ houdt het widget verankerd onder de knop Toevoegen aan winkelwagen * **Skip winkelwagen direct naar kassa** β†’ stuurt klanten direct naar de kassa wanneer ze een tier kiezen * **Volumekorting (Extend Max Korting tot alle hoeveelheden)** β†’ laat klanten kopen extra items buiten de hoogste tier tegen dezelfde maximale disconteringsvoet * **Vergelijken met prijs** β†’ toont de doorgeslagen door vergelijking-tegen prijs; laat het onthult **Aangepaste prijs vergelijken** en **Shopify productvergelijking prijs** velden ## **πŸ”„ Kortingscombinatie inschakelen** * **Bestel kortingen** β†’ laat dit aanbod te combineren met order-niveau kortingen * **Verzendkortingen** β†’ laat het combineren met verzendkortingen ℹ️ Product kortingen altijd combineren. Vanwege Shopify beperkingen, deze combinatie instelling is wereldwijd van toepassing op alle nieuwe quantity-break-based aanbiedingen (inclusief BOGO). ## **🌍 Meerdere markten en vertalingen** Verderop vind je **Meerdere markten** (verschillende niveaus per markt) en **Vertaling** (Widget tekst in uw webwinkel ... andere talen). Beide zijn optioneel en bedekt met hun eigen speciale gidsen. --- # **🎯 Stap 6: Targeting & Placement (facultatief)** De **Targeting en plaatsing** tabblad bepaalt waar en aan wie het aanbod wordt weergegeven. ## **πŸ“ Plaatsing** * **Hieronder Toevoegen aan winkelwagenknop (Standaard)** β†’ geen extra werk nodig * **Aangepast (alleen op de productpagina)** β†’ na het opslaan, krijg je **Hoppy bundles ID** en een kopieerbaar **code knipsel** om overal te vallen in uw thema ## **πŸ‘€ Klantgericht & 🌍 Geolocatiegericht** * Het aanbod tonen of verbergen op basis van **aanmeldstatus, klanttags of totaal uitgegeven bedrag** * Beperk het aanbod tot **specifieke landen** (standaard: **Alle wereld**) Er is ook een **Planning** sectie om een **start** en **einde** datum/tijd voor de aanbieding ℹ️ Deze zijn allemaal optioneel. Als je ze overslaat, toont het aanbod gewoon aan iedereen, overal, meteen. Geavanceerde targeting wordt in detail behandeld in zijn eigen speciale gids. --- # **🎨 Ontwerptabblad (facultatief)** De **Ontwerp** tabblad regelt de visuele styling van het widget: * **Typografie en kleur** β†’ lettertype familie, tekst maten, gewichten en kleuren voor elk element * **Variant** β†’ kleine / middelgrote / grote grootte voor variant selectoren * **Rand** β†’ Randbreedte en hoekstraal schuifregelaars πŸ’‘ Elke verandering reflecteert direct in de live preview aan de rechterkant **bureaublad** en **mobiel** voorbeeldpanelen. ℹ️ Voorgeselecteerde **Ja! Het is BOGO** template ziet er al geweldig uit uit, dus deze stap is volledig optioneel. Styling is diep in de dedicated design guide. --- # **βœ… Laatste stap Opslaan & Publiceren** Zodra alles er goed uitziet in de preview: 1. Klik **Opslaan** in de opbergbalk bovenaan de pagina 2. Klik **Publiceren** om het aanbod live te maken ⚠️ **Let op**: * De **Publiceren** de knop is uitgeschakeld terwijl de aanbieding is gloednieuw **eerst opslaan**, dan publiceren. * Publishing creΓ«ert een **automatische korting** in uw **Shopify Beheerder β†’ Kortingen**. Dit is wat daadwerkelijk van toepassing is op de gratis items bij kassa * Als de app embed niet is ingeschakeld in uw thema, zal een banner verschijnen na het opslaan met een **App invoegen inschakelen** snelkoppelingsknop * Als publicatie mislukt omdat een ander gepubliceerd aanbod al hetzelfde product of dezelfde collectie dekt, zet dat bestaande aanbod dan eerst om in een ontwerp, dan opnieuw publiceren. Uw BOGO aanbod is nu live πŸš€ --- # **πŸŽ‰ Eindresultaat** Eenmaal succesvol geconfigureerd: βœ… Klanten zien uw BOGO niveaus direct op de productpagina βœ… Gratis items worden toegevoegd en korting automatisch bij de kassa βœ… Niveaus, tags en labels worden direct bijgewerkt vanuit de app βœ… Het widget komt overeen met uw thema met de sjabloon en kleuren die u hebt gekozen Hier vindt u hoe de voltooide widget eruit ziet op de storefront ✨ --- πŸ’‘ Wilt u dat het gratis item een **verschillend product** In plaats van meer van hetzelfde? Bewerk een niveau, schakel zijn **Kortingstype** tot **X kopen Y vrij krijgen**en kies uw gratis product met **Y-product selecteren** Je hoeft niet opnieuw te beginnen.