Wix Editor: Uitlijningsproblemen op je live mobiele website

Leestijd 3 minuten
De inhoud van je website ziet er niet op alle mobiele apparaten hetzelfde uit, omdat verschillende browsers en apparaten verschillende rendering engines gebruiken. Zo kunnen tekstelementen op bepaalde mobiele schermen groter uitpakken, met elkaar overlappen of verkeerd uitgelijnd raken met andere elementen. 
In dit artikel lees je hoe je uitlijningsproblemen op mobiele telefoons kunt oplossen:

Eén regel tekst wordt in twee regels gesplitst

Je merkt mogelijk dat een enkele regel tekst in je mobiele Editor wordt opgesplitst in twee regels op de live website. Dit kan afhankelijk zijn van het apparaat en kan er op verschillende schermen anders uitzien.
Screenshot met tekst op de mobiele Editor en een live mobiele website.
Om dit probleem op te lossen, vergroot je het tekstvak door op de grepen te klikken en deze te verslepen. Dit maakt het tekstvak alleen groter en heeft geen invloed op de grootte van de tekst zelf.
GIF die toont hoe het tekstvak wordt uitgebreid in de mobiele Editor.

Tekst en andere elementen overlappen met elkaar

Als je een grote hoeveelheid tekst aan je website hebt toegevoegd in een enkel tekstvak en daarbovenop een element hebt toegevoegd, kan de tekst overlappen met andere elementen op je live website. Dit is meestal te zien in tekst die aan je website is toegevoegd in de desktop-Editor.
Screenshot van tekst en een knop, zowel in de mobiele Editor als op de live website. De knop overlapt met de tekst op de live website.

Om dit probleem op te lossen:

  1. Open de desktop-Editor.
  2. Verdeel de tekst over meerdere tekstvakken; één per alinea.
  3. Voeg de elementen toe tussen de tekstvakken met wat ruimte ertussen.
  4. Groepeer de elementen om ervoor te zorgen dat ze op elkaar zijn afgestemd. Klik hier om te lezen hoe je elementen groepeert
Screenshot van de desktop-Editor. De tekst is verdeeld over verschillende vakken en de knop staat ertussen.

Tekst is niet uitgelijnd met andere elementen

Als je veel tekst in een enkel tekstvak hebt, is het mogelijk dat het niet uitgelijnd is met andere elementen op je live mobiele website.
Dezelfde pagina in de mobiele Editor en de live website. De tekst en vector art zijn niet uitgelijnd op de live website.

Om tekst met andere elementen uit te lijnen:

  1. Open de desktop-Editor.
  2. Verdeel de tekst over meerdere tekstvakken; één voor elke alinea.
  3. Groepeer de tekst met de relevante elementen. Klik hier om te lezen hoe je elementen groepeert

Uitlijningsproblemen met andere elementen op mobiel

Het kan zijn dat elementen die je horizontaal hebt gerangschikt, op de mobiele versie van je website niet uitgelijnd zijn zoals verwacht.
Om te voorkomen dat deze elementen verschuiven, groepeer je ze en voeg je ze toe aan een transparant verzamelvak
En nu?
  • Gebruik de pagina-indeling optimalisator om automatisch inhoud op je mobiele website te ordenen en te vernieuwen zodat deze geschikt is voor kleinere schermen, en voor een consistente uitlijning op je mobiele website te zorgen. Klik hier om meer te lezen over de pagina-indeling optimalisator
  • Let op: Als je je website bouwt met de nieuwe Editor-ervaring, heb je geen toegang tot de Pagina-indeling optimalisator. Dit komt omdat Wix je mobiele indeling automatisch optimaliseert in de nieuwe Editor-ervaring. 

Vond je dit artikel nuttig?

|