Wie kann ich für meinen Blog herausfinden, ob ein Betrachter meiner Webseite eines der vielen Smartphones benutzt, die ja heute mehr denn je verwendet werden, oder ob er mit einem Laptop oder PC unterwegs ist? Ich war gestern vor einem kleinen Problem gestanden und überlegte, wie kann ich anhand von php und den Möglichkeiten von WordPress mobile Browser erkennen.

Mobile Browser erkennen

Jetzt fragt sich sicherlich mancheiner, warum sollte mich das denn interessieren, ob da jetzt jemand mit einem iPhone, einem Android oder einem der vielen Tablets auf meiner Seite umhersurft. Mir geht es darum, dass ein mobile Browser Surfer auf my-websites.de landet, einen anderen Content ausgeliefert bekommt, als ein PC-Besucher. Im Headerbereich erwartet den normalen Besucher ein Leaderboard Werbebanner im Format 728×90 px und der sprengt in der Regel den Rahmen des darstellbaren auf einem Phone. Also muss ich für mobile Browser ein anderes Werbebanner Format ausliefern, welches einfach kleiner ist.

Codesnippets für mobile Browser

Mit einer einfachen Funktion, die ich in der functions.php meines Themes unten reingeschrieben habe und einer simplen if-Abfrage in der header.php, klappt das mobile Browser erkennen. Sicherlich werden noch nicht alle mobilen Browser erkannt, aber die Mehrheit sollte mit dem folgenden Code-Schnippseln erkannt werden. Die Liste innerhalb des preg_match lässt sich allerdings auch beliebig erweitern, und wem mehr Handys und mobile Browser einfallen, der kann diese dort ja noch eintragen.

In der functions.php des aktuell verwendeten Themes diesen Code unten einfügen:

function find_mobile_browser() {
    if(preg_match('/(iphone|ipad|ipod)/i', $_SERVER['HTTP_USER_AGENT'])) {
        return true;
    } else {
        return false;
    }
}

Hier eine Liste der möglichen Browser, die sich sicherlich noch erweitern lässt:

  • alcatel
  • android
  • blackberry
  • benq
  • cell
  • elaine
  • htc
  • iemobile
  • j2me
  • java
  • midp
  • mini
  • mobi
  • motorola
  • nokia
  • palm
  • panasonic
  • philips
  • phone
  • sagem
  • sharp
  • smartphone
  • sony
  • symbian
  • t-mobile
  • up\.browser
  • up\.link
  • vodafone
  • wap
  • wireless
  • xda
  • zte

und in der header.php

$mobile_browser = find_mobile_browser(); 
if($mobile_browser) { 
    echo "Hallo Handy"; /* Wenn mobile Browser gefunden, dann tue dies */ 
} else { 
    echo "Hallo PC"; /* Ansonsten tue das */ 
}

Und schon kann ich für die verschiedenen Webseiten Nutzer, ob mit mobile Browser oder ganz altmodisch vom PC, andere Werbebanner ausliefern. Das Ganze eingnet sich natürlich nicht nur für Werbebanner, ich denke mal, die Einsatzmöglichkeiten sind sicherlich unbegrenzt erweiterbar und für viele Beispiele nutzbar. Mir geht es aber hier erstmal nur um die Auslieferung der passenden Werbung.

Update 10.5.2016

Mittlerweile bin ich auf eine einfachere Methode umgestiegen und habe mir die Mobile Detect Class eingebaut ( Developers: Șerban Ghiță, Nick Ilyin ).

Diese „lightweight PHP class for detecting mobile devices“ findet man hier. Der Einbau geht recht schnell und auch die Codebeispiele, damit das Ganze richtig eingebunden wird, sind einfach und leicht verständlich.

/* Einbinden der entsprechenden Klasse */
require_once 'Mobile_Detect.php';

$detect = new Mobile_Detect;

if ( $detect->isMobile() ) {
    echo "Hallo Handy oder Tablet"; /* Wenn Handy oder Tablet gefunden, dann tue dies */
}

if( $detect->isTablet() ){
    echo "Hallo Tablet"; /* Wenn Tablet gefunden, dann tue das */
}

if( $detect->isiOS() ){
    echo "Hallo Apple Produkt"; /* Wenn iPad, iPhone oder iPod gefunden, dann tue dies */
}

if( $detect->isAndroidOS() ){
    echo "Hallo Android Produkt"; /* Wenn Android Smartphone oder Tablet gefunden, dann tue das */
}