Найти тему

Интеграция шаблона сайта в 1С-Битрикс

Оглавление
a href='httpsru.freepik.comphotosman'Man фото создан(а) rawpixel.com - ru.freepik.coma
a href='httpsru.freepik.comphotosman'Man фото создан(а) rawpixel.com - ru.freepik.coma

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

Часть 1.

Создаём папку и добавляем код

Заходим в "Настройки" и выбираем "Шаблоны сайтов":

-2

Откроется список всех имеющихся в вашем распоряжении шаблонов. Нажимаем на кнопку "Добавить шаблон":

-3

Далее необходимо заполнить стандартную форму (см. пример ниже):

-4

Особое внимание стоит обратить на "Внешний вид шаблона сайта", сюда будет заливаться созданная Вами html-верстка. Вся контентная область расположенная между тегами </heder> и <footer> должна быть удалена. Вместо нее будет использоваться специальный разделитель WORK_AREA.

Далее нажимаем на третью вкладку и в свободное окно заливаем все CSS-стили относящиеся к вёрстке:

-5

Сохраняем внесённые изменения.

Загружаем в папку шаблона все необходимые файлы (стили, картинки и скрипты):

-6

В папке templates выбираем созданный ранее шаблон:

-7

В моем случае это папка homepersonal.

Добавляем нужные файлы с помощью соответствующей кнопки:

-8

Часть 2.

Редактирование шапки сайта

В папке шаблона открываем файл header.php и выбираем "Режим редактирования текст":

-9

В первой строке прописываем вот такой служебный код:

  • <? if (!defined('B_PROLOG_INCLUDED') || B_PROLOG_INCLUDED !== true) die(); ?>

Он нужен для того чтобы защитить файл от подключения напрямую без подключения ядра.

Внутри тегов <head> добавляем следующие строки:

  • <title><? $APPLICATION->ShowTitle(); ?></title> - код отображения заголовка страницы.
  • <? $APPLICATION->ShowHead(); ?> - код вывода в шаблоне сайта основных полей тега <head>.

После открывающего тега <body> добавляем следующее:

  • <div id="panel"><? $APPLICATION->ShowPanel(); ?></div> - код отображения административной панели при просмотре сайта.

Везде где есть обращение к файлам (css, js) необходимо добавить в начале пути константу:

  • <?=SITE_TEMPLATE_PATH?> и слеш / на конце.

Например: <link href="<?=SITE_TEMPLATE_PATH?>/css file\style.css" rel="stylesheet">

Сохраним изменения.

Редактирование подвала сайта

Здесь все гораздо проще)

Везде где есть обращение к файлам добавляем ту же самую константу:

  • <?=SITE_TEMPLATE_PATH?>/

Подключение шапки и подвала, добавление контента

В файле главной страницы сайта (index.php) прописываем следующий код:

первая строка:

  • <?require($_SERVER["DOCUMENT_ROOT"]."/bitrix/header.php");?>

последняя строка:

  • <?require($_SERVER["DOCUMENT_ROOT"]."/bitrix/footer.php");?>

Затем добавляем контент между этими строками (тот самый код, который находился между тегами </heder> и <footer>).

Остаётся только прописать в существующих путях знакомую константу:

  • <?=SITE_TEMPLATE_PATH?>/

Работа над шаблоном закончена!)

Остаётся только выставить его для Вашего сайта и посмотреть на результат.

Переходим в настройки и выбираем "Сайты""Список сайтов":

-10

Щелкаем по сайту, опускаемся в самый низ, выставляем нужный шаблон и сохраняем:

-11
-12

Чтобы увидеть что в итоге получилось нажимаем на кнопку "Сайт" в админпанели:

-13

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

Также Вас может заинтересовать:

Спасибо за внимание!

Остались вопросы? Что-то не получилось? Пишите в комментариях. Вместе мы сможем со всем разобраться)

Если статья оказалась полезной предлагаю подписаться на канал.