Компонент "Каталог"

Компонент "Каталог" является локальным компонентом.

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

Как правило, добавление данного компонента разрешено в регионе основного содержимого сайта и доступно на тарифном плане "Сайт с каталогом".

Тарифный план: Компонент "Каталог"
Парковка домена  Недоступен
Сайт-визитка  Недоступен
Сайт-компании  Недоступен
Сайт с каталогом  Доступен

 

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

 

 

Примерная последовательность действий для создания каталога на вашем сайте:

 
 

  1. Убеждаемся, что используется тарифный план "Сайт с каталогом".
     
  2. Создаем необходимую иерархию из страниц, имеющих тип "Стандартная".

    Например: 

    Каталог детских игрушек (тип страницы: "Стандартная")

            Транспорт (тип страницы: "Стандартная")

            Куклы (Тип страницы: "Стандартная")
     
  3. Добавляем конечные категории (страницы типа "Раздел каталога"), в которых как раз и будет находиться компонент "Каталог". Итоговая иерархия будет выглядеть так (Рисунок 1.1):

    Каталог детских игрушек (тип страницы: "Стандартная")

            Транспорт (тип страницы: "Стандартная")

                    Машинки (тип страницы "Раздел каталога")

                    Мотоциклы (тип страницы "Раздел каталога")

            Куклы (тип страницы: "Стандартная")

                    Барби (тип страницы: "Раздел каталога")

                    Матрешки (тип страницы: "Раздел каталога")

     

    Рисунок 1.1


4. При создании страницы типа "Раздел каталога", на нее автоматически добавляется компонент "Каталог" с одним тестовым демо-товаром (Рисунок 1.2):


Рисунок 1.2



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

5. Добавьте на родительские страницы компонент "Текст" со ссылками на вложенные разделы каталога. Например, на странице "Транспорт" должны присутствовать 2 ссылки - на страницу "Машинки" и на страницу "Мотоциклы". В таком случае наша иерархия разделов приобретет законченный вид.

6. Настраиваем компонент

Чтобы открыть меню настроек компонента, щелкните на пиктограмму  панели инструментов компонента.

Диалог настройки компонента "Каталог" (Рисунок 1.3) состоит из 2 основных областей: панели товаров из других каталогов и панели товаров текущего каталога.

 

Рисунок 1.3

 


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

В панели товаров текущего каталога отображаются товарные позиции уже добавленные в настраиваемый каталог. Изначально, сразу же после добавления там присутствует 1 тестовый демо-товар. Настоятельно рекомендуем не делать на его основе новый, а удалить из каталога с помощью кнопки , после чего наполнить каталог реальными данными.

В нижней части диалога настройки компонента выводятся общие настройки каталога:
 

  • количество товаров, выводимых на одной странице каталога. Данное поле по умолчанию заблокировано. Нажмите кнопку "Редактировать", введите желаемое количество товарных позиций, нажмите кнопку "Сохранить".
     
  • куда добавляем новые товарные позиции. Вновь добавляемые товары будут появляться либо вверху, либо внизу списка, в зависимости от выбранного значения в этом поле.



Чтобы добавить новый товар, нажмите кнопку "Создать товар". Откроется диалог добавления нового товара (Рисунок 1.4).

 

Рисунок 1.4

 

Заполните следующие поля:

  • алиас: это системное имя страницы, будет фигурировать в URL страницы подробного описания товара (карточке товара). В данное поле допустимо вводить только латиницу, цифры и дефис.
     
  • название товара: название товара в списке анонсов; также из значения данного поля сформируется заголовок товара на странице подробного описания и название страницы подробного описания.
     
  • краткое описание: краткая информация о товаре в списке анонсов и на странице подробного описания.
     
  • интеграция с фотогалереей: временно данная опция не поддерживается
     
  • фотографии товара: чтобы развернуть интерфейс управления фотографиями товара, нажмите на кнопку . У каждого товара должна быть хотя бы одна фотография.
    Чтобы добавить новую фотографию, нажмите на кнопку "Добавить фото". Откроется файловый менеджер, с помощью которого вы можете выбрать файл на сервере либо загрузить его со своего компьютера.
    Чтобы удалить фотографию выделите фото с помощью мыши и нажмите кнопку "Удалить фото".
    Кроме того, вы можете изменить порядок следования фотографий товара с помощью кнопок "Вперед" и "Назад".


Обратите внимание, что первая по порядку фотография товара будет считаться основной. Именно она будет выводиться в списке анонсов каталога, и будет присутствовать в увеличенном размере на странице подробного описания товара (Рисунок 1.5).


Рисунок 1.5

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

    Например, у товара "Машинка игрушечная (Модель №1)" присутствуют такие свойства как "Цена", "Остаток на складе".
    Можно придумать и другие свойства, например, "Цвет", "Габариты", "Вес", "Возрастное ограничение" и т.д. Все добавленные вами свойства будут выведены в карточке товара.

    Чтобы добавить новое свойство товара нажмите кнопку "Добавить свойство". В таблицу свойств будет вставлена новая запись с некими значеними по умолчанию. Отредактируйте данные значения, совершив двойной клик мыши в соответствующей ячейке. 
     
    • Системное имя: введите сюда уникальное имя для данного свойства на латинице. Например, "price". 

      Обратите внимание, что одинаковым свойствам товаров в одном каталоге следует давать одинаковые системные имена. Например, свойство "Цена" у двух товаров каталога "Машинки" должно иметь одинаковое системное имя "price". Необходимо для корректной работы фильтрации и сортировки.

 

  • Название: название свойства. Например, "Цена".

 

  • Единица измерения: то, что будет выводиться после значения свойства. Например, "руб.".

 

  • Выводить в анонсе: будет ли свойство показано в списке анонсов каталога. По умолчанию "Да".

 

  • Важное?: если свойство помечено как "Важное", оно будет визуально выделяться в карточке товара. По умолчанию "Нет".

 

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

 

  • Значение: значение поля. Например, 5000.


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


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

 

Обратите внимание!

 

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



Когда закончите добавление товаров нажмите кнопку "Отмена", чтобы закрыть диалог добавления товаров и вернуться к списку товаров каталога.

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

Товар можно удалить из каталога с помощью кнопки . При попытке удаления товара вы увидите предупреждение следующего содержания:

 

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

 


Если вы согласны, нажимайте "Ок" и товар будет удален (возможно, вместе со страницей подробного описания).


Кроме того, Вы можете изменить порядок следования анонсов товаров в каталоге с помощью кнопок  и .

Если вы закончили настройку компонента "Каталог", нажмите кнопку "Закрыть", и диалог настройки будет закрыт.


В итоге, наш настроенный компонент "Каталог" приобретает подобный вид (Рисунок 1.6):

 

Рисунок 1.6


Страница подробного описания товара (карточка товара).



Чтобы перейти к просмотру подробного описания товара, пользователь должен щелкнуть на ссылку "Подробнее", либо на фотографию товара в анонсе. Страница подробного просмотра имеет подобный вид (Рисунок 1.7):
 

Рисунок 1.7


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

Обратите внимание!

Настоятельно не рекомендуется вручную изменять содержимое компонентов "Заголовок" и "Текст" в регионе основного содержимого страниц типа "Товар". Также не изменяйте алиас страницы товара. Это может привести к некорректной работе каталога. Все изменения должны производиться через диалог настройки компонента "Каталог". После сохранения изменений страница подробного описания будет перегенирирована с новыми настройками.



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