Документация Сотбит: Оригами. Для разработчика. Кастомизация шаблона без потерь при обновлении решения. Шапка сайта

Шапка сайта

Для создания шаблона шапки сайта перейдите по пути: Рабочий стол > Контент > Структура сайта > Файлы и папки > local > template > sotbit_origami > theme > headers.

В открывшемся окне скопируйте имеющийся шаблон, например «1», в текущую папку.

Скопированная папка изначально содержит 2 файла:

1. content.php – содержит код шаблона.
2. preview.jpg – изображение шаблона в панели настроек.

При необходимости создайте дополнительные разделы для хранения стилей, изображений и скриптов.

Для подключения стилей и скриптов потребуется внести изменения в файл шаблона content.php, а именно:

1. Подключить пространство имен: use BitrixMainPageAsset;.
2. Подключить необходимые стили, например style.css.
3. Подключить необходимые скрипты, например custom.js.

Например:

use BitrixMainPageAsset;
Asset::getInstance()->addCss(SITE_TEMPLATE_PATH . "/theme/headers/custom_new_1/css/style.css");
Asset::getInstance()->addJs(SITE_TEMPLATE_PATH . "/theme/headers/custom_new_1/js/custom.js");

Подключите таким образом все необходимые файлы.

Для подключения файлов локализации перейдите по пути: Рабочий стол > Контент > Структура сайта > Файлы и папки > local > template > sotbit_origami > lang > ru > theme > headers.

В открывшемся окне скопируйте имеющийся раздел локализации, например «1», в текущую папку и переименуйте созданный раздел в соответствии с названием раздела шаблона, в нашем случае custom_new_1.

Важные моменты

• При использовании заимствованных элементов шаблона обратите внимание на используемые компоненты и используемые для них шаблоны.
• Шаблон содержит шапку как для десктопных так и для мобильных устройств.

Перечень используемых компонентов:

Для того, чтобы созданные шаблоны компонентов не удалялись в процессе обновления решения, поместите их в папку, поиск в которой осуществляется в первую очередь, в нашем случае:
/local/templates/sotbit_origami/components.

Пример пустой шапки:

<?php
if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();
global $APPLICATION;
global $USER;
use BitrixMainLocalizationLoc;
use SotbitOrigamiHelperConfig;

//css and Js connection
use BitrixMainPageAsset;
Asset::getInstance()->addCss(SITE_TEMPLATE_PATH . "/theme/headers/custom_new_1/css/style.css");
// style.css – созданный файл стилей в созданной папке «css»
Asset::getInstance()->addJs(SITE_TEMPLATE_PATH . "/theme/headers/custom_new_1/js/custom.js");
// custom.js – созданный файл скриптов в созданной папке «js»

//multiregion module check
$useRegion = (Config::get('USE_REGIONS') == 'Y') ? true : false;
?>

<div class='page'>
   <ваша фантазия> ... </ваша фантазия>

Видео с примером создания шапки сайта доступно по ссылке: Сотбит Оригами: Кастомизация шапки сайта