Как настроить параметры компонента

Цитатник веб-разработчиков В тексте курса вы встретите цитаты, высказанные в разное время разработчиками системы и разработчиками проектов на базе Bitrix Framework. Надеемся, что такие неформальные замечания внесут некоторое разнообразие в процесс изучения. Заодно опытные специалисты поделятся и своим опытом.

Имена авторов цитат даются в том написании, в каком авторы зарегистрировали себя на сайте «1С-Битрикс». .

Евгений Смолин: Сам кувыркался с непонятками (пока курсы учебные не прочитал и руками не попробовал то, что там написано). Битрикс из тех систем, где изучение «методом тыка» не очень эффективно без предварительного изучения учебных курсов. Уважаемые новички, потратьте немного своего драгоценного времени, пройдите пару-тройку учебных курсов и масса вопросов просто испарится — там есть ответы на множество вопросов.

Курс для разработчиков — продолжение линейки учебных курсов по Bitrix Framework. Получение сертификата по курсу рекомендуется после успешной сдачи тестов по всей линейке курсов, так как без понятия о работе Контент-менеджера и Администратора создание успешных сайтов будет затруднено.

Чтобы научиться программировать в Bitrix Framework, нет необходимости изучать всю линейку курсов. Но есть моменты, которые необходимо знать разработчикам о системе, они раскрыты в начальных курсах:

Интерфейс программы — в главе Элементы управления курса Контент-менеджер.
Компоненты 2.0 (начальные сведения) в главе Компоненты 2.0 (начальные сведения) курса Контент-менеджер.
Информационные блоки — в главе Информационные блоки (начальные сведения) курса Контент-менеджер.
Управление доступом к файлам, элементам контента, модулям и другие права доступа в главе Управление доступом курса Администратор. Базовый.
Работа с инструментами системы — в главе Работа с инструментами курса Администратор. Базовый.
Модуль Поиск — в главе Поиск курса Администратор. Базовый.
Вся информация по администрированию модулей размещена в курсах:
- Администрирование. Модули — модули «1С-Битрикс: Управление сайтом»
- Администратор. Бизнес — модули «1С-Битрикс: Управление сайтом», связанные с коммерческой деятельностью в Интернете.
- Администратор «1С-Битрикс: Корпоративный портал» — модули «1С-Битрикс: Корпоративный портал»
Как построен курс

Общепринятая градация квалификации разработчиков в рамках курса обозначает что:
- Junior сможет создавать простые сайты работая со штатными компонентами и модифицируя их шаблоны.
- Middle разработчик может работать с API Bitrix Framework.
- Senior умеет работать над производительностью и безопасностью сайтов, создавать свои модули и компоненты.
Начальные требования к подготовке

Для успешного изучения курса и овладения мастерством разработки сайтов на Bitrix Framework необходимо владеть (хотя бы на начальном уровне):
- основами PHP, баз данных;
- основами HTML, CSS.
У нас часто спрашивают, сколько нужно заплатить

Курс полностью бесплатен. Изучение курса, прохождение итоговых тестов и получение сертификатов — ничего из этого оплачивать не нужно.

Ещё у нас есть Академия 1С-Битрикс, где можно обучиться на платной основе на курсах нашей компании либо наших партнёров.

Баллы опыта

В конце каждого урока есть кнопка . При клике на неё в Вашу итоговую таблицу опыта добавляется то количество баллов, которое указано в прочитанном После нажатия кнопки Прочитано! появится
окно подтверждения:

уроке.

Периодически мы заново оцениваем сложность уроков, увеличивая/уменьшая число баллов, поэтому итоговое количество набранных Вами баллов может отличаться от максимально возможного. Не переживайте! Отличный результат — это если общее число набранных Вами баллов отличается от максимального на 1-2%.

Тесты

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

Комментарии к статьям

На каждой странице курса авторизованный на сайте посетитель может дать комментарий к содержимому страницы. Комментарий — не форум, там не ведётся обсуждений или разъяснений. Это инструмент для сообщений нам об ошибках, неточностях. Для отправки комментария воспользуйтесь расположенной в правом нижнем углу окна браузера кнопкой:

Что дальше?

Одновременно с изучением курса Разработчик Bitrix Framework вам придётся обращаться к информации о других технологиях Bitrix Framework. Эта информация размещена в следующих курсах:
Технология Композитный сайт — ускорение работы сайта.
Разработка и эксплуатация высоконагруженных проектов — для тех кто делает «тяжёлые» проекты.
Бизнес-процессы — настройка и создание бизнес-процессов.
Бот платформа Битрикс24 — приложения, основанных на чатах в веб-мессенджере.
Маркетплейс Битрикс24 — приложения для коробочной и облачной версий Битрикс24.
Маркетплейс Bitrix Framework — расширение функционала проектов на основе Bitrix Framework с помощью сторонних модулей и решений.
Многосайтовость — система многосайтовости и принципы работы с многосайтовой конфигурацией.

Для преподавания оффлайн

Если данный курс берётся в качестве основы для оффлайного преподавания, то рекомендуемая продолжительность: 5 дней (40 академических часов).

Если нет интернета

Скачать материалы курса в формате EPUB. Файлы формата EPUB Чем открыть файл на
Android:
EPUB Reader
CoolReader
FBReader
Moon+ Reader
eBoox

iPhone:
FBReader
CoolReader
iBook
Bookmate

Windows:
Calibre
FBReader
Icecream Ebook Reader
Плагины для браузеров:
EpuBReader – для Firefox
Readium – для Google Chrome

iOS
Marvin for iOS
ShortBook
обновляются периодически, поэтому возможно некоторое отставание их от онлайновой версии курса.

Источник

Файл настройки параметров компонента 1С-Битрикс (.parameters.php)

Файл .parameters.php содержит описание параметров компонента. Данные файла нужны для отображения формы настроек компонента:

Структура файла может иметь следующий вид:

//формирование массива параметров
$arComponentParameters = array(
«GROUPS» => array(
«LIST» => array(
«NAME» => «Списки»,
«SORT» => «300»,
),
),
«PARAMETERS» => array(
«STRING» => array(
«PARENT» => «BASE»,
«NAME» => «Строка»,
«TYPE» => «STRING»,
«DEFAULT» => «Значение по умолчанию»
),
«CHECKBOX» => array(
«PARENT» => «BASE»,
«NAME» => «Одиночный чекбокс»,
«TYPE» => «CHECKBOX»,
),
«LIST_SINGLE» => array(
«PARENT» => «LIST»,
«NAME» => «Список»,
«TYPE» => «LIST»,
«VALUES» => array(
«1» => «Первый»,
«2» => «Второй»,
«3» => «Третий»,
),
«MULTIPLE» => «N»,
),
«LIST_MULTIPLE» => array(
«PARENT» => «LIST»,
«NAME» => «Множественный список»,
«TYPE» => «LIST»,
«VALUES» => array(
«1» => «Первый»,
«2» => «Второй»,
«3» => «Третий»,
),
«MULTIPLE» => «Y»,
),
«LIST_MULTIPLE_ADD» => array(
«PARENT» => «LIST»,
«NAME» => «Множественный список»,
«TYPE» => «LIST»,
«VALUES» => array(
«1» => «Первый»,
«2» => «Второй»,
«3» => «Третий»,
),
«MULTIPLE» => «Y»,
«ADDITIONAL_VALUES» => «Y»
),

Для удобства я не использовал lang файл для описания параметров (а-та-та, так делать плохо). Как видно из кода, в файле формируется массив $arComponentParameters, который состоит из двух ключей: GROUPS и PARAMETERS. В GROUPS задаются массивы, описывающие разделы (группы) настроек. На скрине: «Шаблоны», «Основные параметры», «Списки». По умолчанию, в любом компоненте присутствуют следующие группы:

ADDITIONAL_SETTINGS — появляется при указании SET_TITLE;
CACHE_SETTINGS — настройки кэша, появляется при указании CACHE_TIME;
SEF_MODE — настройки ЧПУ;
URL_TEMPLATES — шаблоны ссылок;
VISUAL — настройки внешнего вида;
DATA_SOURCE — источник данных, ID и TYPE инфоблока;
BASE — основные параметры;
AJAX_SETTINGS — настройки AJAX.

Описание группы содержит два ключа: NAME — название группы выводимое на форме и SORT — внутренняя сортировка.

Значением ключа PARAMETERS является массив параметров компонента. Простейшее описание может иметь следующий вид:

«код параметра» => array(
«PARENT» => «код группы», // если пустое — ставится ADDITIONAL_SETTINGS
«NAME» => » название параметра на текущем языке», //рекомендуется подключение из lang файлов с помощью GetMessage(),
«TYPE» => «тип элемента управления, в котором будет устанавливаться параметр»,
«REFRESH» => «перегружать настройки или нет после выбора (N/Y)»,
«MULTIPLE» => «одиночное/множественное значение (N/Y)»,
«VALUES» => «массив значений для списка (‘TYPE’ = ‘LIST’)»,
«ADDITIONAL_VALUES» => «показывать поле для значений, вводимых вручную (Y/N)»,
«SIZE» => «число строк для списка (если нужен не выпадающий список)»,
«DEFAULT» => «значение по умолчанию»,
«COLS» => «ширина поля в символах»,
),

Ключ TYPE может принимать одно из следующих значений:

LIST для списка
STRING для поля ввода
CHECKBOX для чекбокса
CUSTOM для своих элементов управления

В зависимости от значения параметров MULTIPLE и ADDITIONAL_VALUES, список (‘TYPE’ = ‘LIST’) может принимать следующий вид:

Источник

Использование и настройка каталожных компонентов 14 версии

Все о чем будет рассказано в статье работает на обновление инфоблоков 14.0.7

У вас есть собственный сайт, который был сделан на основе компонентов предыдущих редакций или на кастомизированных компонентах. Или вы купили шаблон и хотите в нем использовать каталожные компоненты от 14 версии. В этой статье мы рассмотрим как можно использовать каталожные компоненты 14 версии и на что обратить внимание при настройке.

Для экспериментов я взял готовый HTML шаблон, интегрировал его в шаблон сайта – как это сделать можно узнать на онлайн курсах которые вы можете пройти у нас: http://academy.1c-bitrix.ru

И попробую использовать каталожные компоненты 14 версии, для вывода каталога.

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

Показать скрытое содержимое

Начнем разбирать компоненты

Первый компонент который мы рассмотрим будет компонент выводящий список товара:

С помощью компонента, на главной странице сайта, мы выведем блоки с товарами, в две строки по « три » элемента:

Разместим его на странице, подключим наш каталог:

Выбираем шаблон « .default » — это тот шаблон который обновляется продуктом и используется в компонентах по умолчанию

Прописываем конкретный раздел из которого будем выводить товары.

Задаем количество элементов в строке

Обратим внимание на первую опцию настройки которая нам нужна для осуществления задуманного:

« Количество элементов выводимых в одной строке таблицы » — данная опция задает сколько колонок выведется на экране, параметр может принимать значение от « двух » до « пяти », я поставил « три » — давайте посмотрим, что получилось:

Отлично, мы видим, что у нас отобразилось « три » колонки, давайте попробуем изменить значение на « пять » и посмотрим, что у нас получилось:

Количество элементов изменилось, теперь их « пять ».

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

Мне нравится когда количество элементов в строке « три ».

Какой он оптимальный каталог?

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

Одна из тяжелых операций при выводе каталога это картинки, и желательно уделять им внимание, если вы загрузите картинку привьюшки списка в разрешение 1200 на 1200 пикселей, но будете выводить « пять » элементов в строке, то такой размер картинки сильно избыточен.

Выше мы сказали, что шаблон подстраивается к количеству места которое ему выделили соответственно оптимальный размер картинки будет всегда разный, для моего шаблона сайта, значения получились следующие:

Для детальной картинки которая будет отображаться в компоненте bitrix:catalog.element

363 х 474 пикселей, но так как я знаю, что буду использовать лупу, я сделаю картинку в два раза больше.

Для компонента списка и « трех » элементов в строке у меня получилось:

243 х 317 пикселей

Эти цифры понимают масштабирование, то есть из 363 х 474 я без потери пропорций, смогу сделать 243 х 317 пикселей – это сделано в компонентах, и найдя размер картинки для списка, исходя из представленных данных, можно предположить сколько будет размер у детальной картинки.

С размерами я определился, у меня будут следующие наборы картинок:

« Детальная картинка » в размере 243 х 317 – которая будет отображаться компонентом списка

« 5 дополнительных картинок для детального компонента » — в размере 726 х 948 пикселей

Новые компоненты умеют делать анимацию картинок, при показе списка, отображается одна картинка, при наведение другая. Поэтому загружая картинки я учту, чтобы они были разные.

На видеоролике выше вы можете видеть такую анимацию картинок.

Как показываются картинки и в какой последовательности и куда их нужно загружать для оптимального отображения.

Для обычного товара:

Картинка для анонса
Детальная картинка
Дополнительные картинки – загруженные в файловое свойство

Для SKU товаров

Картинка для анонса
Детальная картинка
Дополнительные картинки – загруженные в файловое свойство

Картинка для анонса – в SKU инфоблоке
Детальная картинка – в SKU инфоблоке
Дополнительная картинка – загруженная в файловое свойство SKU инфоблока

Показ первой картинки делается по списку сверху вниз, второй картинки далее по списку.

Соответственно если вам нужно как и мне показать одну картинку в списке и пять картинок в детальном представление, то можно загрузить первую картинку или в « Картинка для анонса » или в « Детальная картинка », а пять картинок в « Дополнительные картинки » – загруженные в файловое свойство

Мы для списка будем делать картинку меньше чем для детального представления, соответственно в настройках компонента bitrix:catalog.element , я убираю галочку с « Добавлять детальную картинку в слайдер »:

Давайте сразу посмотрим где в настройках bitrix:catalog.section выбираются какие картинки и откуда показывать:

Я выбрал свойство с типом « Файл » из основного инфоблока товаров и установил его в « Дополнительная картинка основного товара: »

Посмотрим как выглядят загруженные картинки в редактирование товара:

Картинка для списка, и дополнительный набор из пяти картинок, который я буду использовать в детальном представление товара:

Рассмотрим остальные параметры компонента на которые стоит обратить внимание, и которые появились в новой 14 версии:

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

Вы можете задавать, показывать или не показывать « Процент скидки » и « Старую цену товара »

Так же вы сможете заменить тексты кнопок и информационных сообщений, которые выводятся покупателям, на свои собственные.

Так выглядит в публичном разделе отображение скидки и старой цены товара.

Ну и последний параметр на котором хотелось бы остановится, если вы обратили внимание в ролике, сайт в который был вставлен компонент выполнен в пастельных нежно желтых или желтых тонах, соответственно было бы хорошо применить для компонента цветовую схему желтого цвета , идем в настройку:

Видим, что компонент поддерживает несколько цветовых схем, выбираем желтую:

Выбор цветовой схемы влияет на отображение кнопок и рамки вокруг свойств . Теперь компонент выглядит на сайте не чужеродно, а лаконично, как и задумывалось.

Следующий компонент который мы разберем, это bitrix:catalog.element

Добавляем его на страничку и входим в настройку компонента:

В настройках выбираем шаблон « .default », и посмотрим как он выглядит в публичном разделе:

Давайте разберем визуальную часть компонента подробней:

Отображение картинки из набора дополнительных картинок, если картинка как в примере, будет меньше по размеру, то она будет отцентрована.
Выводятся свойства Торговых Предложений – их может просто не быть, если вы не используете у себя в каталоге Торговые Предложения.
Блок с дополнительными элементами, в виде кнопочек со всплывашками, выводятся из свойства с типом « Справочник » — можно не использовать. Удобно для вывода дополнительной информации сайта, как купить или выбрать товар, как оплатить, примерить и т.п.
Обычные свойства товара, не свойства Торговых Предложений
Рейтинг товара, в скобочках выводит количество людей поставивших товару рейтинг.
Блок с комментариями, умеет гибко настраиваться, вы можете использовать либо все три типа комментариев: « Комментарии продукта », « Комментарии социальной сети Вконтакте », « Комментарии социальной сети Facebook », либо нужные именно вам, отключив ненужные.
Блок с детальной информацией по товару
Блок с дополнительными картинками, количество картинок не ограниченно, по умолчанию выводится пять, если их больше, появляются стрелочки, что бы просматривать остальные.

Давайте разберем некоторые дополнительные настройки компонента:

Цветовая схема – аналогично компоненту списка, вы можете выбрать нужную вам цветовую схему
Выбираем свойство в котором хранятся дополнительные картинки в инфоблоке товаров
Выбираем свойство в котором хранятся дополнительные картинки в инфоблоке торговых предложений. Данная настройка может не использоваться, если у вас нет товаров или картинок в инфоблоке торговых предложений.
Свойства по которым отбираются торговые предложения, фактически выбранные свойства будут отображены. Свойства с типом « список » – отображается как текстовый квадратик со словом « тест » который вы можете увидеть на скриншоте выше, а свойство с типом « справочник » отображается в виде картинок вкусов, если подвести мышку к картинке, всплывает ее название.
Данное свойство разрешает или запрещает – добавление картинки используемой для списка в галерею для отображения на детальной странице, если картинка списка меньше чем детальная лучше ее не добавлять в галерею.
Вы можете задавать, показывать или не показывать « Процент скидки » и « Старую цену товара »

Блок, где можно изменить стандартные тексты для кнопок и сообщений.
Блок где можно управлять комментариями
Данная настройка включает использование компонента который может выводить дополнительную информацию, связанную с товарами, то есть у разных товаров, могут выводится разные блоки (3 – на скриншоте публичного отображения, показанного выше)
Название свойства из которого выводится блок, описанный в пункте 3

Аналогичные настройки задаются и в комплексном компоненте: bitrix:catalog

Спасибо за потраченное время на статью, если у вас будут вопросы задавайте их в комментариях, я постараюсь на них ответить.

Источник

Как настроить параметры компонента