Немного удобств в интеграции html-блоков на сайте

  • Немного удобств в интеграции html-блоков на сайте

    Антон Долганин 1 Июля 2016 11:16 15176
    Практически на каждом проекте есть вот такого рода блоки, которые непонятно как интегрировать в CMS, чтобы сохранить возможность редактирования клиентом в будущем:

    Screenshot_5.png

    Прежде чем идти дальше, прикиньте для себя, как бы вы решали эту задачу. Этот пост носит еще обучающий характер.
    А какие вообще варианты есть?
    • Взять html-код и запихать его во включаемую область. Минусы - при редактировании клиент может повредить верстку, а также заставить испытать его сложности (непонятно как править кусок кода).
    • Завести инфоблок. Но один инфоблок на один блок это слишком круто.
    • Использовать точечные переменные, но для блока на скрине выше потребовалось бы аж 4 раза кликать на одиночные переменные. Трудно для клиента.
    • Запилить компонент. Тут каждый столкнется с ленью - как мол так, на один простой блок, целый компонент.
    Я решил пойти по последнему варианту, но раз и навсегда решить вопрос с ленью. А именно сделать универсальную болванку.
    Которая:

    • Не доставит сложностей разработчику для внедрения. Не будет лени другими словами.
    • Оставит все удобства для редактирования клиентом.
    Компонент получился состоящим, фактически, из шаблона. Одна "включаемая область" это один шаблон. А компонент один на всех. В чем магия? А магия в .parameters.php каждого из шаблонов, внутри которого мы и определеяем переменные. Но даже тут я предвидел лень, и поэтому свел все к копипасту и линейному массиву:


    Screenshot_2.png

    То есть, вы правите ТОЛЬКО верхний блок, добавляя столько переменных, сколько требуется шаблону.  Для скрина во вступлении я сделал 4 переменных. Каждая из них превратилась в мини-текстареа, чтобы можно было ввести в случае чего и многострочный текст.

    Screenshot_4.png

    Все, в шаблоне теперь доступны все эти переменные, и ими можно управляться как-то так (оцените сложный html-код вокруг):


    Screenshot_6.png

    Вот и вся наука. Еще раз, план действий для реализации такого блока:
    • Качаем компонент с этого поста.
    • Размещаем его в пространство компонент asd (ну или свой по желанию).
    • Создаете в папке шаблонов компонента еще один по аналогии, в .parameters.php шаблона по аналогии создаете свои переменные, правите шаблон, вставляя ваш блок.
    • В нужное место сайта вставляете вызов компонента: <?$APPLICATION->IncludeComponent('asd:variable.set', 'test');?>
    • В режиме правки вносите настройки-переменные.
    • Готово!
    Файлы:
    variable.set.zip (2.49 КБ)

Дмитрий
1 Июля 2016 15:56
Для таких целей всегда использовал

<?$APPLICATION->IncludeComponent(
   "bitrix:main.include", 
   "template", 
   $arParams,
   false
);?>
 
.
Антон Долганин
2 Июля 2016 8:04
Это тяжелее по ресурсам просто. Но тут больше дело вкуса конечно.
Alma
25 Июля 2016 8:21
Где же клиент будет вводит свои значение?
Олег
1 Июля 2016 20:16
Может, всё таки инфоблок?
Если менять параметры компонента, изменится файл php его вызывающий. А попадет ли он в систему контроля версий?
Мне кажется, проще сделать на инфоблоках, чем внедрять github в панель админа.
Антон
2 Июля 2016 7:53
Конечно попадет. Если конечно в гитигнор директория или файл не включен.
Антон Долганин
2 Июля 2016 8:04
Один инфоблок = один элемент? :)
Олег
3 Июля 2016 17:52
Не обязательно. Можно сделать один инфоблок для нетиповых элементов.
Добавить свойство, например PARAMS, закастомить страницу редактирования элемента и по switch, ng-show, ng-hide или ещё как-нибудь выводить поля, а перед сохранением паковать в json и хранить в PARAMS.

Так вам точно не придется за клиентом отслеживать изменения и кидать их в контроль версий.
Антон Долганин
4 Июля 2016 4:59
Пардон, все равно не понял :) я предполагаю, что клиент НЕ добавляет блоков, они создаются при создании проекта. Он лишь меняет в них информацию. То есть файлы добавляться не будут клиентом. (если речь про это)

Именно по этой же причине еще раз не вижу смысла в ИБ - кнопка "добавить новый элемент" становится бессмысленной. Появляются лишние вопросы "а что будет".
Антон Долганин
4 Июля 2016 5:47
Или речь про то, что сохраняемые настройки меняют целевой файл?

Я делаю так. К примеру, страница контактов у меня со сложной версткой, я внедряю на эту страницу одну включаемую область: http://prntscr.com/bogyda Обратите внимание на выделенный параметр, он позволит скрыть возможность редактирования ЭТОЙ области.

Внутри области я размещаю уже компоненты и другие включаемые области (в том числе и компонент из поста) http://prntscr.com/bogysn

Резюмируя, можно самую первую включаемую область размещать в том же /local

Не?
Сергей
22 Июля 2016 16:54
Круто придумали. Взял - пользуюсь. Удобно.
rivetweb
3 Августа 2016 7:50
и получаем кучу компонентов на разные блоки.

подход Переменные сайта - лучше все значения в одном месте без дублирования.
просто надо както улучшить представления для редактирования - например при включенном режиме редактирования
выводить все доступные поля для редактирования сразу а не в попапе.
вообще битриксу давно пора внедрить инлайн редактирование из коробки.
Антон Долганин
3 Августа 2016 7:54
Компонент один. Шаблоны компонента разные.
rivetweb
3 Августа 2016 10:49
а как тогда разные параметры для разных блоков делать ?
веть там могут быть разные наборы
rivetweb
3 Августа 2016 10:54
> А магия в .parameters.php каждого из шаблонов
а так это значит можно прописать и использовать эти же параметры в стандартном компоненте "подключаемая область" и не делать свой компонент?
или свой компонент обязателен для такого рода параметров?
Антон Долганин
3 Августа 2016 11:22
а так это значит можно прописать и использовать эти же параметры в стандартном компоненте "подключаемая область" и не делать свой компонент?
Верно, но он ищет рекурсивно, лишние работы зачем. Мне показалось, свой легкий компонент - проще :)

Как использовать файл параметров в шаблоне можно глянуть в примере к посту - я там прикрепил компонент с шаблонами.

У самого компонента может вообще файл параметров отсутствовать.  
rivetweb
3 Августа 2016 12:15
а если указать подключать из файла - разве ищет рекурсивно?

попробовал скопировать файл в шаблон компонента "Включаемая область" и параметры появились - офигенная фича битрикса о которой только сейчас узнал.

еще один аргумент в пользу ипользования стандартных компонентов
Антон Долганин
3 Августа 2016 12:32
Так я ж не спорю :)

По факту - в main.include (про него же речь?) идут еще какие-то проверки (кстати, которые могут вхолостую выполняться, если вы случайно не тот параметр добавите). Я не говорю, что это огого как страшно, но зачем мне к примеру в хидере каком-нибудь лишние пару проверок. Поэтому предпочитаю простое и прозрачное решение (для себя).  
Сергей
3 Августа 2016 17:59
Здравствуйте, а можно добавить выбор файлов  к форме редактирования параметров ? т.е чтоб клиент кроме текстовых данных мог прикрепить несколько ссылок на фото ?) как такое можно реализовать ?
Антон Долганин
3 Августа 2016 19:22
Вообще есть кастомный тип настроек для компонента.  Пример можно посмотреть в bitrix:player - выбор скина. Либо в картах Яндекс/Гугл - настройка точек.
Вот дока https://dev.1c-bitrix.ru/learning/course/?COURSE_ID=43&LESSON_ID=4880

В теории можно прилепить выбор файла на JS  - точнее вызов диалога. Как вариант, спросить ТП Битрикс - может есть какой-то уже компонент с данным типом св-ва, который вам нужен.

Это все относится к параметрам компонента, а не конкретно к описанному здесь.
pai
21 Сентября 2016 18:24
Решение - супер!
Я обычно это все включаемыми файлами оставляю, или выношу в настройки модуля, если какая-то общая информация, вроде номера телефона или еще что-то такое, что нужно на каждой странице сайта...
Василий
11 Января 2017 9:08
Это великолепное дополнение взамен включаемым областям.
Делал всегда через включаемые области, но при корявом заполнении все уезжало.

Автор молодец!
артем
24 Января 2017 15:47
Не подскажите как можно делать возможность множественное добавление?

пример 1 поля: +8 800 123-12-12 (основной номер) - номер телефона и само описание

и это чтобы можно было сделать несколькими данными
Антон Долганин
25 Января 2017 15:00
Тут только два разных св-ва компонента заводить.
Номер:
Описание номера:

Если я правильно понял вопрос.
артем
25 Января 2017 21:38
Надо чтобы номер телефона выводить не один раз тк может быть их 3 и даже 5.
при добавлении указать сам номер телефона и описание его.
создавать по 10 полей под каждый не разумно.

можно ли как-то сделать чтобы добавление могло быть множественное  с указанием этих полей для телефона и также остальные без проблем можно было.
Антон Долганин
26 Января 2017 19:43
Тогда вам стоит посмотреть в сторону кастомного типа
https://dev.1c-bitrix.ru/learning/course/index.php?COURSE_ID=43&LESSON_ID=4880

Больше идей нет.
артем
25 Января 2017 21:39
ПРИМЕР:
  • +375 29 000-00-00 (Заказ услуг и консультация)
  • +375 25 - (Сотрудничество)
Андрей
7 Марта 2017 10:12
А как правильно организовать доступ пользователю (контент-менеджеру) к такому компоненту? Если дать доступ на всю страницу - есть шанс что он её отредактирует вместе с компонентом:)
Антон Долганин
7 Марта 2017 10:14
Хороший вопрос. Но, боюсь, такой кейс не решаемый :(  Настройка прав компонент требует существенных прав, выше редактора.
Андрей
7 Марта 2017 10:27
Ого, спасибо за столь оперативный ответ:)
Сейчас я делаю так: создаю включаемую область, внутри у нее подключаю компонент, на файл области даю доступ группе контент-менеджеров. Но, думал, может существует иной подход к организации прав доступа.
Антон Долганин
12 Ноября 2018 9:01
Тоже вариант :)
Никита Черемисин
9 Октября 2018 7:37
Вот все-таки удобно сделали в Тильде редактирование такой информации. Может быть тоже как можно сделать через Сайты24... А если еще несколько языков, то неудобно клиенту. Одну информацию заполняй через инфоблоки, потому что там информации заполнять надо много, другую через файлы языковые, третье через настройки компонентов, четвертое через включаемые области. Жесть конечно.

За идею спасибо, Антон. Всегда радовали ваши решения.
OsterX
4 Апреля 2019 23:34
В случае нескольких языков можно в шаблоне сделать так:
<?php
$lengPrefs = array(
 'ru' => 'ru_',
 'ua' => 'ua_',
);

$set = array(
 'var1' => 'Переменная1',
);


$arTemplateParameters = array();
foreach ($set as $k => $val) {
 foreach ($lengPrefs as $langid => $lengPref) {
 $arTemplateParameters[$lengPref.$k] = array(
 'NAME' => $val." ".$langid,
 'COLS' => 35,
 'ROWS' => 3
 );
 }
}
 
ну а в шаблоне как то так:
<?echo $arParams[LANGUAGE_PREF.'var1']?> 
Константа LANGUAGE_PREF у меня в dbconn.php декларируется.

Если нужно множественное поле, например для телефонов:
$arTemplateParameters['phone_numbers'] = array(
 'NAME' => 'Телефон',
 'COLS' => 35,
 'ROWS' => 1,
 "MULTIPLE" => "Y"
); 
И вывести в шаблоне циклом.

P.S. Спасибо за решение! Раньше иногда делал включаемые области с кастомными шаблонами и доп.параметрами, но сделать такой компонент руки не доходили.
artem
11 Ноября 2018 19:19
Как можно добавить редактор в параметры компонента тк нужно вставить текст в html формате, а то сейчас вставляю и сам html выводится текстом?