Hieronder meerdere LIVE voorbeelden van de Shopify Prime Header.
Ieder voorbeeld gebruikt dezelfde section met een andere invulling.
Shopify Prime Header €199,00
Geef je productpagina een krachtige visuele start.
Deze flexibele header combineert een opvallende achtergrond, pakkende teksten en een duidelijke call-to-action in één conversiegerichte sectie. Je stelt alles zelf in via de theme editor – van layout tot kleuren en teksten – zonder één regel code. Inclusief optionele infobalk met USP’s, perfect voor snelle overtuiging. Volledig responsive, SEO-vriendelijk en ontworpen voor maximale impact, zowel op desktop als mobiel.
Ik wil deze module, wat nu?
- 1. Voor nu kun je contact opnement via stefan@studiowassink.nl over welke sections je wilt aanschaffen
- 2. Ik neem spoedig contact op voor toegang tot de webshop.
- 3. Ik bouw de Product Banner in een preview theme in.
- 4. Jij controleert het in de preview.
- 5. Goed? Dan kan het LIVE!
Klik hier om mij direct te mailen
Bestseller
Je bekijkt hier de daadwerkelijke live section, zoals je hem ontvangt. Geen afbeelding, geen mockup.
Zet de Uitleg Functies uit om interactieve elementen te testen.
Uitleg Functies aan/uit
Beheer deze content compleet met titel, subtitel en kleuren – jij houdt alles onder controle.
Kies 1 of 2 afbeeldingen en bepaal direct de verdeling met één simpele instelling.
Rond de hoeken af (optioneel) en bepaal exact hoe ver.
Vaste kleur of gradient? Jij stelt het in – inclusief custom link.
Plaats je logo over de afbeelding en kies de perfecte positie.
New Collection now online
And we made sure we can deliver
Head on to the new Special Collection we made so you can get your feet into an fresh pair of what the community all the 'sneakers of the year'right now...
Over de Prime Header
Aan te passen
Deze opties kunnen afwijken in de module door aanpassingen in de opzet
Lekker zitten in ons doel
Meer dan 350 stoelen en banken
Veel op voorraad en anders garanderen* wij levering binnen drie weken van jou nieuwe stoel of bank.
De lekkerste honing?
Natuurlijk bij honing.nl
Waar smaakt onze honing lekker bij?
Waar niet bij is de betere vraag!
Nr 1 in Bloemen & Planten
Vandaag besteld, morgen geleverd
Wij leveren bloemen en planten waar je zo lang mogelijk van kunt genieten. Wij garanderen dat je minimaal een week kunt genieten van een bloeiende bos bloemen!
HANDLEIDING SHOPIFY PRIME HEADER
Het kan zijn dat sommmige functies afwijken door aanpassingen en toevoegen
Lees hier over de opties hoe deze Shopify Prime Header je Shopify webshop gaat verbeteren. Er is lang nadegacht en getest om te komen tot deze opties.
Doel van de Section
De SW Main Header is ontworpen als prominente visuele binnenkomer op de homepage of andere landingspagina's. Deze section combineert een krachtige H1-titel, subtitel, ondersteunende tekst en optionele call-to-action knop met een of twee achtergrondafbeeldingen. Het doel is om binnen enkele seconden de juiste indruk te wekken en richting te geven aan bezoekers.
Deze section is bij uitstek geschikt voor SEO-kritische pagina’s zoals de productdetailpagina (PDP), omdat het de belangrijkste zoekwoorden en structuur (H1/H2) combineert met krachtige visuele ondersteuning.
Main Features
- Optie voor dubbele afbeelding én overlay logo – Kies voor een visuele split om merkbeleving te versterken.
- Vrij instelbare positionering van content – Bepaal exact waar je titel, tekst en knop komen te staan.
- Volledige breedte mogelijk – Laat de header 100% van het scherm vullen voor maximale impact.
- Contentvlak met achtergrondkleur – Verhoogt leesbaarheid, zelfs op drukke afbeeldingen.
Instelbare Opties
Algemene Instellingen
- Volle breedte aan (checkbox): Laat de banner over de volledige breedte van het scherm lopen.
- Title aan/uit (checkbox): Zet de titel in of uit.
- Subtitel aan/uit (checkbox): Zet de subtitel in of uit.
- Tekst aan/uit (checkbox): Toon of verberg de ondersteunende tekst.
- Knop aan/uit (checkbox): Toon of verberg de button.
- Tekst achtergrond aan/uit (checkbox): Voeg een achtergrondvlak toe achter de content.
- Kleur achtergrond + opacity: Achtergrondkleur en doorzichtigheid van het contentvlak.
Positionering
- Hoogte Banner (slider): Stel de hoogte van de volledige banner in (250px - 1500px).
- Achtergrondkleur + opacity: Achtergrond van de gehele section, indien geen afbeeldingen geladen worden.
- Margin Top / Bottom: Buitenmarges boven en onder de section.
- Afstand top title / content afstand links / content breedte: Positionering van de content binnen het beeldvlak.
Rondingen
- Top Border Radius: Afgeronde hoeken bovenaan.
- Bottom Border Radius Left/Right: Afgeronde hoeken onderaan, apart instelbaar per kant.
Achtergrondafbeelding
- Type afbeelding (select): Keuze tussen één afbeelding (single) of twee afbeeldingen naast elkaar (double).
- Hoofdafbeelding (image_picker): Te tonen afbeelding (altijd vereist).
- Tweede afbeelding (optioneel): Wordt enkel getoond bij "double" type.
- Verdeling afbeeldingen (%) (slider): Bepaal hoeveel % ruimte afbeelding 1 inneemt (bij double).
Overlay Afbeelding
- Overlay afbeelding (image_picker): Extra afbeelding bovenop de achtergrond (bijv. een logo).
- Positionering (left / top in %): Bepaal de plaatsing van deze overlay.
Titel & Subtitel
- HTML-niveau (range 1-5): Kies welk H-tag element gebruikt wordt voor SEO.
- Lettergrootte en kleur (range + color): Styling van titel en subtitel.
- Teksten (text): De inhoud zelf.
Tekstblok
- Lettergrootte en kleur (range + color)
- Tekst (textarea): Vrij in te vullen ondersteunende tekst.
Button
- Tekstgrootte + kleur
- Achtergrondtype (solid of gradient)
- Kleuren (1 & 2) (voor gradient)
- Ronding knop + margin boven (slider)
- Tekst & Link (text + url)
Mobiele optimalisatie
- Afbeeldingen worden automatisch geschaald en tweede afbeelding verdwijnt onder 768px.
- Content schuift mee naar een centrale opstelling op mobiel.
- Lettergroottes worden automatisch verkleind voor betere leesbaarheid.
SEO & UX Tips
- Gebruik één duidelijke H1 met je kernboodschap.
- Subtitel kan een krachtige H2 zijn voor zoekmachines.
- Gebruik alt-teksten voor overlay afbeeldingen voor extra toegankelijkheid.
- Zorg voor contrast tussen achtergrond en tekst voor leesbaarheid.
