Як додати умовну 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 ...). І я знаю, що це все-таки не друпальський спосіб .

2) Додавання до .info-файлу моєї теми:

scripts[] = selectivizr.js

Але тоді це безумовно, звичайно :(

3) Використання drupal_add_js () у моєму шаблоні.php .

Але знову ж таки, я не впевнений, що це можна встановити там умовно?

Відповіді:


3

Я думаю, що ваш 1) - найкращий варіант.

Вам не потрібно викликати жодну функцію, у вас уже є ці значення:

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

FYI, <?php dsm($variables) ?>у будь-якому файлі шаблону, щоб побачити, які змінні доступні. (із встановленим модулем devel)

Існує модуль таблиці умовних стилів, який має елегантне рішення для додавання умов 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

Я думав, що це було запечене, але помилявся.

Схоже, що тема материнства використовує цю бібліотеку.

Він робить щось трохи інакше, ніж ви, але по суті, ваш варіант 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.


Ви можете змінити жорстко кодований шлях бібліотеки, щоб використовувати бібліотеки_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.