Apparaatinstellingen worden niet toegepast – ZenBlocks buttonBasic
Conclusie
Als apparaatinstellingen niet worden toegepast, is de oorzaak vaak **oude CSS-cache, inconsistente breakpoints of een conflict met thema-CSS**.
—
Oorzaken
1. CSS-cache is verouderd.
2. CSS is niet opnieuw gegenereerd na wijziging van breakpoints.
3. Thema-selector heeft hogere specificiteit.
4. Alleen editor gecontroleerd, niet de front-end.
5. Waarde per apparaat is leeg (desktop-fallback).—
Oplossingsstappen
### Stap 1: controleer op de front-end
1. Open de echte front-end pagina.
2. Open DevTools (F12).
3. Test meerdere breedtes in responsive mode.
4. Controleer `computed styles`.### Stap 2: cache legen
1. Controleer `/wp-content/uploads/zenblocks/`.
2. Leeg browsercache.
3. Voer CDN purge uit indien van toepassing.
4. Leeg ook server-side cache plugins.### Stap 3: breakpoints controleren
1. Controleer globale breakpoint-instellingen.
2. Standaard ZenBlocks-waarden:
– **MD (tablet)**: 1024px
– **TB (small tablet)**: 768px
– **SP (smartphone)**: 480px
3. Stem af met breakpoints van het thema.
4. Controleer of responsive CSS opnieuw is gegenereerd.### Stap 4: selectorconflicten controleren
1. Controleer in DevTools doorgestreepte regels.
2. Als thema-CSS wint, moet thema-CSS mogelijk worden aangepast.### Stap 5: waarden per apparaat controleren
1. Controleer waarden per apparaat in elk paneel.
2. Lege velden gebruiken desktop als fallback.
3. Vul expliciete waarden in waar differentiatie nodig is.—
Aandachtspunten
– Responsive preview in de editor gebruikt een iframe en kan verschillen van de front-end.
– Wijzigen van breakpoints heeft impact op de hele site: voer wijzigingen zorgvuldig door.—
Gerelateerde instellingen
– [Weergave-instellingen](../display/)
– [Lettertype-instellingen](../font/)
– [Lay-outinstellingen](../layout/)