I'd like to use Selectivizr script to emulate CSS3 selectors in IE6-8.

But I'm having a hard time adding it to my theme. So far tried:

1) Forcing this into html.tpl.php head section:

<!--[if lt IE 9]>
<script src="<?php print base_path() . path_to_theme(); ?>/js/selectivizr.js"></script>

But base_path() doesn't seem to return anything in D7 (at least in html.tpl.php - maybe in page.tpl.php...). And I know this isn't the Drupal way to do it anyway.

2) Adding to my theme's .info file:

scripts[] = selectivizr.js

But then it's unconditional, of course :(

3) Using drupal_add_js() in my template.php.

But again, I'm not sure that it can be set conditionally there?


I think your 1) is the best option.

You don't need to call any function, you have already those values:

<script type="text/javascript" src="<?php print $base_path . $directory; ?>/js/selectivizr.js"></script>

FYI, <?php dsm($variables) ?> in any template file to see what variables are available. (with devel module installed)

There is a module Conditional Stylesheets that has a elegant solution for adding IE conditions in the .info file, but still only for CSS. (see feature request for JS)


This is how I've added html5shiv in my template.php file:

$html5shiv = array(
  '#tag' => 'script',
  '#attributes' => array( // Set up an array of attributes inside the tag
    'src' => drupal_get_path('theme', 'mythemename') . '/js/lib/html5shiv.js', 
  '#prefix' => '<!--[if lte IE 8]>',
  '#suffix' => '</script><![endif]-->',
drupal_add_html_head($html5shiv, 'html5shiv');
  • 4
    A couple of changes: add '#value' and set it to '' then change '#suffix' to just be '<![endif]-->' to get standards compliant markup.
    – Angry Dan
    Aug 20 '13 at 9:25
  • Edited in @AngryDan's suggestion. Sep 5 '14 at 15:00

I thought this was baked in but was wrong.

It looks like the mothership theme uses this librabry.

IT does things a little differently from you but essentially does your option 1

  $vars['selectivizr'] = '<!--[if (gte IE 6)&(lte IE 8)]>';
  $vars['selectivizr'] .= '<script type="text/javascript" src="/sites/all/libraries/selectivizr/selectivizr.js"></script>';
  $vars['selectivizr'] .= '<![endif]-->';

Looks like this code won't work if your site is not under /

But if the library is needed for your theme I don't see a problem with putting the conditional code into the page.tpl.php file.

  • You could change the hard coded libraries path to use libraries_get_path() if you are using the libraries api, or drupal_get_path() if you aren't. Aug 27 '13 at 2:53

I would use drupal_add_html_head() in your template.php. Unfortunately, #865536: drupal_add_js() is missing the 'browsers' option


If your JS file has no dependencies, it can be included just like this in head tag of HTML:

$selectivizr = array(
  '#tag' => 'script',
  '#attributes' => array(
    'src' => file_create_url(drupal_get_path('theme', 'theme_name') . '/js/lib/selectivizr.js'),
  '#prefix' => '<!--[if lte IE 9]>',
  '#suffix' => '</script><![endif]-->'
drupal_add_html_head($selectivizr, 'selectivizr');

If you have, let's say, jQuery dependency, it makes sense to put your code to bottom of the page:

function THEMENAME_preprocess_html(&$vars){
  $vars['page']['page_bottom']['jquery_dependent_js'] = array(
    'footer' => array(
      '#type' => 'markup',
      '#markup' => '<!--[if lte IE 9]><script src="' .
        file_create_url(drupal_get_path('theme', 'theme_name') . '/js/lib/jquery_dependent_js.js'). '"></script><![endif]-->',
  • There is an extra script tag in your first code block, in the #suffix key. Apr 13 '17 at 11:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.