Falsche Schriftart Mobil

    Hallo,
    ich hoffe hier auf Hilfe. Auf meiner Seite https://zielkontakt.com/ wird trotz der richtigen Einstellungen im Customizer die falsche Schriftart in der mobilen Version angezeigt. Ich habe eine Comic Sans ausgewählt und mobil ist es eine Schreibschrift mit Serifen. In der Desktopversion ist alles richtig und normal.
    Das Theme ist OceanWP und die Seite ist noch im Aufbau.
    Ich finde keine Möglichkeit, die Schriftart zu ändern, mobil ist auch alles auf Comic Sans gestellt. Ein Cache Plugin ist nicht installiert.
    Zudem bekomme ich es mobil nicht hin, dass das Menü rechts neben dem Logo platziert wird. Sobald ich die Einstellung ändere, verschwindet der Punkt.
    Ich weiß nicht, ob es ein Bug ist, oder ich irgendwo einen Fehler gemacht habe.

    Vielen Dank im Voraus.

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    Das Problem ist deine Annahme, dass die Schriftart auf jedem Endgerät vorhanden ist. Diese von Microsoft erfundene Schriftart ist nahezu nur unter Windows zu finden. Auf Handys gibt es sie nicht - da sucht sich der Browser dann irgendeine auf dem Gerät vorhandene Standard-Schriftart aus und nutzt diese.

    Da man Comic Sans aus Lizenzgründen auch nicht selbst einbinden darf, hast Du eigentlich nur 3 Möglichkeiten:
    * Du verzichtest auf diese Schriftart und nimmst eine andere.
    * Du gibst als alternative Schriftart eine ähnlich an die entweder als websichere Schriftart gilt oder z.B. per Google Fonts eingebunden werden kann (Hinweis: Datenschutz dabei beachten - nur lokal einbinden, nicht von extern)
    * Du lässt es so wie es ist und ignorierst die Abweichungen auf nicht-Windows-Computern.

    Auf meinem Android sieht die Site so aus:

    Die Schrift konnte ich auch mit Erkennungstools nicht identifizieren. Sie gefällt mir jedenfalls besser als Comic Sans. Du kannst aber für die mobile Ansicht eine alternative Schriftart setzen. Was mir noch auffällt: die Site ist nicht responsiv, d.h. sie wird rechts und links abgeschnitten, es gibt auch keine Menüleiste.
    Oben links ist eine Grafik eingebunden, die aber nicht angezeigt wird.

    Die Comic Sans wurde tatsächlich von der Bekannten gewünscht, genau wie die Einfachheit der Seite, mein Favorit ist die Schriftart definitiv auch nicht. Danke für die Antworten, das macht natürlich alles Sinn und gebe ich so weiter. Ich habe Google Fonts schon einmal lokal eingebunden, sodass ich dort die Comic Neue nehmen könnte.
    Warum die Seite nicht responsiv ist, ist mir allerdings schleierhaft. Insbesondere da alle anderen Homepages von mir mit OceanWP und denselben Einstellungen gut aussehen. Ich habe die Ansicht von mir mal angehängt. Man erkennt rechts noch das "M" von Menü.
    Vielen Dank für die Antworten.

    Zitat von tresor666

    Ich habe die Ansicht von mir mal angehängt. Man erkennt rechts noch das "M" von Menü.
    Vielen Dank für die Antworten.

    Ja, also auch keine responsive Ansicht :rolleyes:

    Zitat von Kurt Singer

    Ja, also auch keine responsive Ansicht :rolleyes:

    Gibt es besondere Einstellungen im Customizer, um die responsive Ansicht zu garantieren? Es geht ja nur um das Menü und das nicht abgeschnitten ist. Ich weiß, das ist eine globale Frage, aber normal ist doch alles einstellbar, wenn man in die Einstellungen unter "Mobiles Menü" geht. Das ist soweit korrekt.

    Die Seite ist responsiv. Das einzige was nicht stimmt ist der Aufbau vom Header. Dieser wird durch eine Custom CSS-Angabe mobil völlig falsch dargestellt. Das hier ist die schuldige Stelle im CSS:

    CSS
    #site-header-inner{padding:0 !important;display:flex;justify-content:center;align-items:center}

    Lösung wäre, diese Eigenschaft nur ab einem bestimmten Viewport zu verwenden - also zum Beispiel:

    CSS
    @media only screen and (min-width: 600px) {
 #site-header-inner{padding:0 !important;display:flex;justify-content:center;align-items:center}
}

    Dein Theme kann nichts für das was Du individuell ergänzt.

    Vielen Dank für die Antworten. Ich habe es so hingekriegt. Eine Frage hätte ich noch. Trotz, dass ich bestimmte Links deaktiviert habe, kann man diese im mobilen Menü anwählen. Also Seiten mit Unterseiten. Dann wird eine leere Seite angezeigt. Kann mir bitte noch jemand sagen, wo der Fehler liegt?
    Vielen Dank!

    Ich weiß schonmal nicht was "bestimmte Links" sind. Wenn Du nur die dazugehörige Seite deaktivierst aber im Menü den Menüpunkt nicht entfernst, kann das schon ein Problem sein. Ein konkretes Beispiel würde helfen.

    Könnte das z.B. und u.a. die Seite Firmenevents sein? Die ist nämlich leer o_O. Aber die ist nicht deaktiviert!

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden