CODEWITHSUNDEEP
phpiphonemobile
David Smith
David Smith

Reputation: 105

Change the header of the website if viewed from iPhone device?

I have a website that looks pretty good on mobile (iPhone devices). but the only thing that is off putting is the header when viewed on mobile!

the website is written in PHP. and the header of the site is template based. its called header.php in template folder.

i was wandering if it is possible to only change the header.php of the website if someone is viewing the site from a mobile phone instead of creating the whole site for mobile devices (mobile friendly website)?

I know I can divert the users to the mobile version of the website if i wanted to but I rather just change the header.php if someone's viewing it from a handset.

Thanks

EDIT

WOW GUYS, i'm spoilt for choices now. Thank you very much for all the answers.

can i select more than one answer here?

Upvotes: 1

Views: 1153

Answers (6)

Denis O.
Denis O.

Reputation: 1850

Try this

<?php
if(strstr($_SERVER['HTTP_USER_AGENT'],'iPhone') || strstr($_SERVER['HTTP_USER_AGENT'],'iPad')) {
  include "mobile_header.php";
} else {
  include "desktop_header.php";
}

?>

EDIT thanks to @silentboy for pointing my mistake. changed.

Upvotes: 3

brbcoding
brbcoding

Reputation: 13606

$useragent=$_SERVER['HTTP_USER_AGENT'];
if(preg_match('/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i',$useragent)||preg_match('/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i',substr($useragent,0,4)))
{
// display mobile header
}   
else{
// display standard header
}

Upvotes: 1

johnkoht
johnkoht

Reputation: 602

You can use the server-side solutions that were just proposed or you can use media-queries to change the styles of the header to fit mobile.

@media only screen and (max-device-width: 480px) {
  ...
}

Use this to add styles that are optimized for mobile. Either change the width, padding, sizes, etc. or you can hide certain markup that you don't want visible on mobile devices.

Just another option. :)

Upvotes: 0

PlantTheIdea
PlantTheIdea

Reputation: 16369

Have you heard of php-mobile-detect?

Makes it real easy to do this kind of stuff.

include 'Mobile_Detect.php';
$detect = new Mobile_Detect;
if($detect->isiPhone()){
    // require different header
} else {
    // require standard header
}

I would plug it into a $_SESSION variable and check it with if(!isset($_SESSION['iPhone'])) so its only called once. I do this kind of thing for different mobile operating system versions too, its very handy and they keep it up to date.

Upvotes: 1

Shlomo
Shlomo

Reputation: 3990

Parse $_SERVER["HTTP_USER_AGENT"]; for iPhone related strings.

Upvotes: 1

Joe
Joe

Reputation: 6416

You can use a device detection library for this and conditionally display the proper header file. Here is a good one: http://code.google.com/p/php-mobile-detect/.

Upvotes: 1

Related Questions