Описания товаров (карточки с html редактором)

Приложение добавляет вкладку «Описание товаров» и кнопку на панели инструментов в каждую карточку сделки Битрикс24. В них можно просматривать и редактировать HTML-описания товаров из каталога, вставлять изображения и отслеживать историю изменений.

Применение приложения

В любом каталоге товаров всегда есть польза от полного описания товара. В каталоге CRM описание товара ограничивается картинкой и простым текстовым полем описания. Данное приложение позволит создавать большие структурированные описания товарных позиций. Когда это полезно?
Как ни странно, в случае CRM Битрикс24 товарный каталог с описаниями товаров это в первую очередь внутренняя база знаний по возможностями, свойствам и характеристикам предлагаемой продукции.

Начальная настройка

1. Папка для изображений

В разделе «Хранение файлов»:

1. В выпадающем списке «Хранилище» выберите диск, куда будут сохраняться картинки. Список отображает все доступные хранилища портала с указанием типа: общий диск, личный диск, рабочая группа. Рекомендуется выбирать общий диск компании.
   
2. В поле «Название папки» укажите имя папки (по умолчанию — «Описания товаров»).
   
3. Нажмите «Создать папку». Если папка с таким именем уже существует, она будет найдена и подключена — дубликат не создаётся.
   

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

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

Изображения для карточек описаний сохраняются по структуре:

{Папка} / {ID каталога} / {ID товара} / {имя файла}   Поиск и редактирование товара из главного окна

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

1. Введите часть названия товара в поле «Поиск товара по названию».
   
2. Через короткую паузу под полем появится выпадающий список с результатами. Каждая строка показывает название товара и его ID (справа).
   
3. Нажмите на нужный товар — поле заполнится его названием.
   
4. Нажмите ✏️ Редактировать — откроется панель редактора поверх страницы.
   
5. Внесите изменения и нажмите «Сохранить» — панель закроется, история обновится автоматически.
   

Если нажать «Редактировать» не выбрав товар из списка, появится подсказка красным цветом.

Поиск требует, чтобы в настройках был сохранён режим каталога. Если каталог не настроен, поле поиска покажет соответствующее сообщение.

Работа с описаниями в карточке сделки

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

• Вкладка «Описание товаров» — встроена в карточку сделки, открывается без перехода.
  
• Кнопка на панели инструментов — открывает редактор в виде слайдера поверх карточки сделки.
  

Просмотр описания

1. Откройте карточку сделки и перейдите на вкладку «Описание товаров».
   
2. В левой панели отображается список товаров сделки с их количеством.
   
3. Нажмите на товар — в правой части откроется его HTML-описание.
   

Если описание ещё не создано, отображается пустое состояние с предложением добавить текст.

Редактирование описания

1. Выберите товар в левой панели.
   
2. Нажмите кнопку ✏️ Редактировать в правом верхнем углу.
   
3. Откроется редактор с панелью инструментов.
   
4. Используйте редактор и его меню, меняйте текст, применяйте стили для заголовков, для завершения редактирования нажмите «Сохранить».
   

Редактор поддерживает:

• Заголовки (Заголовок 1, Заголовок 2, Заголовок 3)
  
• Жирный, курсив, подчёркивание, зачёркивание
  
• Цвет текста и фона
  
• Маркированные и нумерованные списки
  
• Выравнивание
  
• Вставку ссылок и изображений
  
• Очистку форматирования
  

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

Допустимые форматы: JPG, PNG, GIF, WebP, SVG. Файлы других форматов отклоняются с сообщением об ошибке.

Предупреждение о размере файла: если выбранный файл превышает 1 МБ, перед загрузкой появится диалог с предупреждением. Нажмите «Продолжить», чтобы загрузить файл, или «Отмена», чтобы выбрать другой.

Файл с таким именем уже существует: если в папке товара уже есть файл с таким же именем, появится диалог с предложением «Удалить и загрузить» — старый файл будет удалён и заменён новым. Нажмите «Отмена», чтобы оставить существующий файл.

1. Во время загрузки отображается прогресс-бар с текущим шагом.
   
2. После завершения изображение автоматически вставляется в текущую позицию курсора.
   

История изменений

На главной странице приложения в правой части отображается журнал всех действий сотрудников.

Типы операций

Цвет	Тип	Описание
Зелёный	Создание описания	Описание товара создано впервые
Синий	Редактирование	Существующее описание изменено
Жёлтый	Загрузка картинки	Изображение загружено в хранилище

Структура записи

Каждая запись содержит две строки:

• Строка 1: тип операции · сотрудник · дата и время
  
• Строка 2: идентификатор [каталог:товар] мелким серым шрифтом, затем название товара
  

Управление списком

• Обновить — перезагружает историю, чтобы увидеть последние изменения других сотрудников.
  
• Загрузить ещё — появляется внизу списка, если записей больше 50.
  
• Очистить историю — удаляет все записи журнала. Сами описания товаров при этом не удаляются.
  

Часто задаваемые вопросы

Вкладка или кнопка не появляется в карточке сделки.
Убедитесь, что установка завершена успешно (все шаги зелёные). Попробуйте обновить страницу или переустановить приложение.

Список товаров пустой.
В данной сделке нет добавленных товаров. Добавьте товары в сделку и обновите вкладку.

Поиск товара ничего не находит.
Убедитесь, что в настройках приложения сохранён режим каталога. Без этого поле поиска работать не будет.

Кнопка вставки изображения показывает предупреждение.
Администратор портала должен выбрать хранилище и создать папку для изображений в настройках приложения (раздел «Хранение файлов»).

Файл отклонён при загрузке.
Допустимые форматы: JPG, PNG, GIF, WebP, SVG. Убедитесь, что расширение и тип файла соответствуют списку.

Появилось предупреждение о размере файла.
Файл больше 1 МБ. Можно продолжить загрузку или выбрать файл меньшего размера — большие изображения замедляют открытие описания.

Изображения в описании не отображаются.
Возможно, была изменена папка или хранилище для файлов в настройках. Файлы остались в старой папке, а ссылки в описаниях указывают туда же — они больше не совпадают с новым расположением.

ID каталога не отображается в истории.
На момент создания записи настройки каталога не были сохранены. Сохраните настройки на главной странице — новые записи будут содержать ID каталога.

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

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