Підтримка не обмеженої кількості шаблонів у 1С-Бітрікс.
Всім, хто працює на 1С-Бітрікс, відомо, що CMS надає можливість підключати необмежену кількість шаблонів. Для тих хто не в курсі давайте розглянемо, як використовується реалізація багатошаблонності.Для додавання шаблону необхідно перейти в розділ, в адміністративній частині сайту, "Налаштування" - "Налаштування продукту" - "Сайти" у меню, що випадає, в розділі "Сайти" є два підрозділи - "Шаблони сайтів" і "Список сайтів".
Копіюємо основний шаблон сайту.
Для початку скопіюємо шаблон сайту, для цього перейдемо в розділ "Шаблони сайтів" і скопіюємо шаблон, щоб працювати з ним. Натискаємо кнопку копіювати як показано на скріншоті:Застосовуємо шаблон до сайту для редагування.
Нам залишилося застосувати шаблон до сайту, але так як сайт у нас робочий і на ньому можуть бути користувачі, і нам не потрібно щоб вони бачили зміни, що відбуваються на сайті, ми підключимо шаблон за умовою - "Параметр в URL". Давайте зробимо це - перейдемо до розділу "Список сайтів" і зайдемо до налаштувань сайту для якого потрібна зміна. У самому низу сторінки налаштування сайту є блок "Шаблон сайту". Вибираємо зі списку в колонці "Шаблон" копію нашого шаблону, встановлюємо умову "Параметр в URL" і додаємо будь-яку зручну вам умову, наприклад test=Y, як показано на скріншоті:Тепер копія вашого шаблону буде відображатися, якщо ви передасте цей параметр в урл, наступним чином site.ru/?test=Y де site.ru домен вашого сайту. Ця умова буде працювати для всіх розділів і сторінок вашого сайту, наприклад, якщо вам необхідно подивитися як виглядатиме шаблон в певному розділі сайту, перейдіть в цей розділ і передайте ваш параметр, в даному випадку? test=Y і сторінка з'явиться з новим шаблоном.
Тепер ви можете редагувати новий шаблон, в той час як ваші відвідувачі будуть бачити сайт як завжди. Зверніть увагу, що всі зміни потрібно буде робити саме в папці нового шаблону, і якщо вам необхідно змінити шаблони компонентів яких немає в папці, вам потрібно буде скопіювати шаблон компонента в папку з новим шаблоном. У жодному разі не керуйте компонентами в папці /bitrix, це може призвести до критичних наслідків. І завжди робіть бекап у Хмарі 1С-Бітрікс.
Ну ось власне і вся методика, сподіваємось, що вона допоможе вам заощадити час.
Відразу хочу висловити подяку Михайлу Базарову, за статтю в його блозі, яка надихнула мене піти далі і реалізувати більш модернізовану версію автовизначення мобільної версії сайту. Також велике спасибі Станіславу Сазонову за його підказки та за те, що познайомив мене з технологією Bootstrap.
Адаптивний дизайн чи мобільна версія шаблону сайту?
Для відображення контенту в цьому немає великої різниці. Але щоб показати цей контент на дисплеї вашого девайса, його потрібно попередньо завантажити. Добре, якщо користувач підключений до високошвидкісної точки доступу в інтернет. В ідеалі це ноутбук, що виконав вхід у всесвітню павутину через wi-fi точкудоступу. Але скільки ж нервів і часу ми витрачаємо в тих випадках, коли у нас в руці мобільний телефон, а з'єднання навіть не 3G, а звичайний GPRS.
А тепер уявіть, що на потрібному сайті є тільки повна оригінальна версія шаблону сайту. Ця версія гарна: з анімацією, зображеннями, стилями, скриптами та ще купою рядків різного роду коду. І ось, ви зайшли на цей сайт... 10 секунд, 20... А ми на все чекаємо. У найгірших умовах час від кліка за посиланням, до завантаження контенту та видачі його вам на дисплей може затягнутися і до хвилини. Бувають випадки і важче... Як же бути? Але ж у нас же адаптивний дизайн, він повинен красиво відображатися на мобільних телефонах, без анімацій та великих зображень.
Відображатися він буде, але під час завантаження він підтягує весь контент, навіть той, який не відображає. Що робити? Все дуже просто - потрібен окремий, і теж адаптивний шаблонсайту.
Мобільний шаблон сайту Бітрікс
Псевдонім домену
Отже, панове! Перше, що нам потрібно зробити, це піддомен для нашого основного домену. Найкраще не винаходити велосипед, а створити піддомен типу . На просторах інтернету я бачив, що хлопці описують підключення різних шаблонів без створення псевдоніма домену для мобільної версії. Все добре, але ж ми користувачі Бітрікса, і використовуємо технологію "Композитний сайт". А якщо різні шаблони виводитимуться на однакових адресах, то й зміст композиту загубиться, оскільки кеш постійно перезаписуватиметься. Я вже через це пройшов. Тому нам потрібний додатковий псевдонім домену.
Полегшений шаблон
Тепер нам потрібно створити, а краще підготувати наперед окремий шаблон для мобільних пристроїв. Наскільки він буде полегшений – це залежатиме від розробника. Але краще прибрати все непотрібні файли js, css або мінімізувати їхній код. Наприклад прибрати всі стилі, що не використовуються. Забрати зайві анімації, слайдери. Звичайно ж, зовсім неприйнятно на мобільній версії залишати flash. Також полегшити PHP-код. Вимкнути виведення непотрібних компонентів на мобільні версії. Це може бути фільтр у списку товарів. Як я помітив з ним, генерація сторінки на першому хіті відбувається довше.Mobile Detect
Mobile Detectє легким PHP класом для виявлення мобільних пристроїв (у тому числі планшети). Він використовує рядок User-Agent у поєднанні з конкретними заголовками HTTP для виявлення мобільного середовища. Завантажуємо свіжий файл Mobile_Detect.phpпрямо з сайту розробника mobiledetect.net. Встановлюємо цей файл на сервер прямо в директорію шаблону "поряд" з файлом header.php. В обох шаблонах header.php підключаємо цей файл і ставимо умову для redirect.Написання коду
Ну що ж, приступимо до написання самого коду. Щоб обійти технологію композитного сайту, і не переривати створення композитного кешу, нам знадобиться файл header.php, який підключається ще до підключення файлу header.php самого шаблону сайту. Цей файл знаходиться на адресі /bitrix/header.php. І пишемо наступний код:Мобільний трафік
Зустрічаємо мобільний трафік
Якщо Google не позначить ваш сайт ярликом "Для мобільних", він зникне з поля зору користувачів, що зайшли до Інтернету з мобільних пристроїв. Тому що при пошуку на мобільних пристроях Googleвраховує наявність відповідної оптимізації під час ранжування результатів. Мобільний трафік «відрізається», падають продажі, бізнес зазнає збитків. 
Як пройти Google Speed Test?
Необхідні складові:Мобільний трафік набирає обертів!
Зустрічайте правильно мобільних клієнтівз платформою "1С-Бітрікс"!
Думаєте, що у вас немає мобільного трафіку?
Перевірте. Мобільний трафік зараз превалює на багатьох сайтах, навіть зовсім не призначених для мобільного перегляду та без мобільних версій. Наприклад, квітникарі, книголюби та інші учасники різних спільнот дедалі більше заходять до мережі з мобільних пристроїв.
Зустрічаємо мобільних клієнтів
Ваш сайт зникне з перших сторінок результатів пошуку Googleякщо його незручно переглядати на мобільних пристроях.
Google розіслав попередження сайтам з поганою оптимізацією під мобільну платформу, що з 21 квітня 2015 ці сайти опустяться в пошуковій видачі.
Чому так важливо бути mobile-friendly?
Напевно, багато хто переходив з результатів пошуку Google на неоптимізовані для перегляду на смартфонах сайти. Сторінки з крихітними посиланнями і текстом, що важко читається, які ще не вміщаються на екрані пристрою, справляють несприятливе враження.
Google відзначатиме мобільні сайти в результатах пошуку
«Щоб попередити можливі незручності користувачів мобільних пристроїв під час перегляду сайтів, ми відзначатимемо в результатах нашого пошуку сторінки, оптимізовані для смартфонів та планшетів».
Якщо Google не позначить ваш сайт ярликом "Для мобільних"? По суті, сайт зникне з поля зору користувачів, що зайшли в Інтернет з мобільних пристроїв. Тому що при пошуку на мобільних пристроях Google враховує наявність відповідної оптимізації під час ранжування результатів. Мобільний трафік "відрізається", падають продажі, бізнес зазнає збитків.
Як відповідати новим вимогам?
Що потрібно зробити?- Пройти перевірку та отримати звіт
- Вивчити всі рекомендації
- Усунути проблеми та недоліки
- Отримати позначку Google "Для мобільних"
Щоб з'ясувати, чи ваші сторінки відповідають новим вимогам, достатньо пройти процедуру перевіркиоптимізацію для мобільних пристроїв.
Чи не оптимізовано для мобільних пристроїв!
Щоб усунути всі виявлені проблеми при перегляді зі смартфонів та планшетів, причому не однієї сторінки, а всього вашого сайту, потрібно зробити багато. Зокрема, необхідно вивчити посібники для веб-майстрів зі створення та оптимізації мобільних версій сайтів, документацію щодо налаштування системи керування контентом та шаблонів сайтів. Це під силу лише фахівцям.
Адаптивна верстка
Адаптуємо сайт до мобільного ринку
Готовий приймати мобільних відвідувачівКожна сторінка вашого сайту, якщо він на платформі "1С-Бітрікс", моментально перебудовується під будь-який пристрій. Ваш сайт спочатку готовий до мобільних, планшетних та десктопних версій. Крім цього, підтримується Touch інтерфейс у всіх компонентах інтернет-магазину.
Інтернет-магазини на платформі «1С-Бітрікс» - з адаптивним шаблоном
У ядро продукту "1С-Бітрікс: Управління сайтом" вбудований Framework з usefull-версткою (Bootstrap 3). Універсальний Framework для верстки полегшує та прискорює створення будь-якого типу сайтів, адаптивних під мобільні пристрої(Mobile-friendly).
Перше, з чого потрібно почати, – змінити принципи верстки сайту.
При проектуванні структури необхідно одночасно враховувати вимоги до адаптивної верстки.
Ви повинні зробити це частиною вашого виробничого циклу!
Універсальний Framework
Сучасна технологія адаптивної верстки
Ваш сайт спочатку mobile-friendlyВаш сайт спочатку готовий до перегляду на будь-якому пристрої, включаючи мобільні. У ядро продукту 15.5 версії вбудований універсальний Framework для верстки, що полегшує та прискорює створення mobile-friendly (адаптивних під мобільні пристрої) будь-якого типу сайтів.
Адаптивно для всього!
- Універсальний Framework для верстки (Bootstrap 3)
- Висока швидкістьвиробництва адаптивних сайтів
- Початкова готовність до мобільних, планшетних та десктопних версій
- Підтримка Touch інтерфейсу у всіх компонентах інтернет-магазину
Готове рішення «Інтернет-магазин», що входить у постачання продукту, отримало новий гарний шаблон. Framework із usefull-версткою (Bootstrap 3) дозволяє використовувати шаблон під будь-яку схему інтернет-магазину. Кожна сторінка вашого магазину тепер вмить перебудовується під будь-який пристрій.