Overzicht van contentblokken
Een gids voor elk contentblok in de editor, van koppen en afbeeldingen tot testimonials, FAQ's en formulieren, met waar elk blok voor dient en de belangrijkste instellingen.
Elke pagina van je winkel is opgebouwd uit blokken. Dit artikel beschrijft de contentblokken in het linkerpaneel van de editor, waar elk blok voor dient en wat de belangrijkste instellingen zijn. De blokken die je producten tonen en de winkelwagen en het afrekenen afhandelen, staan in Winkelblokken: productraster, product, winkelwagen en afrekenen.
Instellingen die elk blok heeft
Klik op een blok op de pagina om de instellingen te openen. Bij de meeste blokken staan die onder Algemeen, Weergave en Typografie. Elk blok heeft ook Grootte en positie, waar je de plek in het raster instelt en het blok op tablets of telefoons verbergt, en Beheren, met Dupliceren en Verwijderen. Zie Blokken toevoegen, verplaatsen en vergroten of verkleinen en Zorg dat je site er goed uitziet op telefoon en tablet.
Als een blok instellingen onder Typografie heeft, zijn die steeds dezelfde: Lettertype, Lettergrootte, Gewicht, Kleur, Cursief, Hoofdlettergebruik, Letterspatiëring en Regelhoogte. In de tabellen hieronder staan ze één keer vermeld als "Typografie".
Basis
| Blok | Waar het voor dient | Belangrijkste instellingen |
|---|---|---|
| Kop | Een titel of sectiekop. | Tekst, Grootte (Kop 1 tot Kop 6), Uitlijning, Typografie. |
| Tekst | Een alinea lopende tekst. | Tekst, Uitlijning, Typografie. |
| Lijst | Een korte lijst met punten, bijvoorbeeld wat er is inbegrepen. | Items (één per regel), Markering (Vinkje, Bullet, Streepje, Genummerd of Geen), Ruimte tussen items, Typografie. |
| Knop | Een knop die naar een pagina of een adres gaat. | Label, Link, Stijl (Gevuld, Omlijnd of Subtiel), Uitlijning, kleuren, Hoekafronding, tekstgrootte, ruimte en Volledige breedte. |
| Emoji | Eén grote emoji als eenvoudige versiering. | Emoji (kies er een of typ je eigen), Lettergrootte, Uitlijning. |
Meer over tekst en knoppen lees je in Tekst, koppen en knoppen bewerken. De Link van een knop werkt als een menulink: zie Je menulinks bewerken.
Media
| Blok | Waar het voor dient | Belangrijkste instellingen |
|---|---|---|
| Afbeelding | Eén foto of afbeelding. | Afbeelding, Alt-tekst (een korte beschrijving voor mensen die de afbeelding niet kunnen zien), Vorm (Breed 16:9, Standaard 4:3, Vierkant of Origineel), Beeldvulling (Kader vullen of Passend in het kader), Hoekafronding. |
| Galerij | Een raster met afbeeldingen, die bij een klik op volledige grootte kunnen openen. | Afbeeldingen, Aantal kolommen (1 tot 6), Rasterafstand, Vorm, Hoekafronding, Op volledige grootte openen bij een klik. |
| Video | Een video van YouTube, afgespeeld op je pagina. | YouTube-link. Payly host zelf nooit videobestanden. |
| Kaart | Een Google-kaart van je atelier, winkel of afhaalpunt. | Adres of plaats, Zoomniveau, Vorm, Hoekafronding. Typ het adres zoals je er zelf naar zou zoeken. |
In een Galerij voeg je elke afbeelding toe met het webadres ervan, een beschrijving en eventueel een link. Om een foto te gebruiken die je hebt geüpload, kopieer je het adres ervan uit het scherm Media. Zie Afbeeldingen toevoegen en de mediabibliotheek gebruiken.
Indeling
| Blok | Waar het voor dient | Belangrijkste instellingen |
|---|---|---|
| Container | Een vak dat andere blokken bevat, zodat je ze als één geheel kunt opmaken en verplaatsen. | Indeling binnenin (Vrij raster, Gestapeld of Naast elkaar), Rasterafstand, Uitlijnen, Achtergrondkleur, Randkleur, Hoekafronding, ruimte, Minimale hoogte. |
| Raster | Een tabel met rijen en kolommen met een blok in elke cel. Op een telefoon wordt het één kolom. | Aantal kolommen en Aantal rijen (elk 1 tot 8), Rasterafstand, Uitlijnen, Celrand, kleuren, ruimte. |
| Scheidingslijn | Een dunne lijn tussen twee delen van een pagina. | Kleur, Dikte. |
| Ruimte | Lege ruimte tussen blokken. | Hoogte. |
Zie Indelingen bouwen met containers en rasters.
Marketing
| Blok | Waar het voor dient | Belangrijkste instellingen |
|---|---|---|
| Mededelingenbalk | Een smalle gekleurde balk voor een kort bericht, zoals een bezorgaanbieding, met een optionele link. | Tekst, Linktekst, Link, Uitlijning, Achtergrondkleur, Tekstkleur, Lettergrootte. |
| Testimonial | Een klantcitaat met een naam, een korte omschrijving, een foto en een beoordeling in sterren. | Wat ze zeiden, Naam, Omschrijving, Foto, Sterren (0 tot 5), Uitlijning, kleuren, Typografie. |
| Logostrook | Een rij logo's, bijvoorbeeld van winkels die jouw werk verkopen of van media die over je schreven. | Logo’s, Aantal kolommen, Rasterafstand, Logohoogte, Kleuren dempen tot hover. |
| Aftelklok | Een timer die aftelt naar een datum, voor een uitverkoop of een lancering. | Telt af naar, Bericht als de tijd om is, Labels voor dagen en uren tonen, Uitlijning, Cijfergrootte, kleuren. |
| Social media-links | Iconen die naar je social media-accounts verwijzen. | Accounts (per account een netwerk en een adres), Stijl (Gevulde cirkel, Omlijnde cirkel of Alleen icoon), Icoongrootte, Rasterafstand, Uitlijning, Kleur van de cirkel, Icoonkleur. |
Om een mededelingenbalk op elke pagina te tonen, zet je hem in je header. De aftelklok leest de datum in de eigen tijdzone van elke bezoeker, dus middernacht is hun middernacht. Bij social media-links kun je kiezen uit Instagram, Facebook, TikTok, X, YouTube, LinkedIn, Pinterest, WhatsApp, E-mail en Website.
Menu’s en formulieren
| Blok | Waar het voor dient | Belangrijkste instellingen |
|---|---|---|
| Formulier | Een contactformulier waarvan de berichten naar je e-mail worden gestuurd. | Formuliertitel, Omschrijving, Velden, Tekst verzendknop, Bericht na verzenden, kleuren. |
| FAQ | Vragen die openklappen om het antwoord te tonen. | Kop, Vragen (telkens een vraag en een antwoord), Eerste antwoord geopend tonen, Steeds maar één antwoord open, Achtergrondkleur, Typografie. |
| Navigatie | Je logo en menu. Dit staat al in je header. | Sitelogo, Woordmerk, Logohoogte, Indeling, Winkelwagenknop tonen, Links, kleuren. |
| Linklijst | Een kolom links met een titel, zoals je in een footer gebruikt. | Kolomkop, Links, Achtergrondkleur, Lettertype, Kleur, Lettergrootte. |
Zie Een contactformulier toevoegen, Je menulinks bewerken en Je header en footer aanpassen.