wp_is_mobile(): WordPress-Inhalte nur für mobile Geräte

Seit Version 3.4 – also seit Mitte 2012 – besitzt WordPress einen Conditional-Tag mit dem man mobile Geräte erkennen und ansprechen kann und das den Namen wp_is_mobile() trägt.

Symbolbild: Website im mobilen Simulator

So ist die Funktion in der Datei /wp-includes/vars.php definiert:

function wp_is_mobile() {
    if ( empty($_SERVER['HTTP_USER_AGENT']) ) {
        $is_mobile = false;
    } elseif ( strpos($_SERVER['HTTP_USER_AGENT'], 'Mobile') !== false // many mobile devices (all iPhone, iPad, etc.)
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Android') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Silk/') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Kindle') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'BlackBerry') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Opera Mini') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Opera Mobi') !== false ) {
            $is_mobile = true;
    } else {
        $is_mobile = false;
    }
 
    return $is_mobile;
}

Wie man an Hand des oberen Codes gut erkennen kann, wird der User Agent Strings des Browsers ($_SERVER['HTTP_USER_AGENT']) ausgelesen und durch dieses Auslesen werden die mobilen Geräte erkannt. Mit dieser Methode erkennt man die Geräte von Apple, Geräte mit Android, verschiedene Kindles – Silk ist der Standardbrowser auf Kindle Fire, so wie Blackberrys und Geräte mit mobilen Opera-Browser … wie das aber mit Windows-Phone klappt kann ich mangels Testgerätes nicht sagen.

Dadurch ergeben sich für den Betreiber bzw. den Betreuer eines WordPress-Projektes zusätzliche Möglichkeiten. So kann er zum Beispiel nur für die mobilen Nutzer Inhalte einblenden lassen:

<?php if (wp_is_mobile()) {
	// Das hier wird nur auf den mobilen Geräten angezeigt
} ?>

Diese zusätzlichen Inhalte können verschiedener Natur sein. So kann man auf diese Weise die mobile Navigation oder angepasste Werbeanzeigen für mobile Nutzer einblenden lassen. Man kann natürlich auch den umgekehrten Weg wählen und Inhalte nur dann anzeigen lassen, wenn Besucher vorbeikommen, die nicht als mobile Nutzer erkannt wurden:

<?php if (!wp_is_mobile()) {
	// Das hier wird nicht auf den mobilen Geräten angezeigt
} ?>

Also kurz zusammenfasst. Mit der Abfrage wp_is_mobile() und !wp_is_mobile() hast du die Möglichkeit Inhalte für mobile und nicht-mobile Nutzer ausgeben zu lassen. Was das jetzt im einzelnen ist – zusätzliche Hinweise, eine andere Navigation, angepasste Werbung – ist natürlich dem Betreiber überlassen, aber wie man sieht die Einsatzmöglichkeiten sind vielfältig.

Wir arbeiten seit 20 Jahren mit WordPress und bieten diverse Dienst­leistungen rund um das System an. Kontaktiere uns für weitere Informationen oder für ein Angebot.

Verwandte Beiträge:

15 Kommentare

  1. Problematisch ist die Funktion allerdings, wenn man ein Cache-Plugin verwendet… Je nach erstem Aufruf ist dann entweder die mobile oder nicht-mobile Version im Cache und wird jedem Nutzer angezeigt, egal mit welchem Device er sich die Seite ansieht…

    1. Hallo Marcus,
      das ist ein guter Einwand. Habe es auf einer Installation ausprobiert ohne aktiviertem Cache-Plugin. Wobei ich zum Beispiel weiß, dass Hyper Cache separate Caches für mobile und nicht-mobile Geräte anbietet. Man müsste es ausprobieren wie zuverlässig diese Erkennung ist.

      1. Hi Vladimir,

        W3 Total Cache z.B. wird out of the box zu Problemen führen. Man müsste über User Agent Groups regeln, dass mobile Seite extra behandelt werden…

        Kleinere, einfachere Cache-Plugins werden allerdings wohl immer entweder die eine oder andere Version cachen.

        Hyper Cache kenne ich nicht so gut.

  2. Nutze die Funktion nun auch schon eine Weile. Hab diese durch Zufall entdeckt und spart mir den Einsatz von mobiledetect.net. wp_is_mobile funktioniert auch mit Windows Mobile gut. Was das Thema Cache angeht, da gibt es ja leider immer Probleme mit diversen Dingen die man nur bestimmten Usern anbietet, daher hab ich seit langem ein selbstgeschriebenes Cachesystem im Einsatz.

  3. Vielen Dank, diese Funktion kannte ich noch nicht. (auch das Plugin nicht) Aber ich werde sie auch ganz bestimmt freiwillig nicht verwenden, weil das Browser-Sniffing nicht verlässlich ist. Darauf sollte man hinweisen.

    z.B. MDN warnt: “It’s worth re-iterating: it’s very rarely a good idea to use user agent sniffing. You can almost always find a better, more broadly compatible way to solve your problem!” (https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent)

    Das kommt jetzt hoffentlich nicht abwertend rüber. Ich lese Deine Artikel gerne und lerne viel dazu. 🙂

  4. Die Funktion wp_is_mobile() ist eigentlich nur für den WordPress-internen Einsatz gedacht! Sie wird daher auch nicht in den Twenty *-Themes verwendet, wie man u.a. an dieser Trac-Diskussion sehen kann:
    https://core.trac.wordpress.org/ticket/26221

    Aufgrund der genannten Probleme, u.a. mit Caching, sowie der Beschränktheit der Funktion, ist es weit bessere, andere Bibliotheken bzw. Alternativen einzusetzen. U.a. “Mobble” Plugin, oder auch die Mobile-Bibliothek aus Jetpack, die wesentlich besser, weitläufiger ist und vor allem auch für den Frontend-Einsatz konzipiert wurde!

  5. Ich bevorzuge es lieber anhand von CSS-Klassen die Bildschirmbreite als Basis für derartiges zu verwenden. Dann gibt es weder mit Caching Probleme, noch traue ich den übermittelten User-Agent-Daten als Basis hierfür. CSS-Frameworks liefern für diese zwecke ja meist schon out of the boc die richtigen Klassen mit.

  6. […] noch ein Punkt zur technischen Seite des Bloggens: Vladimir hat mir klar gemacht, dass man gewisse Inhalte nur für mobile Geräte sichtbar oder unsichtbar machen kann – eine coole Sache, die ich dringend noch in meinem Blog einbauen will. Und auch […]

  7. Jemand eine Ahnung wie man einen Shortcode einbindet, bzw. so das der Shortcode nur auf Mobile angezeigt wird?

  8. Hi Vladimir,

    hast du wp_is_mobile() auch mit dem “Widget Logic”-Plugin getestet?

    Ich muss feststellen, dass diese Funktion in meinem Widget beim “Widget Logic”-Input nicht zuversichtlich greift.

    Auf deine Meinung freue ich mich.

    Besten Gruß,
    Jonathan

    1. Jetzt habe ich das Mobble-Plugin installiert. Die Funktion is_mobile() greift wo wp_is_mobile() nicht greift. Warum greift ein Core-Feature nicht, wohingegen ein Plugin die Lösung liefert?

Kommentare sind geschlossen.