Een banner maken
Bouw een banner vanuit een startsjabloon en publiceer hem in je webshop.
Dit is het hele pad, van een lege pagina Banners tot een balk die een bezoeker kan zien.
-
Open Banners en begin een nieuwe
Section titled “Open Banners en begin een nieuwe”Klik in het appmenu op Banners en dan op Create banner.
Als dit je eerste banner is, toont de pagina Create your first banner met dezelfde knop in het midden.
De pagina Banners voordat je er een hebt gemaakt.
-
Kies een beginpunt
Section titled “Kies een beginpunt”Er opent een dialoogvenster met tien startsjablonen, gegroepeerd op doel. Klik links op een sjabloon en het voorbeeld rechts toont de balk zoals hij op een pagina komt te staan.
Groep Startsjablonen Sale and urgency Flash sale, Black Friday, Selling fast, Sticky footer Discount code Discount code, Welcome offer Shipping Free shipping, Shipping cutoff Announcement Announcement, New arrivals Onder het voorbeeld staan kleine labels die aangeven wat erin zit (Text, Countdown, Button) en waar het staat.
Liever helemaal opnieuw beginnen? Kies Start from blank onderaan de lijst.
Klik op Use this template.
Elk startsjabloon kun je achteraf wijzigen: niets ervan ligt vast.
-
Geef hem een naam
Section titled “Geef hem een naam”De builder opent. Vervang linksboven de naam door iets wat je in de lijst herkent: “Black Friday top bar”, niet “Banner 3”.
De teller naast het veld toont hoeveel ruimte er nog over is.
-
Schrijf wat de balk zegt
Section titled “Schrijf wat de balk zegt”Het paneel Content toont de elementen in de balk. Klik op een element en de instellingen ervan openen in de kolom rechts.
- Klik op Text om het bericht te wijzigen
- Klik op Countdown om de einddatum in te stellen
- Klik op Button om het label te wijzigen en te bepalen waarheen hij leidt
- Sleep de handgreep links van een rij om de volgorde te wijzigen
- Met Add element komt er een nieuw element aan het einde
Zie Inhoud en elementen van de balk voor wat elk element kan.
Kies links een element en wijzig het rechts.
-
Geef hem een stijl
Section titled “Geef hem een stijl”Open het paneel Design, het penseelpictogram in de balk.
Stel de achtergrond, de tekst- en accentkleuren, hoeveel ruimte de balk inneemt en of bezoekers hem kunnen sluiten in. Zie Een banner ontwerpen.
-
Kies waar hij komt
Section titled “Kies waar hij komt”Open het paneel Placement, het derde pictogram in de balk.
- Top of the page duwt de pagina naar beneden. Bottom of the page zet hem vast onderaan het scherm
- Stay on screen houdt hem in beeld terwijl de bezoeker scrolt
- Conditions bepalen welke pagina’s hem krijgen: laat het op All pages staan om hem overal te tonen
- Devices beperkt hem tot desktop of mobiel
- Schedule zet hem vanzelf aan en uit
-
Controleer het voorbeeld
Section titled “Controleer het voorbeeld”Het midden van de builder toont de balk op een nagebootste webshoppagina. De twee pictogrammen bovenaan schakelen tussen de desktop- en mobiele breedte. Dit is de moeite waard, want een balk die op een laptop goed leest, kan op een telefoon krap zijn.
-
Zet hem op Active en sla op
Section titled “Zet hem op Active en sla op”Schakel naast de naam van Draft naar Active en klik op Save.
Draft slaat de banner op zonder hem aan iemand te tonen. Active zet hem in de webshop.
Een banner moet Active zijn voordat een bezoeker hem kan zien.
-
Bekijk je webshop
Section titled “Bekijk je webshop”Open je winkel in een nieuw tabblad en laad de pagina opnieuw. De balk hoort bovenaan of onderaan de pagina te staan.
Niet zichtbaar? Doorloop Aftelling wordt niet getoond: dezelfde controles gelden voor banners.
Als de knop een link nodig heeft
Section titled “Als de knop een link nodig heeft”Een knop die op Open a link staat, heeft een URL nodig voordat de banner als Active kan worden opgeslagen. De startsjablonen hebben /collections/all al ingevuld, dus wijzig dat naar de plek waar je bezoekers wilt laten landen.