Как добавить условный JavaScript в тему?


10

Я хотел бы использовать скрипт Selectivizr для эмуляции селекторов CSS3 в IE6-8.

Но мне трудно добавить это в мою тему. Пока попробовал:

1) Принудительно это сделать в разделе заголовка html.tpl.php:

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

Но base_path (), похоже, ничего не возвращает в D7 (по крайней мере, в html.tpl.php - может быть, в page.tpl.php ...). И я знаю, что это не Drupal способ сделать это в любом случае.

2) Добавление в .info файл моей темы:

scripts[] = selectivizr.js

Но тогда это безоговорочно, конечно :(

3) Использование drupal_add_js () в моем template.php.

Но опять же, я не уверен, что это можно установить там условно?

Ответы:


3

Я думаю, что ваш 1) является лучшим вариантом.

Вам не нужно вызывать какую-либо функцию, у вас уже есть эти значения:

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

К вашему сведению, <?php dsm($variables) ?>в любом файле шаблона, чтобы увидеть, какие переменные доступны. (с установленным модулем devel)

Существует модуль Conditional Stylesheets, который имеет элегантное решение для добавления условий IE в файл .info, но все же только для CSS. (см. запрос функции для JS)


15

Вот как я добавил html5shiv в мой файл template.php:

$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
Пара изменений: добавьте «#value» и установите его в «», затем измените «#suffix» на «<! [Endif] ->» для получения разметки, соответствующей стандартам.
Злой Дэн

Отредактировано в предложении @ AngryDan.
wizonesolutions

1

Я думал, что это было испечено, но было неправильно.

Похоже, что тема Mothership использует эту библиотеку.

Это делает вещи немного по-другому от вас, но по сути делает ваш вариант 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]-->';

Похоже, этот код не будет работать, если ваш сайт не находится в /

Но если библиотека нужна для вашей темы, я не вижу проблемы с помещением условного кода в файл page.tpl.php.


Вы можете изменить жестко закодированный путь к библиотекам, чтобы использовать library_get_path (), если вы используете библиотеки api, или drupal_get_path (), если вы этого не делаете.
ведущий


1

Если ваш JS-файл не имеет зависимостей, его можно включить так же, как это в заголовок 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');

Если у вас есть, скажем, зависимость jQuery, имеет смысл поместить ваш код внизу страницы:

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]-->',
    )     
  );
}

В вашем первом блоке кода, в ключе #suffix, есть дополнительный тег сценария.
Pol Dellaiera
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.