Albireo CMS 2025.01.17

Работа с JavaScript в Albireo CMS

В большинстве случаев работа с JavaScript сводится к подключению js-файла. Для этого используется два поля:

# подключение файла в секции HEAD
js.head[]: my.js

# подключение в конце BODY
js.lazy[]: my.js

Файлы должны располагаться в assets/js шаблона.

Также можно подключить js-файл напрямую в HEAD или в конце BODY:

js.head.url[]: полный путь к файлу
js.lazy.url[]: полный путь к файлу

Часто нужно подключить не просто js-файл, а некую js-библиотеку и инициализировать её. Если она часто используется на сайте, то удобно вынести её в ресурсы _resources, а подключение через опцию сделать в parts-файле.

Например вот так сделано подключение Alpine JS (parts/head/alpine.php)

// use.alpine: +
// use.alpine.old: +

if (checkStr(getPageData('use.alpine', false)) === true)
    echo '<script src="' . RESOURCES_URL . 'alpine/alpine.min.js" defer></script>';
elseif (checkStr(getPageData('use.alpine.old', false)) === true)
    echo '<script src="' . RESOURCES_URL . 'alpine/alpine282.min.js" defer></script>';

Когда появится новая версия Alpine JS, то будет достаточно только обновить её в каталоге ресурсов, не затрагивая файлы шаблона.

Бывают ситуации, когда js-библиотека имеет достаточно сложный код использования. В этом случае в parts-файле делается только подключение, а код инифиализации прописывается уже в теле страницы как SCRIPT. Например слайдер tiny-slider имееет очень много настроек, поэтому проще прописать SCRIPT именно возле самого html-блока.