User login

Serving up a different page.tpl.php for different browser types (i.e., IE6) with your Drupal theme

if you figure out just the most major IE issues
that would be good enough

I was able to figure out some CSS background image display problems, but the frustrating failure of columns (right column dropping below all content, left column being pushed out in front of the main content with narrow displays.)

This latter is a problem in all of bluebreeze, incidentally.

And after a lot of mucking around (but I should have tested Agaric's InternetBarContest.com, also modeled on bluebreeze, and even better, the Zen theme on which bluebreeze itself is based).

In any case, Agaric ended up taking the emergency route:
http://www.dvessel.com/node/82

Both the below approaches include downloading browser_detection.php available via dvessel's post referenced above. I wonder if LGPL licensed code can be included on Drupal.org?

Agaric's simple, direct page.tpl.php swapping based on browser

Just need to take the browser detection capability above and combine it with a way to swap page template file. (In Drupal, page.tpl.php controls presentation of the whole site; it is the highest-level template for outputting HTML.)

Ah, the solution, from Nick Lewis, one of the lesser but more storied Drupal gods:
http://www.nicklewis.org/using-php-to-dynamically-switch-drupal-themes-and-templates

That method replaces the entire contents of page.tpl.php (copy-paste or cp to page-normal.tpl.php first!) with a call to the page.tpl.php replacement you want. Agaric's tested and approved mashup of the above techniques:

<?php
include('browser_detection.php');
if ((browser_detection('browser') == 'ie' ) &&
            (browser_detection('number') >= 5 ) &&
            (browser_detection('number') < 7  )) {
  include "page-ie.tpl.php";
  return;
} else {
  include "page-normal.tpl.php";
  return;
}
?>

Note: As the above will be the entire contents of our page.tpl.php file, include the top, opening <?php but not the closing ?>

Bonus: Agaric's Drupal 5 way to display different page templates by browser detection

I'm quite certain there's a better way than the above, that uses template.php overriding some function.

But, that seems to involve overriding http://api.drupal.org/api/function/phptemplate_page/5 or http://api.drupal.org/api/function/phptemplate_page/5

Ooh, I see the relatively clean way.

http://api.drupal.org/api/function/_phptemplate_default/5

<?php
/**
 *  Check for page templates ending in 'ie' if the browser is IE 5 or 6.
 *
 *  The way this works:  It overrides _phptemplate_default for page hooks,
 *  and adds '-ie' before the '.tpl.php' extension for all suggestions.
 *  Therefore it will use a page-front-ie.tpl.php if available, but if not it will
 *  fall back on page-ie.tpl.php -- NOT page-front.tpl.php
 */
function _phptemplate_page($variables, $suggestions = array(), $extension = '.tpl.php') {
  global $theme_engine;

// see http://www.dvessel.com/node/82
// this should probably be done as its own variable, or even in template.php
// as a global variable, so it's available for CSS switching for instance
include('browser_detection.php');
$win_ie56 = (browser_detection('browser') == 'ie' ) &&
            (browser_detection('number') >= 5 ) &&
            (browser_detection('number') < 7  );
if ($win_ie56) {
  $extension = '-ie' . $extension;
}
           
  // Loop through any suggestions in FIFO order.
  $suggestions = array_reverse($suggestions);
  foreach ($suggestions as $suggestion) {
    if (!empty($suggestion) && file_exists(path_to_theme() .'/'. $suggestion . $extension)) {
      $file = path_to_theme() .'/'. $suggestion . $extension;
      break;
    }
  }

  if (!isset($file)) {
    if (file_exists(path_to_theme() ."/$hook$extension")) {
      $file = path_to_theme() ."/$hook$extension";
    }
    else {
      // there won't be any -ie files in the engine, set back to normal
      $extension = '.tpl.php';
      if (in_array($hook, array('node', 'block', 'box', 'comment'))) {
        $file = path_to_engine() .'/'. $hook . $extension;
      }
      else {
        $variables['hook'] = $hook;
        watchdog('error', t('%engine.engine was instructed to override the %name theme function, but no valid template file was found.', array('%engine' => $theme_engine, '%name' => $hook)));
        $file = path_to_engine() .'/default'. $extension;
      }
    }
  }

  if (isset($file)) {
    return call_user_func('_'. $theme_engine .'_render', $file, $variables);
  }
}
?>

And that snippet should work GREAT for PHP5! Too bad the damn site we need to hack to work in IE6 is 4.7.

So back to the hackier way.

Other notes

Possibility-- for IE6 give a "Get Firefox" button and a switch theme button
(as discussed here: http://drupal.org/node/78689)

http://drupal.org/project/switchtheme

Another approach uses entirely different themes per device:
Creating Mobile Sites in Drupal Using Multisites | dev.mobi
http://dev.mobi/node/153

(add this how-to to the questions posted to Agaric under "Left column...")

Resolution

Searched words: 
drupal browser detection switch theme php browser detect and change theme presented Drupal return different theme for mobile browsers Drupal template.php switch page.tpl.php IE6 overlap on narrow screens Microsoft Internet Explorer 6 is evil

Comments

Post new comment

The content of this field is kept private and will not be shown publicly.
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
  • You can use Markdown syntax to format and style the text. Also see Markdown Extra for tables, footnotes, and more.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <blockquote> <small> <h2> <h3> <h4> <h5> <h6> <sub> <sup> <p> <br> <strike> <table> <tr> <td> <thead> <th> <tbody> <tt> <output>
  • Lines and paragraphs break automatically.

More information about formatting options

By submitting this form, you accept the Mollom privacy policy.