Weergave per apparaat en pagina

Op het tabblad Display van de badge-editor bepaal je waar en wanneer een badge wordt getoond, nadat je op het tabblad Products hebt bepaald voor welke producten de badge geldt.

Het tabblad is een lijst met inklapbare secties:

Sectie	Wat het bepaalt	Beschreven in
Customer conditions	Welke shoppers de badge zien (ingelogd, tags, specifieke klanten)	Targeten op klant
Page conditions	Op welke paginatypen de badge verschijnt	Deze pagina
Language conditions	De taal van de webshop waarin de bezoeker surft	Targeten op land en taal
Country conditions	Het land van de bezoeker	Targeten op land en taal
Other conditions	Productafbeelding, apparaat en uitgesloten thema-elementen	Deze pagina
Visibility Date & Countdown	Begin- en einddatums en afteltimers	Zichtbaarheid plannen
Priority conditions	Welke badge voorrang krijgt als er meerdere voor één product gelden	Deze pagina

Het tabblad Display. Secties met een chevron kun je uitvouwen. Secties met een schakelaar moet je eerst aanzetten.

Opmerking

Secties met een chevron (⌄) kun je gewoon uitvouwen. Secties met een schakelaar (Language, Country, Priority) moet je aanzetten voordat hun velden verschijnen.

Het tabblad Display openen

1. Open de app

   Ga in je Shopify-beheer naar Apps → Sami Product Labels.

2. Open Badges & Labels

   Klik in het linkermenu van de app op Badges & Labels. De lijst toont elke badge met ID, naam, voorbeeld, type, prioriteit, positie en status.

   

   De lijst Badges & Labels. Klik op het potloodpictogram in de kolom Actions om een badge te bewerken.

3. Bewerk de badge

   Klik op het potloodpictogram in de kolom Actions van de badge die je wilt instellen. De editor opent met drie tabbladen: Design, Products, Display.

4. Ga naar Display

   Klik op het tabblad Display.

Opmerking

De knoppen Save en Discard rechtsboven verschijnen pas nadat je iets hebt gewijzigd. Als je je bewerkingen wilt verwerpen, klik je op Discard → Discard changes.

Page conditions

Standaard wordt een badge getoond op elke pagina waarop het product verschijnt. Voeg een paginavoorwaarde toe om dit te beperken tot bepaalde paginatypen.

Een paginavoorwaarde toevoegen

1. Vouw Page conditions uit

   Klik op de rij Page conditions om die uit te vouwen. Er verschijnt een knop + Add conditions.

   

   Een lege sectie Page conditions: er is nog geen regel, dus de badge wordt overal getoond.

2. Klik op + Add conditions

   Er verschijnt een voorwaarderij met drie velden: Page (vast), een operator en een paginatype. De standaardwaarden zijn Page is equal to Index page.

   

   Elke klik op + Add conditions voegt één rij toe. Gebruik het prullenbakpictogram aan het einde van een rij om die te verwijderen.

3. Kies de operator

   • is equal to: toon de badge alleen op het geselecteerde paginatype.
   • is not equal to: toon de badge overal behalve op het geselecteerde paginatype.

4. Kies het paginatype

   Optie	Waar de badge verschijnt
   Index page	De startpagina van je webshop
   Collection page	Overzichtspagina’s van collecties en categorieën
   Product page	Afzonderlijke productpagina’s
   Article Page	Pagina’s met blogartikelen
   Blog page	Overzichtspagina’s van blogs
   Cart page (including cart drawer)	De winkelwagenpagina en de uitschuifbare winkelwagen
   Search page	Pagina’s met zoekresultaten
   Specific pages	Alleen de exacte URL die je invoert (zie de volgende stap)

   

   De acht paginatypen die beschikbaar zijn voor een paginavoorwaarde.

5. Voer bij Specific pages de URL in

   Als je Specific pages kiest, komt er een vierde veld bij. Voer de volledige URL van de pagina in je webshop in, bijvoorbeeld https://your-store.myshopify.com/pages/summer-sale. De plaatsaanduiding toont als voorbeeld de URL van je eigen winkel.

   

   Specific pages voegt een URL-veld toe: plak de volledige URL van de pagina, niet alleen het pad.

6. Opslaan

   Klik rechtsboven op Save.

Opgepast

Een badge moet ook nog overeenkomen met het tabblad Products. Een paginavoorwaarde beperkt waar een overeenkomend product zijn badge toont. Ze zorgt er nooit voor dat de badge verschijnt bij producten waarvoor hij niet geldt.

Other conditions

Vouw Other conditions uit om te bepalen op welke productafbeelding de badge staat, welke apparaten hem zien en welke thema-elementen moeten worden overgeslagen.

Instelling	Opties	Gedrag
Show on (product page)	All images / First image	Toon de badge op elke galerijafbeelding of alleen op de eerste (hoofd)afbeelding van het product.
Device targeting	All devices / Desktop / Mobile	Beperk de badge tot shoppers op desktop of mobiel, of toon hem op alle apparaten.
Do not show label on	CSS class list — .CLASS1, .CLASS2,...	De badge wordt niet weergegeven op elementen die overeenkomen met deze klassen. Handig als een slider, quickview of upsell-sectie in je thema niet geschikt is voor badges.

Instellingen voor afbeelding, apparaat en uitsluiting staan allemaal onder Other conditions.

Opmerking

Do not show label on verwacht CSS-klasseselectors, gescheiden door komma’s en elk beginnend met een punt, bijvoorbeeld .product-card__slider, .quick-view. Inspecteer het element in je thema om de klassenaam te vinden.

Priority conditions

Als meerdere badges overeenkomen met hetzelfde product, bepaalt de prioriteit welke wordt getoond.

1. Zet Priority conditions aan

   Klik op de schakelaar bij de rij Priority conditions. Er verschijnt een veld Priority value.

2. Voer een prioriteitswaarde in

   Typ een getal van 0 tot 100. 0 is de hoogste prioriteit, 100 de laagste. De app toont dezelfde tip onder het veld.

   

   Lager getal = hogere prioriteit. Een badge wordt verborgen als het product al een badge met een hogere prioriteit heeft.

3. Opslaan

   Klik op Save. De waarde staat nu in de kolom Priority van de lijst Badges & Labels, zodat je al je badges in één oogopslag kunt vergelijken.

Opgepast

Badges waarbij prioriteit is uitgeschakeld, staan als None in de lijst en doen niet mee in de vergelijking. Als je wilt dat de ene badge betrouwbaar voorrang krijgt boven een andere, stel dan bij beide een prioriteitswaarde in.

Voorbeeld van prioriteit

Badge	Prioriteitswaarde	Resultaat bij een product dat aan beide voldoet
Sale off	0	Getoond
Best seller	10	Verborgen

Volgende stappen

• Badgepositie wijzigen: pas aan waar de badge op de productafbeelding staat.
• Producten targeten: kies welke producten je badge tonen.
• Zichtbaarheid plannen: stel begin- en einddatums voor een badge in.

Tip

Hulp nodig?

Loop je tijdens deze stappen ergens tegenaan? Neem dan contact met ons op via [email protected].