Hoe regel ik wat er op mobiel gebeurt met mijn secties en kolommen?

Wat gebeurt er standaard?

Op schermen tot en met 991 pixels breed (telefoons en de meeste tablets) wordt elke kolom 100% breed. Ze staan dan in dezelfde volgorde onder elkaar: de linker kolom eerst. Zet je tekst links en een foto rechts, dan komt op mobiel dus eerst de tekst en daaronder de foto. Waarom dat belangrijk is, lees je in waarom een responsive website belangrijk is.

Kolommen naast elkaar houden

Soms wil je kolommen ook op een kleiner scherm naast elkaar, bijvoorbeeld twee kleine iconen met een korte tekst of een rij logo’s.

1. Selecteer de sectie.
2. Open Uitlijning instellingen.
3. Kies bij Kolommen op mobiel en tablet een van de opties hieronder.

De kolommen houden dan dezelfde verhouding als op desktop: een kolom van 8 en een van 4 blijven 8 en 4.

Onder elkaar (standaard)

Zoals hierboven beschreven.

Naast elkaar vanaf tablet (768px)

Op een tablet en groter blijven de kolommen naast elkaar; op een telefoon komen ze onder elkaar. Een goede middenweg voor bijvoorbeeld twee kolommen tekst.

Altijd naast elkaar, ook op mobiel

De kolommen staan op elk scherm naast elkaar. Gebruik dit alleen voor korte inhoud: een lange tekst in een halve telefoonbreedte leest niet prettig.

Een sectie of kolom verbergen op mobiel of desktop

Selecteer de sectie of kolom en open het paneel Zichtbaarheid. Kies bij Sectie tonen op (of Kolom tonen op):

• Alle apparaten: de standaard.
• Alleen desktop: verborgen op schermen tot en met 991 pixels.
• Alleen mobiel: alleen zichtbaar tot en met 991 pixels, dus op telefoons en de meeste tablets.

In de editor blijft alles zichtbaar, zodat je het kunt blijven bewerken. In de editor staat dan een klein icoon van een telefoon of computer bij de sectie of kolom.

Voorbeeld: een andere hero op mobiel

Je bovenste sectie heeft op desktop een brede foto met tekst ernaast, maar op een telefoon valt de foto rommelig uit. Maak dan twee secties: zet de eerste op Alleen desktop, kopieer hem en zet de kopie op Alleen mobiel. Pas in de mobiele versie de foto, de volgorde of de tekst aan. Zo kun je ook de volgorde van tekst en foto op mobiel omdraaien.

Verborgen inhoud wordt wel geladen, alleen niet getoond. Gebruik dit dus niet voor zware video’s of veel grote foto’s. Voor een achtergrondvideo is er een aparte instelling; zie een video als achtergrond.

Controleer je pagina op mobiel

• Open de pagina op je eigen telefoon, na het opslaan.
• Of maak op je computer het browservenster smal. Let op: de ruimte boven en onder een sectie die je apart voor mobiel instelt, zie je alleen op een echte telefoon (zie hoogte en ruimte van een sectie).

Lukt het niet?

• Een sectie is ook op desktop weg: controleer bij Zichtbaarheid of er niet Alleen mobiel staat.
• Kolommen staan op je tablet toch onder elkaar: kies Naast elkaar vanaf tablet (768px); houd je tablet eventueel liggend.
• Kolommen in een rij stapelen nog: dat kan niet anders. Zet ze direct in een eigen sectie.
• Je kolommen zijn op mobiel te smal: kies voor die sectie weer Onder elkaar (standaard).
• Meer over kolommen: een sectie in kolommen indelen en alles over pagina’s en secties.

Veelgestelde vragen