Textpattern plugin - detect mobile browser

Demo

Demo text below, use mobile device or simulator to view it:

Demo text start – – Demo text stop

pro_mobile:

Handy little wrapper tag to display different content/code to mobile browsers, needed it, made it, shared it :)

Version 0.3, iPad supported now!

pro_mobile_v0.3.txt

pro_mobile_v0.3_zip.txt

Option 1:

<txp:pro_mobile> // Show mobile content here </txp:pro_mobile>

Option 2:

Use as an if/else:

<txp:pro_mobile> // Mobile content here <txp:else /> // Regular content here </txp:pro_mobile>

Option 3:

Define custom content per browser

<txp:pro_if_mobile name="iPad" > You have an iPad lucky thing! </txp:pro_if_mobile>

Names available for you to use include:

  • iphone
  • ipod
  • ipad
  • aspen
  • nexus
  • dream
  • android
  • cupcake
  • blackberry9500
  • blackberry9530
  • opera mini
  • webos
  • incognito
  • webmate

Option 4:

Feel free to wrap tags!

<txp:pro_mobile> Welcome mobile user! <txp:pro_if_mobile name="opera mini"> You use opera mini, great browser! </txp:pro_if_mobile> <txp:pro_if_mobile name="android"> You use android, great browser! </txp:pro_if_mobile> <txp:else /> // normal content </txp:pro_mobile>

You can do a lot with media queries in the head of your textpattern page, see this article for code examples on how to create mobile version of your site with media queries alone, however there will still always be times you want a custom message, such as a custom Ipad message with instructions on how to add that page to the home screen etc. But I would recommend a heavy reliance on media queries over device ‘sniffing’ for your overall tactic, do post any questions/feedback here too!


/*********************

pro_mobile: by Hilary Quinn – www.proximowebdesign.ie

Released as a Textpattern plugin under the GNU General Public License

Version history: 0.3

******************************************/

function pro_if_mobile($atts, $thing=NULL) { //output content if browser type is specified

extract(lAtts(array( ‘name’ => ‘’, ),$atts)); $user_agent = strtolower($_SERVER[‘HTTP_USER_AGENT’]); if(strpos($user_agent, $name)) { return parse(EvalElse( $thing, true )); } return parse( EvalElse( $thing, false ) ); }

function pro_mobile($atts, $thing=NULL) { // output all mobile content

if ( pro_mobile_display() ) { return parse( EvalElse( $thing, true ) ); } return parse( EvalElse( $thing, false ) ); }

function pro_mobile_display($custom_agents = array()) {

$agents = array_merge($custom_agents, array( ‘iphone’, // Apple iPhone ‘ipod’, // Apple iPod touch ‘ipad’, // Apple iPad ‘aspen’, // iPhone simulator ‘nexus’, // Nexus One Android ‘dream’, // Pre 1.5 Android ‘android’, // 1.5+ Android ‘cupcake’, // 1.5+ Android ‘blackberry9500’, // Storm ‘blackberry9530’, // Storm ‘opera mini’, // Opera mobile ‘webos’, // Nokia Browser ‘incognito’, // Other iPhone browser ‘webmate’ // Other iPhone browser )); $user_agent = strtolower($_SERVER[‘HTTP_USER_AGENT’]); foreach($agents as $agent) if(strpos($user_agent, $agent)) return TRUE; }

Back to Top