๐ Hoe Bundels Aanbieding instellen voor aangepaste plaatsing
โน๏ธ 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.
Wil uw bundel aanbod te verschijnen precies waar u wilt dat het op uw product pagina ๐ฏ
Dat is precies wat de Aangepaste plaatsing optie in Hoppy Bundles is ontworpen voor.
Standaard wordt elke bundelaanbieding getoond onder de knop Toevoegen aan winkelwagen automatisch. Maar met Custom Placement, kunt u het aanbod overal op uw productpagina met behulp van:
- ๐งฉ De Hoppy Bundel-appblok binnen de Shopify thema-editor (geen codering nodig!)
- ๐ Een klein code knipsel geplakt in uw thema code of een aangepaste vloeibare sectie
Deze gids begeleidt u stap voor stap door beide methoden โจ
๐ค Wanneer moet u aangepaste plaatsing gebruiken?
Aangepaste plaatsing is handig wanneer u wilt:
- Het bundelaanbod tonen boven de knop Toevoegen aan winkelwagen
- Plaats het aanbod naast de productbeschrijving, afbeeldingen of beoordelingen
- Verplaats de aanbieding lager op de pagina
- Heb volledige controle over de exacte positie binnen uw thema-indeling
โน๏ธ Aangepaste plaatsing alleen op de productpagina. Andere pagina's worden niet beรฏnvloed door deze instelling.
โ Voordat u begint
Voordat u een aangepaste plaatsing opzet, zorg ervoor dat u:
- โ De Hoppy Bundles app geรฏnstalleerd op uw winkel
- โ A Bundelaanbieding reeds aangemaakt (of een nieuwe gemaakt)
- โ De App ingebed ingeschakeld in uw thema (zie de volgende stap)
๐ก Dezelfde stappen werken ook voor Hoeveelheid breuk biedt de sectie Plaatsing kijkt en gedraagt precies hetzelfde.
โ๏ธ Initiรซle stap inschakelen van de app Embed
Voor de bundel aanbieding te verschijnen overal op uw storefront, de app embed moet worden ingeschakeld in uw Shopify thema.
Ga naar:
Shopify Admin โ Verkoopkanalen โ Online Store โ Thema's โ Aanpassen โ App Inbedden
Dan:
- Zoeken Bulk korting aanbod ( Hoppy Bundles inbedden)
- Schakel het IN
- Klik Opslaan
โ ๏ธ Zonder de app embed ingeschakeld, noch de standaard plaatsing noch de aangepaste plaatsing zal renderen op uw storefront.
๐ ๏ธ Stap 1 Selecteer aangepaste plaats in uw aanbod
Open de Hoppy Bundles app en open de bundel aanbieding die u handmatig wilt plaatsen.
Dan:
- Ga naar de Targeting en plaatsing tab
- Scroll naar beneden naar de Plaatsing sectie
- Selecteer in de dropdown Aangepast (alleen op de productpagina) in plaats van Hieronder Toevoegen aan winkelwagenknop (Standaard)
๐พ Stap 2 Sla het aanbod eerst op
Deze stap is belangrijk. โ ๏ธ
De Hoppy bundles ID en de code knipsel worden alleen gegenereerd nadat het aanbod is opgeslagen.
Als u selecteert Aangepast plaatsing op een gloednieuw (onopgeslagen) aanbod, zie je dit bericht in plaats daarvan:
Opslaan om te zien Hoppy bundles ID en code knipsel
Dus:
- Klik Opslaan bovenaan de pagina
- Terug naar Targeting en plaatsing โ Plaatsing
Je zult nu twee dingen zien. ๐
๐ Stap 3 Kopieer uw Hoppy bundles ID & Code Snippet
Eenmaal opgeslagen, toont de sectie Plaatsing:
- Hoppy bundles ID โ een unieke ID voor deze specifieke aanbieding, met een kopie pictogram ernaast
- Hoppy bundles code knipsel โ een kant-en-klare HTML knipsel, ook met een kopieerpictogram:
โน๏ธ Elk aanbod heeft zijn eigen unieke ID. Als u meerdere bundelaanbiedingen maakt, zorg er dan voor dat u het ID/snippet van de juiste kopieert.
U kunt nu het aanbod plaatsen met behulp van hetzij van de twee onderstaande methoden ๐
๐งฉ Methode 1
Dit is de makkelijkste methode ๐
De Hoppy bundles app blok kan worden toegevoegd, verwijderd, herpositioneerd en aangepast via de thema-editor met behulp van uw Bundle ID.
Volg deze stappen:
- Ga naar Shopify Beheerder โ Online Store โ Thema's โ Thema bewerken
- Bovenaan de thema-editor, schakel de pagina-selector naar Producten โ Standaard product (of het productsjabloon dat u gebruikt)
- Klik in de linker zijbalk Blok toevoegen binnen de sectie Product
- Onder de Apps tab, selecteer Hoppy Bundel
- Plak in de blokinstellingen Bundel-ID in de Bundel-ID veld
- Sleep het blok omhoog of omlaag om het precies te positioneren waar u wilt dat het aanbod verschijnt
- Klik Opslaan
โ ๏ธ Als je het Bundle ID veld leeg laat, zal het blok een Configureer het ID om App Block te gebruiken waarschuwing in plaats van uw aanbod
๐ก U kunt het blok op elk moment herpositioneren door het eenvoudigweg in de thema-editor te slepen.De aanbieding volgt de blokpositie op de pagina.
๐ Methode 2 Plaats de aanbieding met behulp van de Code Snippet
Gebruik deze methode als u het aanbod wilt plaatsen in een specifieke plek in uw thema code, of in een Aangepast vloeibaar sectie/blok.
Optie A
- Ga naar Shopify Admin โ Online Store โ Thema's โ Aanpassen
- Schakel over naar uw Productsjabloon
- Klik Blok toevoegen (of Sectie toevoegen) โ kiezen Aangepast vloeibaar
- Plak de code uit stap 3:
- Plaats het blok waar u wilt dat het aanbod verschijnt
- Klik Opslaan
Optie B Direct in uw themacode
- Ga naar Shopify Admin โ Online Store โ Thema's โ (drie punten) โ Code bewerken
- Open uw product sjabloon bestand meestal iets als
product.liquid,main-product.liquid, of een product JSON/sectie bestand (het exacte bestand hangt af van uw thema) - Plak het knipsel precies waar u wilt dat de bundel aanbod te renderen:
- Klik Opslaan
โ ๏ธ Het bewerken van themacode direct kan breken uw lay-out als verkeerd gedaan. Als u niet comfortabel het bewerken van code, gebruik Methode 1 of Optie A in plaats daarvan
๐ Belangrijke opmerkingen & waarschuwingen
- โ ๏ธ Eerst redden! De Bundle ID en knipsel verschijnen pas nadat het aanbod ten minste eenmaal is opgeslagen.
- โ ๏ธ Aangepaste plaatsingswerkzaamheden alleen op de productpagina De aanbieding wordt niet geรฏnjecteerd op aangepaste posities op andere pagina's.
- โ ๏ธ Zorg ervoor dat de App ingebed is ingeschakeld in uw thema, anders blijft het knipsel/blok leeg op de storefront.
- โน๏ธ Het knipsel moet de exacte klassenaam behouden
futureblink-bundle-blocken uw aanbod uniekidVernoem ze niet, anders zal de app de container niet vinden. - โน๏ธ Elke bundel aanbod heeft zijn eigen unieke ID. Kopiรซren van het knipsel van het ene aanbod en verwachten van een ander aanbod om te verschijnen zal werken.
- ๐ก Als u de Placement dropdown terugschakelt naar Hieronder Toevoegen aan winkelwagenknop (Standaard), de app zal het aanbod automatisch weer weergeven ..geen ID of knipsel nodig.
๐ Eindresultaat
Zodra alles is geconfigureerd:
โ Uw bundel aanbod verschijnt op de exacte positie die u koos op de product pagina โ U kunt herpositioneren op elk moment van de thema-editor (App Block methode) โ Het aanbod blijft volledig dynamische prijzen, kortingen en varianten update in real time โ Uw product pagina lay-out ziet er precies zoals u het ontworpen โจ
Aangepast gebruiken Plaatsing geeft u volledige controle over waar uw bundel biedt live op de pagina ๐
Bijgewerkt op: 10/09/2026
Dankuwel!