- Основні проблеми та причини їх появи
- Проблема 1. Багаторазова завантаження JS файлів.
- Проблема 2. «Непрацюючі» плагіни.
- Як уникнути цих проблем?
- Для довідки
- висновок
На жаль, іноді буває так, що є хороші і зручні інструменти, але з якихось причин ними користуються далеко не всі і не завжди. В результаті виникають проблеми, здавалося б, на рівному місці.
Цей движок надає зручну функцію wp_enqueue_script. З її допомогою можна забезпечити необхідний порядок підключення скриптів і, при цьому, гарантується, що один і той же скрипт буде підключений тільки один раз.
До речі, аналогічні можливості є і в різних фреймворків, наприклад, Yii .
Але різниця між фреймворком і WordPress в тому, що за допомогою останнього можна створити сайт, не читаючи документацію, у всякому разі, ту частину, яка стосується API. В цьому немає нічого поганого, але можна зіткнутися з деякими нюансами. Про них мова піде нижче.
Основні проблеми та причини їх появи
Візьмемо найпоширенішу ситуацію. Є сайт на WP, і є готовий JS скрипт, який потрібно до цього сайту підключити.
Що написано в інструкції по установці скрипта?
«Вставте тег <script ...> в заголовок сторінки (між <head> і </ head>)».
Тут все правильно. Розробник пише інструкцію загальний випадок, а не конкретно під WP.
Наступне питання. Де знаходяться теги <head> і </ head> в WP?
Зазвичай в файлі header.php поточної теми.
Тобто якщо робити строго по інструкції, то потрібно додати теги <script ...> в header.php.
Саме тут і виникають проблеми.
Точніше, якщо ваш JS скрипт не залежить ні від яких бібліотек, і не використовується ніякими плагінами, то все буде в порядку, але в іншому випадку ситуація складніша.
Проблема 1. Багаторазова завантаження JS файлів.
Виникає якщо підключити JS скрипт у файлі теми, а потім використовувати плагін, яким потрібен цей же скрипт. Найчастіше таке відбувається з JavaScript бібліотеками.
Розробники плагінів доступу до файлів вашої теми не мають, але повинні гарантувати підключення необхідних скриптів. Тому для них єдиним варіантом буде використання wp_enqueue_script.
В результаті один раз JavaScript файл підключається вашим тегом, другий - тегом, який додасть плагін. Це призводить до збільшення ваги сторінки, часу її завантаження, зростання трафіку сервера.
Проблема 2. «Непрацюючі» плагіни.
Випливає з першої.
Розглянемо невеликий приклад. Припустимо скрипти підключені в header.php наступним чином.
<Head> ... <script src = "... jquery.js" ...> </ script> <script src = "... jquery.my-plugin.js" ...> </ script> <? php wp_head (); ?> </ Head>Що станеться якщо якийсь з плагінів WP підключить jQuery?
Функція wp_enqueue_script додасть теги script там, де знаходиться виклик wp_head (). А це, крім повторного завантаження jquery, означає, що і об'єкт jQuery буде створений заново. І він буде використовуватися замість першого об'єкта, до якого підключили плагін.
В принципі, проблему можна вирішити так.
<Head> ... <? Php wp_head (); ?> <Script src = "... jquery.my-plugin.js" ...> </ script> </ head>Але якщо ви в адмінці WP вимкніть плагін, який використовує jQuery, то my-plugin.js також перестане працювати. Оскільки jQuery буде не підключена.
Як уникнути цих проблем?
Просто не чіпайте header.php. В папці з темою є файл functions. php в який потрібно додати наступний код.
<? Php if (! Is_admin ()) {function register_my_js () {wp_enqueue_script ( 'my-script', get_bloginfo ( 'template_directory'). '/ My-script.js', array ( 'jquery'), '1.0' , true); } Add_action ( 'init', 'register_my_js'); }?>Цей код підключить скрипт на всіх сторінках сайту, крім адмінки. Якщо потрібно підключати скрипт тільки на частині сторінок, можна в умова перевірки додати is_single (), is_home () і т.д.
Крім того, бібліотеку jQuery явно підключати не потрібно, тому що вона вказана в масиві залежностей (третій параметр wp_enqueue_script). WordPress підключить її сам до вашого плагіна.
Для довідки
Функція wp_enqueue_script підключає JS файл якщо він не був підключений раніше. Тобто можна викликати її кілька разів для одного і того ж скрипта і, при цьому, скрипт буде вставлений тільки один раз.
Параметри.
wp_enqueue_script ($ handle, $ src, $ deps, $ ver, $ in_footer);$ Handle - назва скрипта, має бути унікальним.
$ Src - URL скрипта. Якщо скрипт був попередньо зареєстрований за допомогою wp_register_script, то його вказувати не обов'язково.
$ Deps - масив залежностей (потрібно перерахувати назви JS скриптів, які повинні бути завантажені перед даними).
$ Ver - версія скрипта (необов'язковий).
$ In_footer - якщо дорівнює true, скрипт буде підключений в кінці сторінки, там де знаходиться wp_footer (). Зазвичай в файлі footer.php перед </ body>.
висновок
Дуже раджу почитати статтю Function Reference / wp enqueue script . Вона невелика, але в ній ви знайдете кілька цікавих прикладів. Наприклад, пояснюють як замінити версію бібліотеки jQuery, яка йде в дистрибутиві WP.
Цікаве в мережі.
Можливо, найоригінальніший подарунок: фруктові кошики з доставкою по Москві.
Технологія кейс-стаді : Відмінно працює при продажу послуг.
Як уникнути цих проблем?Що написано в інструкції по установці скрипта?
Де знаходяться теги <head> і </ head> в WP?
Gt; </ script> <?
Php wp_head (); ?
Lt;?
Php wp_head (); ?
Як уникнути цих проблем?
Lt;?
True); } Add_action ( 'init', 'register_my_js'); }?