Верстка шаблонів для bitrix, веб-розробка

Ця замітка призначена для початківців працювати з CMS Bitrix, або тих кому, по роботі або для себе, потрібно зверстати скін для цієї CMS.

Що нам знадобиться? Всього нічого -






* Стоїть бітрікс
* руки

Що стоїть бітрікс можна замінити встановленої 30-денний повнофункціональної демо-версією. Вона досить легко ставиться, а скачати її можна тут - тут

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

Якщо таких немає - можна спробувати пошукати в інеті, проте я думаю стоїть там годі й шукати. Я пов'язую це з тим фактом що верстка шаблонів для бітрікс в рунеті справу затребуване і, відповідно, ніхто не поспішає безкоштовно викладати в мережу то, що можна продати.

У Бітрікс шаблон являє собою набір файлів виду:

Останні 2 файли - це основні стилі шаблону. Також майже у кожного компонента (папка components) присутні свої css-файли. Файли footer.php і header.php - дають разом шаблон сторінки. Використовуючи їх, можна міняти структуру html-я, додавати свої css-класи і т.д. В адмінку Бітрікс вбудований файловий менеджер з можливістю редагування будь-яких текстових файлів. Але я вважаю за краще правити їх вручну, бо админка моторошно гальмує (понавішане всього, що змогли придумати).







Отже ми вибрали шаблон. Підключаємо його в [панель управління] - [сайти] - редагування сайтів.

Дві основні речі, з якими нам доведеться працювати при розміщенні різних "компонентів" в потрібних частинах сторінки, це головний шаблон сайту, і шаблони компонентів (меню, списку новин.). папка components має вигляд:

Отже, припустимо потрібно розмістити анонс новин в лівій колонці. Я для цього робив таку річ - в шаблоні сайту копіював код поключенія списку новин з центральної частини в ліву. Потім заходив в [Редагувати сайт], натискав на [Копіювати шаблон] у з'явився блоку - таким чином створюється окремий шаблон для списку новин і його можна сміливо правити. Далі змінював налаштування Інфоблоки на потрібні, ну і підганяв зовнішній вигляд під дизайн.

Таким же чином можна зробити будь-якого виду меню - горизонтальні, вертикальні, що випадають і немає - в різних областях сторінки.

Якщо щось потрібно пояснити, запитуйте тут. Або на форумі підтримки Бітрікс - він у них напрочуд активний. Якщо точніше, форум виглядає з боку як школа :).







Схожі статті