Creating Browser Specific Drupal Template Pages

I have a client who absolutely insists that the ie6 layout and mouseover issues must be resolved.
I did some of the usual tricks but found that I needed to change the HTML markup in order to really get it right.
My decision? I needed to use a tpl.php template page that would only apply to ie6.
My front page at www.genesisplasticswelding.com has some background transparent png files that swap on mouseover. I could NOT get these to work in ie6.
So I went into the page-front.tpl.php and at the VERY TO I entered this lines including the opening and closing PHP tags.  

<?php
        $browser_ss = $_SERVER['HTTP_USER_AGENT'];
        if(strpos($browser_ss, 'Windows') && strpos($browser_ss, 'MSIE 6.0')){
          include'ie6-front.tpl.php';
return"";
        }
?>

What does this snippet do?
Simple... It looks at the browser and OS and IF its ie6 then it INCLUDES a completely different template page. If that was all I did then it would proceed to process the remainder of the original page-front.tpl.php
SO.... I put in a
return"";
Once the templating engine hits that return statement, it ceases to do anything else with this document

Recap:
0 copy the normal tpl.php file to the ie6 name. For me I copied page-front.tpl.php to ie6-front.tpl.php
1 place the above php at the VERY TOP of the page for which you need to offer an ie6 version. For me the code went atop my page-front-tpl.php
2 change the include name to be something unique. Normal php template file names are not needed. You could just as easily call the file other.tpl.php [remember this is not part of the naming conventions of the php template system, we have made our own handlers for this. :-)
3 Edit your ie6 version and be as JIGGY As U WunnaBe! For me, I'm using inline styles, maybe even a table layout! Yes! I can do what ever I want because these pages will only be rendered for real live users STUCK with ie6. There is no google indexing of this or any other rank based operation.

Enjoy!
If you found this helpful, please drop a line. I'd love to hear how you got you out of a bind like it did for me!
Alternately... If you have a different solution.. I'm all ears too!

- Doug Vann
- www.dougvann.com
- www.twitter.com/dougvann

Comments

Hey thanks for writing this up Doug, this seems really useful for those bugs you just can't get right, or where it would be easier and more time efficient to change the markup. Doing this with a preprocess function, even sweeter, thanks for working on this guys!

At least for Drupal 6, anyway, using the preprocess functions. Haven't tested it, but it should work.


<?php
function [theme_name]_preprocess_page(&$variables) {
$browser_ss = $_SERVER['HTTP_USER_AGENT'];
if(drupal_is_front_page()
&& strpos($browser_ss, 'Windows')
&& strpos($browser_ss, 'MSIE 6.0')){
$variables['template_file'][] = 'ie6-front';
}
}
?>