Как установить шаблон на 1с битрикс. Создаем шаблон битрикс — быстрый старт. Условия применения шаблонов

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

Обычно для всех страниц используется одна схема, но 1С Битрикс позволяет одновременно пользоваться несколькими вариантами оформления .

При помощи встроенных инструментов можно задавать собственные шаблоны для всех разделов и даже страниц. Также можно задавать различные условия для вывода той или иной схемы. Настройки производятся через панель администратора.

Шаблоны страниц хранятся в одноименной папке «templates». В визуальном редакторе достаточно выбрать из списка необходимый вариант и дополнить его нужными данными. Особенность шаблонизации – отделение логики от представления.

Кому и зачем нужны шаблоны?

Система Битрикс позволяет создавать и использовать предварительно заготовленные шаблоны, применяя их к рабочим областям.

Это практичное и эффективное решение при работе с многокомпонентными страницами со сложной структурой, например при работе с интернет-магазином или новостным порталом.

Преимущества правильно подобранного шаблона:

• Первое впечатление. Дизайн сайта дает понять, на чем специализируется компания и формировать благоприятное впечатление.
• Запоминаемость. Сайт ассоциируется с конкретной компанией и остается узнаваемым.
• Целостность. Шаблон должен быть прописан до мелочей, представляя собой гармоничную картину.
• Функциональность. Привлекательность сочетается с юзабилити и практичностью.

Самостоятельное создание шаблона для 1С Bitrix

Структура шаблона 1С Битрикс представляет собой совокупность файлов и папок. В основной директории хранится описание и общая информация для административного раздела. Иногда там же приписываются некоторые дополнительные функции.

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

Основные разделы сайта также представлены в виде соответствующих директорий. Основа шаблона 1С Битрикс – файлы header и footer. В них прописывается код, подключается вызов расширений, CSS и другие функции.

Динамическое содержимое включается в шаблон с директивами Битрикс Фреймворк. Здесь задаются PHP-вставки, вызывающие специальные компоненты Битрикс.

Сперва задаются заголовок, иконки, таблицы каскадных стилей, теги и другие базовые параметры. После этого необходимо определить месторасположение административной части. Все рабочие изображения лучше размещать в одной определенной папке.

Нумерованный список с меню заменяется вызовом компонента Битрикс для создания и редактирования пунктов. В виде компонентов создано и большинство других стандартных элементов.

Для размещения необходимого расширения на предварительно выбранное место страницы вставляется код его вызова. Изначально он находится в документации пользователя или во вкладке визуального редактора.

Еще один важный аспект – CSS-файлы шаблона. Изначально их три: основной и два вспомогательных для оформления содержимого. Но это разграничение очень условно, ведь все элементы тесно взаимосвязаны между собой.

Как установить шаблон?

Установка готового шаблона производится по следующей схеме:

В разделе с шаблонами панели администратора необходимо выбрать кнопку «добавить»;

Форма создания стандартна: в ней задается ID, название и описание;

При работе с html важно четко разделять элементы, относящиеся к оформлению и контенту;

В поле редактирования вставляется директива work_area, куда копируется шаблон;

При наличии CSS необходимо перейти во вкладку стилей, куда и вставляется код;

Можно сохранить результат и оценить полученную работу.

Заключительная часть – указание всех переменных Битрикс, которые прописываются в файле header. Важно не забывать редактировать пути в CSS и сохранять промежуточные результаты. После этого можно применить шаблон к сайту, выбрав его в соответствующем списке в настройках продукта.

Выводы

Шаблоны 1С Битрикс достаточно практичны и функциональны. Их использование значительно упростит и ускорит разработку проекта. Можно приобрести готовые шаблоны на сайте компании.

Во второй статье, посвященной шаблонам битрикс, мы поговорим об управлении шаблонами, опишем процесс установки нового шаблона, а также расскажем, как настроить отображение различных шаблонов для разный страниц и разделов.

Шаблон битрикс — это набор php-файлов, файлов стилей, изображений, а также шаблонов компонентов. Все шаблоны расположены в папке /bitrix/templates/ и могут применяться как один шаблон к нескольким сайтам, так и несколько шаблонов к одному сайту. На странице Настройки → Настройки продукта → Шаблоны сайтов в административной панели отображается список доступных в системе шаблонов.

Установка нового шаблона

Шаблон битрикс представляет собой архив.tar.gz, содержащий все необходимые php-файлы, файлы стилей, скрипты и картинки. Установить новый шаблон можно, как просто распаковав архив в папку /bitrix/templates/, так и воспользовавшись формой на странице Настройки → Настройки продукта → Шаблоны сайтов в административной панели битрикс. На этой странице необходимо нажать на кнопку Загрузить шаблон, выбрать на локальном диске архив с шаблоном и ввести символьный код шаблона.

На рисунке 1 показан список шаблонов в административной панели, на рисунке 2 — форма добавления нового шаблона.

После гарузки архива он автоматически распакуется в папку /bitrix/templates/ и будет отображаться в списке шаблонов в админке.

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

Применение шаблона к текущему сайту

После того, как шаблон загружен и добавлен в систему, его можно применить к одному из сайтов. Для этого необходимо в административной панели на странице Настройки / Настройки продукта / Список сайтов выбрать сайт, для которого должен быть применен шаблон (на рисунке 3 показан список сайтов в админке).

Откроется форма настройки сайта. Последними параметрами этой формы являются настройки шаблонов сайта. Здесь можно выбрать один или несколько шаблонов, которые будут применяться для данного сайта.

Условия применения шаблонов

Для того, чтобы в рамках одного сайта при разных условиях использовались разные шаблоны, на форме настройки сайта можно указать условия применения шаблона. В системе предусмотрены следующие типы условий: Для папки или файла, Для групп пользователей, Период времени, Параметр в URL, Выражение PHP. Рассмотрим каждое из них детальнее:

Для папки или файла — это условие следует применять, когда разные шаблоны должна применяться для разный страниц и разделов. Для того, чтобы шаблон применялся только для раздела личного кабинета пользователя, в качестве значения этого условия следует указать — “/personal/” — путь к разделу от корневой папки, в котором находится раздел “Личный кабинет”. Если шаблон должен отличаться только для страницы с 404 ошибкой, в качестве значения условия следует указать — “/404.php”.

Для групп пользователей — частая задача, когда внешний вид сайта должен отличаться для менеджеров и обычных посетителей, решается с помощью условия этого типа. В качестве значения свойства следует указать группу пользователей, например, “Контент-редакторы”. Посетитель, авторизованный как пользователь из группы Контент-редакторы будет видеть другой внешний вид сайта, нежели все остальный посетители.

Период времени — хороший пример использования данного условия — новогодняя тема для сайта. Если новогодний шаблон должен применяться на сайте в течении периода времени с 25 декабря по 10 января, нужно указать этот диапазон в качестве згначения условия типа Период времени. После окончания периода шаблон автоматически сменится на шаблон по умолчанию.

Параметр в URL — чаще всего этот тип условия условия используется для создания версии для печати или для тестирования шаблона. Для создания использования шаблона для печати в качестве значения условия этого типа следует указать “print=Y”. Для тестирования нового шаблона в качестве условия можно указать “test=Y” — и на любой странице, если передан параметр test равный Y будет использоваться тестовый шаблон.

Выражение PHP — в качестве значения этого условия может выступать любое выражение PHP, функуия API Битрикс.

Шаблоны сайтов применяются в соответствии со значением индекса сортировки. Если для страницы может быть использовано несколько шаблонов, будет выбран тот, что имеет больший индекс сортировки. Поэтому внимательно указывайте сортировку шаблонов — неправильная расстановка индексов сортировки может привести к неприятным ошибкам.

Не забывайте, что “не следует множить сущее без необходимости”, т.е., если какую-то задачу возможно решить без создания дополнительного шаблона, то лучше дополнительный шаблон не создавать. Это связано с тем, что копируя шаблон для внесения незначительных изменений, вы вынуждаете себя поддерживать несколько одинаковых файлов, одновременно вносить правки в несколько шаблонов.

Итак, мы рассмотрели процесс управления шаблонами: загрузку в систему нового шаблона, применение шаблона к сайту, условия применения разных шаблонов на странице. В следующих статьях мы перейдем непосредственно к созданию собственного шаблона.

• Tutorial

В очередной раз, пытаясь найти себе программиста, который работал с CMS 1C-Bitrix с своем городе натыкаюсь на проблему…

Программисты есть, работавшие с разными бесплатными фреймворками по типу Joomla, WordPress и т.д., но когда дело доходит до Битрикса, все как один говорят: - «Ой, она платная, зачем мне это когда есть куча других бесплатных». И не хотят браться за изучение чего то нового.

Так начинал и я, за исключение одного, мне сразу показали, как что и почему. Но материала в сети и на хабре я так и нашел. По этому начну с простого, как обычному программисту владеющим знаниями PHP и хотя бы базовыми HTML, CSS, JS начать работать c Битрикс.

Про структуру каталогов шаблона говорить не буду, об этом можно почитать . Первое, с чем приходится сталкиваться, это интеграция HTML шаблона на CMS.

Допустим, у вас есть готовый HTML шаблон и вам его необходимо интегрировать с системой. Начнем с установки на сервер:

Все на этом этап установки заканчивается, переходим непосредственно к интеграции шаблона. Заходим в панель администрирования в раздел «Настройки». Далее спускаемся по дереву настоек: Настройки продукта - Шаблоны сайтов, жмем на кнопку «Добавить шаблон»

Открывается стандартная форма создания шаблона.

Придумываете ID (я обычно использую main), вписываете название шаблона. Поле «Описание» не обязательно, оно скорее сделано для разработчиков, чтоб не путать шаблоны, если их несколько.

Вот тут началось самое интересное. Обычно шаблон HTML страниц выглядит следующим образом:

... ... ... ... ...
Тут главное понимать, что относится к шаблону, а что к контентной части. В данном примере контентная часть начинается между тегом section . Поэтому копируем шаблон в поле «Внешний вид шаблона сайта». Между тегом вставляем служебную директиву #WORK_AREA# . В итоге ваш шаблон будет выглядеть вот так:

... ... ... #WORK_AREA# ...
Если у вас есть CSS, то переходим на вкладку «Стили шаблона» и вставляем его туда.

Далее, я обычно редактирую файлы уже через FTP. Открываете свой текстовый редактор (у меня Notepad++, поэтому буду писать не его примере) и заходите на сервер. Весь шаблон Битрикс располагается по адресу /bitrix/templates/название_шаблона/ , если у вас есть картинки или дополнительные файлы стилей, JS скрипты и т.д., то копируете всё в эту папку.

Переходим к заключительной части и прописываем все необходимые переменные Битрикса. Открываем файл header.php и начинаем редактировать. Первое что нужно сделать это, подключить вывод шапки сайта:

… …
Так же мы хотим видеть панель администратора сайта в публичной части сайта:

… … …
Чтоб отображался заголовок страницы, добавляем функцию в соответствующий тег. В итоге мы получаем вот такой файл:

... ... ...
Кстати забыл сказать, если всё таки есть дополнительные файлы, будь то JS, CSS, favicon и так далее, то чтоб не прописывать полный длинный путь /bitrix/…/ есть специальная константа SITE_TEMPLATE_PATH . Её и вставляем на нужные места:

- вместо удаленных в секции head метатегов, заголовка, подключений css файлов размещаем вызовы функций битрикс, которые будут динамически формировать эти данные

В footer.php целиком записываем 3ю часть
- ко всем относительным путям добавляем /bitrix/templates// Например, было