Mobilansicht wird nicht korrekt angezeigt

Deine Website sieht auf dem Desktop toll aus, aber auf dem Smartphone ist alles verschoben, zu groß oder irgendwie komisch? Das ist ein häufiges Problem und meistens schnell gefunden. Hier sind die häufigsten Ursachen und was du dagegen tun kannst.

Zuerst: Browser-Cache leeren

Bevor du auf Fehlersuche gehst, leere einmal den Cache auf deinem Smartphone. Manchmal zeigt der Browser einfach eine veraltete Version deiner Website an.

💡 Hinweis: Wie das geht, zeige ich dir im Artikel Cache leeren – Browser, WordPress & Hosting.

Mobilansicht im Browser testen

Öffne deine Website auf dem Smartphone und schau genau, was nicht stimmt. Alternativ kannst du das auch direkt am Computer testen:

  1. Öffne deine Website in Google Chrome
  2. Rechtsklick auf die Seite → Untersuchen
  3. Klicke auf das Smartphone-Icon oben links (Gerät umschalten)
  4. Wähle ein Gerät aus der Liste, z.B. iPhone oder Samsung Galaxy

So siehst du genau, wie deine Seite auf verschiedenen Geräten aussieht — ohne jedes Mal zum Handy greifen zu müssen.

Häufige Ursachen und Lösungen

Das Layout ist auf Mobilgeräten komplett durcheinanderViele Einstellungen in Kadence haben separate Werte für Desktop, Tablet und Mobilgerät — erkennbar an den kleinen Geräte-Icons im Einstellungsfeld. Prüfe, ob du die mobilen Werte versehentlich leer gelassen oder falsch eingestellt hast.

Ein Block ist zu breit und erzeugt einen horizontalen Scrollbalken

Das passiert oft, wenn ein Block eine feste Breite in Pixeln hat statt einer flexiblen Breite in Prozent. Öffne den betroffenen Block im Editor und ändere die Breite auf 100% — oder entferne den festen Pixelwert.

Schrift oder Buttons sind auf dem Handy viel zu groß oder zu klein.

Auch Schriftgrößen lassen sich in Kadence separat für Mobilgeräte einstellen. Gehe in die Typografie-Einstellungen des betroffenen Elements und prüfe den mobilen Wert.Die Seite sieht im Chrome-Entwicklertool gut aus, aber auf dem echten Handy nicht.

Das Tool am Computer ist eine Annäherung, kein perfektes Abbild. Teste im Zweifelsfall immer auf einem echten Gerät — und am besten auf zwei verschiedenen Browsern, z.B. Chrome und Safari.

Änderungen an mobilen Einstellungen in Kadence wirken sich nur auf die Mobilansicht aus — der Desktop bleibt unberührt. Du kannst also bedenkenlos anpassen.

Ähnliche Beiträge

  • Weißer Bildschirm in Kadence beheben

    Du willst gerade an deiner Website arbeiten, öffnest den Editor oder den Customizer – und da ist nur eine weiße, leere Fläche. Kein Fehlertext, keine Buttons, einfach nichts. Das passiert meistens nach einem Update oder einer neuen Plugin-Installation. Die gute Nachricht: In den meisten Fällen lässt sich das Problem schnell beheben. 1: Ein Update hat…

  • Cache leeren

    Website-Cache leeren Du hast eine Änderung an deiner Website gemacht — zum Beispiel CSS angepasst, einen neuen Beitrag veröffentlicht oder eine Einstellung geändert — aber auf deiner Website siehst du davon nichts? Dann liegt es sehr wahrscheinlich am Cache. Was ist ein Cache überhaupt? Der Cache sorgt dafür, dass deine Website schneller lädt. Dein Browser,…

  • Änderungen nach Speichern nicht sichtbar

    WordPress Änderungen werden nicht angezeigt Du hast etwas an deiner Website geändert, auf Speichern geklickt — aber wenn du die Seite aufrufst, sieht alles noch genauso aus wie vorher? Das ist frustrierend, aber meistens ganz schnell erklärt. Ursache 1: Der Customizer steht noch auf „Entwurf“ Wenn du Änderungen im WordPress Customizer vornimmst, kannst du sie…

  • WordPress Plugin Konflikte finden und beheben

    Plugins machen WordPress erst richtig mächtig — aber manchmal vertragen sich zwei Plugins nicht miteinander, oder ein Plugin und dein Theme streiten sich. Das Ergebnis sind merkwürdige Fehler, die auf den ersten Blick schwer zu erklären sind. Schritt 1: Erstmal die Verdächtigen prüfen Fang mit Cache- und Optimierungs-Plugins an — also WP Rocket, W3 Total…

  • Aktualisierung fehlgeschlagen JSON Fehler

    Aktualisierung fehlgeschlagen / JSON-Fehler Du klickst auf „Veröffentlichen“ oder „Aktualisieren“, und statt deiner Seite siehst du eine rote Fehlermeldung wie „Aktualisierung fehlgeschlagen“ oder „Die Antwort ist kein gültiges JSON“? Das sieht erstmal beunruhigend aus, lässt sich aber meistens schnell lösen.💡 Hinweis: Keine Sorge — dein Inhalt geht dabei nicht verloren. WordPress speichert im Hintergrund weiterhin…

  • Zu viele Weiterleitungen WordPress

    Die Fehlermeldung „Zu viele Weiterleitungen“ oder „ERR_TOO_MANY_REDIRECTS“ bedeutet, dass deine Website sich selbst im Kreis weiterleitet – und der Browser irgendwann einfach abbricht. Klingt kompliziert, ist aber meistens schnell gefunden. Schritt 1: Leere zuerst deinen Browser-Cache komplett: Strg+Umschalt+R (Windows) oder Cmd+Umschalt+R (Mac). Danach erneut versuchen – manchmal reicht das schon. Schritt 2: Leere auch den…