Офіс шаблонів. Створення шаблону Бітрікс

Привіт друзі, це продовження до сері уроків, а точніше п'ятий урок створенню landing page на CMS 1С-Бітрікс .

Так як давно записував попередні уроки, давайте повторно розгорнемо платформу і перенесемо туди шаблон, з яким раніше працювали.

Реєструємо Хостинг під 1С-Бітрікс

Перейдемо до розділу новин, відкриємо статтю 3 місяці безкоштовного хостингу від МАКХОСТ та скопіюємо з неї промокод (8A93-0ECC-D7AD-4A76) . Потім переходимо на Макхост та вибираємо пункт у меню CMS хостинг, далі тиснемо на іконку 1С-Бітрікс.

Реєструємо обліковий запис на Макхост
Вводимо E-mail, промокод та вуаля, ми маємо три місяці безкоштовного хостингу.




На наступному етапі перевіряємо заповненість даних, підтверджуємо їх. Після успішної реєстрації ми отримуємо лист із логіном та паролем для входу в панель Хостингу.




Після активації облікового запису переходимо в налаштування PHPта змінюємо його конфігурацію під 1С-Бітрікс.


Встановлюємо такі параметри:

Display_errors - On
default_charset - "UTF-8"
mbstring.func_overload - 2
mbstring.internal_encoding - "UTF-8"

Потім переходимо у файл менеджер нашого домену та видаляємо все зайві файли, Залишаємо тільки установник.


Запускаємо установник 1С-Бітрікс. Просто копіюємо посилання з листа та вставляємо його у браузерний рядок.


Встановлюємо ШАБЛОН із попереднього уроку

на даний моментми встановили порожній шаблон Бітрікс, тому бачимо білий екран. Переходимо в адміністративну частину, тиснемо на іконку Контент -> Файли та папки -> bitrix -> templates . Створюємо в цій директорії порожню папку під шаблон під назвою " lendtv " . Переходимо до неї та закачуємо шаблон із попереднього уроку. Розпаковуємо його та видаляємо архів він нам більше не знадобиться.


Щоб шаблон підключився нам потрібно вибрати його в налаштуваннях поточного сайту. Для цього переходимо в Налаштування -> Налаштування продукту -> Сайту -> Список сайтів.


Відкриваємо перший сайт, спускаємося в низ і в пункті "Шаблон сайту" вибираємо шаблон який раніше ми копіювали.


Переходимо на головну сторінку, скидаємо її кеш, і як бачимо, шаблон успішно підключився.


Ось таким простим способомможна створювати свої шаблони, а потім переносити їх між проектами. На цьому все, в наступному уроці, розберемо як такий шаблон перенести в папку local.

Урок підготував Горєлов Денис.

У цьому пості я опишу методику створення шаблону для бітрикс. Вона трохи відрізняється від рекомендованої розробниками, і це виражається, перш за все, в мінімальному використанні адмінки. Передбачається, що ми маємо зверстаний макет сайту, встановлений на локальній машині cms, більш функціональний аналог блокнота і хороший файловий менеджер(Не провідник:)

Чому я не люблю адмінку бітрікс — по-перше, вона дуже важка, по-друге, погано пристосована для створення шаблонів. Вбудований відносно нещодавно візуальний редактор містить значні обмеження для використання. Особливо втішила фраза «шаблони демонстраційної версії адаптовані для використання в цьому режимі» — сенс «заточувати» шаблон під редактор незрозумілий.

Отже, приступимо до найголовнішого.

Етап перший – нецікавий

Тут передбачається довге, вдумливе ознайомлення з мануалами (качати з dev.1c-bitrix.ru) та успішне проходження курсу «Інтеграція». Після вивчення частина питань у Вас має відпасти.

Тепер перейдемо до практики.

Етап другий - створюємо файли

Файлову складову робитимемо ручками — так швидше та зручніше. Шаблони зберігаються в директорії /bitrix/templates/, тут треба створити каталог для свого творіння, наприклад test. Усередині нього розміщуємо:
- каталог images — для картинок шаблону (які не залежать від сторінки, що переглядається), нема чого їх зберігати в публічній частині
- каталог include_areas - для файлів, що включаються
- каталог page_templates — для зразків областей, що включаються.
- файл header.php - частина шаблону до контенту
- файл footer.php - частина шаблону ПІСЛЯ контенту
- файл description.php - назва та опис шаблону
- файл .styles.php - опис стилів для візуального редакторасторінок
- файл template_styles.css – стилі шаблону
- файл styles.css — стилі для контенту та областей, що включаються.

Етап третій – заповнюємо файли

Картинки відразу пишаємо в images, все стилі cssу template_styles.css, потім з нього виберемо необхідний мінімум у styles.css. Я завжди намагаюся стилі шаблону поміщати в template_styles, тому що він підключається останнім і випадкове перевизначення не зламає каркас сайту.

У вихідній верстці потрібно виділити область для контенту і розрізати верстку на 3 частини - до нього сам контент, і після нього. Для наочності наведу малюнок

За пунктами:
- в header.php включається 1 частина, за винятком вмісту між тегами та (залишити можна підключення різних скриптів). Після обов'язково додати

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

У footer.php повністю записуємо 3-ю частину
- до всіх відносних шляхів додаємо /bitrix/templates// Наприклад, було


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

… … …
Щоб відображався заголовок сторінки, додаємо функцію у відповідний тег. У результаті ми отримуємо такий файл:

... ... ...
До речі забув сказати, якщо все-таки є додаткові файли, будь то JS, CSS, favicon і так далі, то щоб не прописувати повний довгий шлях /bitrix/…/ є спеціальна константа SITE_TEMPLATE_PATH. Її і вставляємо на потрібні місця: