Mobiles CSS einbinden?

  • Hallo Leute,

    ich bin zur Zeit auf der Suche nach einer Möglichkeit irgendwo im Wordpress-Code anhand von PHP zu erkennen ob der Benutzer mit einem mobilen Browser unterwegs ist und dann ein anderes CSS-File einzubinden.

    Der Code ist relativ primitiv und prüft nur ob es anstatt des style.css ein style.mobile.css gibt und inkludiert wenn es ein mobiler Browser ist das andere.

    Mein Problem: An welcher Stelle muss ich den Code einbinden?

    PS: Bei meiner Recherche bin ich auf viele "Tipps" gestoßen die eine max-width von 480px als Media-Query verwenden, da kann man Galaxy Nexus mit 1280x720 Pixel Auflösung nur müde lächeln.

    • 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

  • Hallo Leute,

    ich bin zur Zeit auf der Suche nach einer Möglichkeit irgendwo im Wordpress-Code anhand von PHP zu erkennen ob der Benutzer mit einem mobilen Browser unterwegs ist und dann ein anderes CSS-File einzubinden.

    Es gibt etliche "mobile detect" PHP Klassen - im Head einbinden und dementsprechend das CSS File laden.

  • Die meisten responsive Designs arbeiten tatsächlich mit Media-Querys.

    Eine ander Möglichkeit wäre aber z.B. über die functions.php des Theme nach den User Agents zu fragen

    PHP
    function isMobile() {
      return preg_match("/(android|avantgo|blackberry|mini|mobi|palm|phone|pie|tablet|webos|wos)/i", $_SERVER["HTTP_USER_AGENT"]);
    }

    Danach kann man mit

    PHP
    <?php if(isMobile()) ...


    die mobile.css im header.php einbinden.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • AW: Mobiles CSS einbinden?

    Man kann aber auch die verschiedensten Auflösungen (kleiner-gleich), die Ausrichtung (landscape oder normal) sowie die verschiedensten PPIs per Media Queries ansprechen.

  • Die meisten responsive Designs arbeiten tatsächlich mit Media-Querys.

    Eine ander Möglichkeit wäre aber z.B. über die functions.php des Theme nach den User Agents zu fragen

    PHP
    function isMobile() {
      return preg_match("/(android|avantgo|blackberry|mini|mobi|palm|phone|pie|tablet|webos|wos)/i", $_SERVER["HTTP_USER_AGENT"]);
    }

    Danach kann man mit

    PHP
    <?php if(isMobile()) ...


    die mobile.css im header.php einbinden.

    Ahh, ich suche seit 2 Stunden in Google erfolgslos, wie man das richtig macht, danke!! Wollte gerade ein neues Thema dafür erstellen..

Jetzt mitmachen!

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