DLE-Asset — Автозавантаження стилів і скриптів в шаблон



Подібний модуль я вже дуже давно використовую в проектах і тепер вирішив реалізувати його і для DLE. Уявіть ситуацію, коли вам потрібно створити новий шаблон, з безліччю різних скриптів, стилів до них. Звичайно підключити один раз вручну все це не складно, але як бути коли це потрібно робити постійно, приміром, ви пробуєте використовувати jquery-плагін мобільного меню, підключаєте js і css, налаштування, тестування і розумієте, що цей плагін не підходить, видаляєте і виробляєте повторне підключення вже іншого плагіна, знову js і css. Знову тести і начебто все підходить, але через тиждень розумієте, що цей плагін містить баг під iOS, який усунути неможливо в розумні часові рамки. Прикручуєте 3й, 4й, 5й скрипти, доповнюєте каруселькой, кастомным скроллом, все вручну… А після того, як все готово треба б зробити оптимізацію та включити стиснення і об’єднання css і js. І тут знову все в ручну зібрати, і через тиждень наткнутися на необхідність видалити або додати, і знову вручну. Мені особисто це набридає після 2й спроби.

При використанні модуля, все що потрібно для підключення скриптів і стилів — прописати шлях до папки або папки, що містить js і css-файли, решта DLE-Asset зробить сам, причому спочатку підключаться всі скрипти, а потім уже стилі, а коли ви в адмінці відзначите галочку стиснення js і css — сам збере потрібні рядки для передачі в клас минификации.

Призначення та особливості
Модуль призначений для автоматичного підключення файлів скриптів і стилів шаблону сайту під управління CMS DataLife Engine.

При формуванні html-коду враховується час останньої зміни кожного файлу і приписуються відповідні параметри, таким чином немає необхідності кожен раз при зміні css або js поновлювати кеш браузера.

При формуванні html-коду враховуються налаштування стиснення і об’єднання скриптів і стилів і модуль сам формує коректний код згідно з налаштуваннями DLE.

Вимоги до встановлення

  • Версія DLE: 9.x і вище.

Установка

  • Завантажити актуальну версію DLE-Asset
  • Розпакувати вміст папки upload в корінь сайту.
  • Відкрити {THEME}/main.tpl і в потрібному місці, перед закриваючим тегом head вставити строкку підключення модуля:
    {include file=”engine/modules/asset/add.php?folder={THEME}/css/”}
    {include file=”engine/modules/asset/add.php?folder={THEME}/js/”}Або одним рядком:
    {include file=”engine/modules/asset/add.php?folder={THEME}/css/,{THEME}/js/&ignore=main”}Де
    folder — шляху від кореня сайту до папок, що містять css і js файли. Якщо необхідно вказати кілька шляхів, то вони перераховуються через кому. Вкладені папки не враховуються.
    ignore — префікси імен файлів, які будуть виключені з обробки. За замовчуванням використовуються два символів “-” і “_”, якщо необхідно виключити ще якісь файли, то достатньо прописати початок назв цих файлів через кому. Така поведінка корисно, коли потрібно гарантовано прописати підключення окремих файлів на початку або в кінці інших (наприклад основний файл зі скриптами сайту як правило підключається після всіх використовуваних бібліотек).
  • Готово! Залишається покласти в зазначені папки потрібні скрипти і стилі і вони автоматично підключаться до шаблону, і об’єднаються в один файл при необхідності.

40