1. 1С-Битрикс
  2. Добавить CSS или JavaScript-файл

Добавить CSS или JavaScript-файл

Сначала надо убедиться, что между тегами <head> присутствует метод $APPLICATION->ShowHead():

<head>
  <!-- ... -->
  <?php $APPLICATION->ShowHead(false); ?>
  <!-- ... -->
</head>

В данном месте загружаются CSS и JavaScript-файлы.

Параметр false в методе ShowHead() означает, что надо выводить теги по стандарту HTML5. Иначе будут выводиться по стандарту XHTML (будет добавляться закрывающий тег).

<!-- $APPLICATION->ShowHead(false) -->
<link href="path.css" type="text/css"  rel="stylesheet">

<!-- $APPLICATION->ShowHead() -->
<link href="path.css" type="text/css"  rel="stylesheet" />

Файлы подключаются через следующий код:

use Bitrix\Main\Page\Asset;

// Подключение CSS
Asset::getInstance()->addCss("/path/style.css");

// Подключение JavaScript
Asset::getInstance()->addJs("/path/script.js");

Методы $APPLICATION->SetAdditionalCSS() и $APPLICATION->AddHeadScript() являются устаревшими, и использовались до выходя ядря D7.

Объединять CSS и JavaScript в один файл

Файлы, подключенные через методы addCss() и addJs() по умолчанию объединяются в один CSS или JS-файл.

Если это не происходит, то надо убедиться, что в Настройки → Настройки продукта → Настройки модулей → Главный модуль в разделе «Оптимизация CSS» отмечены пункты Объединять CSS файлы и Объединять JS файлы.

Bitrix. Объединять CSS и JS файлы

Объединение нескольо файлов в один позволяет уменьшить количество запросов на сайт, и ускорить загрузку страницы.

Также при изменении CSS или JS-файла, обновится кеш «общего» файла, т.е. у пользователей будет загружаться актуальная версия CSS и JS.