Een trust badge maken

Een trust badge is een blok met pictogrammen voor betaling, beveiliging, verzending, garantie of beleid, met een optionele titel en beschrijving. De editor heeft twee tabbladen: Design voor inhoud en opmaak en Placement voor de ingebouwde positie op de productpagina en de shortcode.

1. Trust Badges openen

   Open in je Shopify-beheer Sami Product Labels, kies Extra Features in de navigatie van de app en kies dan het tabblad Trust Badges.

   Als je al trust badges hebt, toont de pagina ze in een tabel. Is de lijst leeg, dan toont de pagina in plaats daarvan het paneel Create your first trust badge.

   

   Het tabblad Trust Badges bevat de actie om er een te maken, de opgeslagen trust badges en de featured templates.

2. Kiezen hoe je begint

   Klik op Create trust badge. De knop staat in de koptekst van de pagina als de tabel zichtbaar is, of in het paneel voor de lege status als je nog geen trust badge hebt gemaakt.

   Scrol naar Featured templates. Klik op View all templates om alle vier de ontwerpen te tonen: Eco-Friendly template, With payment method, Policies store template en Badge box template. Klik op Select bij een template om die te openen met de pictogrammen en opmaak al toegepast.

   Beide opties openen de editor op het tabblad Design.

   

   Maak een trust badge helemaal zelf of kies een van de vier featured templates.

3. De trust badge een naam geven

   Het naamveld staat boven de voorvertoning. Vervang New Trust Badge door een naam van maximaal 50 tekens. Deze naam wordt alleen gebruikt om de trust badge in de app te herkennen en wordt niet aan klanten getoond.

   

   Gebruik een duidelijke interne naam, zodat je de trust badge gemakkelijk terugvindt in de tabel.

4. Een titel en beschrijving toevoegen

   Open in Content & Badges de velden Title en Description en voer de optionele tekst in die boven de pictogrammen verschijnt. Beide velden ondersteunen vet, cursief, onderstrepen, emoji, tekstuitlijning en de bronmodus.

   De velden zijn taalspecifiek. Hun labels tonen de actieve taal, bijvoorbeeld Title (en). Gebruik de taalkiezer boven de voorvertoning om een andere taal te bewerken.

   Laat beide velden leeg als je alleen de pictogrammen wilt tonen.

   

   Title en Description zijn optionele velden met opmaak die je voor elke taal apart bewerkt.

5. Badgepictogrammen toevoegen

   Klik onder Badges op Add Badge en kies dan:

   Optie	Wat het doet
   Select badge image	Opent het dialoogvenster Select Image.
   Line break	Laat de volgende pictogrammen op een nieuwe rij beginnen.

   Gebruik in Select Image het veld Search images om een pictogram te zoeken. De bron Library bevat meer dan 400 afbeeldingen voor betaling, beveiliging, verzending, garantie en beleid; het huidige aantal items staat naast de naam van de bron. Selecteer een of meer afbeeldingen en klik dan op Select Image.

   Schakel over naar Design your Images om geüploade, via een URL geïmporteerde of verwante eigen ontwerpen te gebruiken. Klik na het selecteren van een afbeelding op Edit with AI als je een variant wilt maken voordat je de afbeelding toevoegt.

   

   Zoek in de ingebouwde bibliotheek of schakel over naar Design your Images en bevestig dan je selectie.

6. Elk pictogram ordenen en configureren

   Elk pictogram verschijnt als een rij in de lijst Badges. Sleep een rij aan de greep om de weergavevolgorde te wijzigen of klik op Delete om hem te verwijderen. Gebruik items van het type Line break om te bepalen waar een nieuwe rij begint.

   Klik op de knop General van de rij om de instellingen te openen:

   • Change Image — vervang het geselecteerde pictogram.
   • Link — laat het pictogram een URL openen; gebruik de optie voor een externe link om hem in een nieuw tabblad te openen.
   • Tooltip — voeg maximaal 150 tekens toe die verschijnen als een bezoeker naar het pictogram wijst.
   • Layout colors — wijzig de kleur van ondersteunde lagen in ingebouwde SVG-pictogrammen.

   

   Sleep pictogrammen om de volgorde te wijzigen en gebruik General om de afbeelding, link, tooltip of ondersteunde kleuren te wijzigen.

7. Het trust badge-blok opmaken

   Gebruik de inklapbare ontwerpsecties om de trust badge bij je thema te laten passen:

   Sectie	Belangrijkste instellingen
   Design Main Section	Blokbreedte, marge, padding, randgrootte/-stijl/-kleur, schaduw en hoekradius.
   Design title & description	Aangepast lettertype, kleur, lettergrootte en regelhoogte voor de titel en beschrijving.
   Design Badge	Stijl mono, mono card, original of original card; uitlijning; breedte en hoogte; marge; en animatie.
   Responsive size	Aparte breedte en hoogte van pictogrammen voor tablet en mobiel.
   Advance Section	Aangepaste CSS en een klikbare CSS-referentie voor de selectors van de trust badge.

   De beschikbare animaties zijn SlideInUp, SadeInDown, BounceIn, FlipInX en ZoomIn. Schakel Animation in, kies een effect en gebruik de afspeelknop om een voorvertoning te zien.

   

   Open elke ontwerpsectie om de container, tekst, pictogrammen, responsieve formaten en aangepaste CSS op te maken.

   Opmerking

   Klik in Advance Section op een selector in CSS reference om de bijbehorende regel in de editor voor aangepaste CSS in te voegen.

8. Kiezen waar de trust badge verschijnt

   Ga naar het tabblad Placement:

   Optie	Wat het doet
   Product page	Schakel in om de trust badge op alle productpagina’s op de ingebouwde positie van de app te tonen.
   Shortcode	Kopieer het fragment als je de trust badge op een eigen positie in je thema wilt plaatsen.

   Een niet-opgeslagen trust badge gebruikt data-id="new" in de shortcode. Sla de trust badge op voordat je dat fragment in je thema plaatst.

   

   Gebruik de ingebouwde positie op de productpagina of kopieer de shortcode voor een eigen positie.

   Opmerking

   Zie Place a trust badge with shortcode voor de volledige werkwijze in de thema-editor.

9. Voorvertoning en opslaan

   Gebruik de bedieningselementen boven de voorvertoning om:

   • de bewerkingstaal te wisselen;
   • een voorvertoning van de Product page te bekijken;
   • te schakelen tussen desktop- en mobiele weergave;
   • het voorbeeldproduct te tonen of te verbergen;
   • de trust badge op Active of Draft te zetten.

   Controleer de voorvertoning en klik dan rechtsboven op Save. Klik op Discard als je de editor wilt verlaten zonder je niet-opgeslagen wijzigingen te bewaren.

   

   Bekijk het resultaat, kies Active of Draft en sla de trust badge op.

Volgende stappen

• Trust badge overview — beheer opgeslagen trust badges, templates, status en plaatsing.
• Place a trust badge with shortcode — voeg de trust badge toe op een exacte positie in je thema.

Tip

Hulp nodig?

Loop je tegen een probleem aan bij het volgen van deze stappen? Neem dan contact met ons op via [email protected].