Создание категорий товаров, настройка miniShop2

Поздравляю всех! Мы дошли до непосредственно части, где начнем реализовывать интернет-магазин. В данном уроке мы создадим несколько категорий товаров и выведем товары в этих категориях.

Для начала нам необходимо интегрировать шаблоны:

  • Категории товаров (я выбрал category-grid-2.html – он с баннером)
  • Шаблон товара (я выбрал single-product.html – он без фильтра, думаю он здесь не нужен)

Помните, как интегрируются шаблоны? Думаю, для вас не составит труда произвести это действие самим (или смотрите на видео). У меня получилось вот так:

После того, как мы интегрировали шаблоны, нам необходимо прописать несколько настроек в настройках системы (переходим в настройки системы -> пространство имен – miniShop2):

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

  • Почтовые адреса менеджеров (ms2_email_manager) – адреса электронной почты через запятую, куда будут приходить уведомления о заказах.
  • Шаблон по умолчанию для новых категорий (ms2_template_category_default) – выбираем шаблон “Категория товаров”
  • Шаблон по умолчанию для новых товаров (ms2_template_product_default) – выбираем шаблон “Товар”

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

  • Id товара как псевдоним (ms2_product_id_as_alias) – Да.
  • Id категории как псевдоним (ms2_category_id_as_alias) – Да.

Основные настройки мы произвели. Переходим к созданию категорий. Создадим следующее: категорию “Каталог”, а в ней создадим подкатегорию “Мобильные телефоны”. Создание категорий товаров ничем не отличается от создания простого ресурса. Единственное, что нужно сделать: на вкладке “Настройки” выбрать “Тип ресурса” – “Категория товаров”.

Если все сделали хорошо, то увидите следующую картину:

Также создаем в категории “Каталог” подкатегорию “Мобильные телефоны”. Потом создадим тестовый товар в категории “Мобильные телефоны” – iPhone 5.

Если мы внимательно посмотрим на наши шаблоны, то увидим, что мы имеем несколько видов миниатюр товара:

  • 246x186 в категории товара
  • 433x325 в галерее товара
  • 67x60 в галерее товара

“Для чего нам это нужно?” – спросите вы. Работа галереи miniShop2 кардинально отличается от привычной нам уже работы phpThumbOf. Картинки в ней генерируются не на лету, а сразу при загрузке. Поэтому нам необходимо прописать параметры каждой из миниатюр. Делается это в “Медиа”->”Источники файлов”. Нажимаем правой кнопкой мыши по “MS2 Images” и выбираем “Редактировать”. Ищем параметр “thumbnails” и записываем следующее:

{
"small":{"w":67,"h":60,"q":100,"zc":"1","bg":"000000"},
"medium":{"w":246,"h":186,"q":100,"zc":"1","bg":"000000"},
"big":{"w":433,"h":325,"q":100,"zc":"1","bg":"000000"}
}

Мы в формате JSON указали 3 миниатюры, которые будем использовать на сайте. Вот мы с вами и произвели базовую настройку miniShop2 на MODx Revolution.

Создание категорий товаров, настройка miniShop2

0 Число голосов: 8
4
5
1
8

Комментарии ()

  1. Шевяков Андрей 23 марта 2017, 11:35 # 0
    Как теперь вывести эти картинки?
    1. Петропавловский Артем 23 марта 2017, 14:50(Комментарий был изменён) # 0
      1. Леонид 22 июня 2017, 07:49(Комментарий был изменён) # 0
        http://joxi.ru/eAOgYZCxbboRAo где?
        1. Петропавловский Артем 22 июня 2017, 09:46 # 0
          Смотрите, есть замечательный сайт с документацией к miniShop2. На нем вы сможете прочесть все, что вас интересует. Учитесь читать документацию.
          1. Леонид 22 июня 2017, 10:44 # 0
            Я не из тех людей, кто сначала пишет, а потом читает…
            1. Петропавловский Артем 22 июня 2017, 10:50 # 0
              Значит вы не внимательно прочитали. У msProducts есть параметр includeThumbs. Посмотрите в его сторону.
              1. Леонид 22 июня 2017, 11:04 # 0
                [+240X180] — это то понятно… Вопрос в том, как это использовать с {$product.image} например
                1. Петропавловский Артем 22 июня 2017, 11:06 # 0
                  У нас миниатюры называются small, medium и big. Соответственно выводить нужно так:
                  {$product.small}{$product.big}{$product.medium}
                  1. Леонид 22 июня 2017, 11:09 # 0
                    а, понял. Я почему-то думал что-то вроде — {$product.image['small']}. Спасибо
                    1. Петропавловский Артем 22 июня 2017, 11:12 # 0
                      Тут я ошибся. На одном из проектов так выводил
                      {if $big?}
                      		<img src="{$big}" alt="{$pagetitle}" title="{$pagetitle}" class="img-responsive center-block"/>
                      		{else}
                      		<img src="{'assets_url' | option}components/minishop2/img/web/ms2_small.png"
                      		srcset="{'assets_url' | option}components/minishop2/img/web/ms2_small@2x.png 2x"
                      		alt="{$pagetitle}" title="{$pagetitle}" class="img-responsive center-block"/>
                      		{/if}
                      1. Леонид 22 июня 2017, 11:31 # 0
                        ага, вот я и думаю, что странноватый вывод и не работает)
                  2. Петропавловский Артем 22 июня 2017, 11:07 # 0
                    ну, и includeThumbs то же самое: small medium и big.
                    1. Андрей 30 августа 2019, 20:30 # 0
                      У меня не работает ни так, ни эдак, выводится только основное изображение… Начинаю сомневаться в необходимости прописывать эти уменьшения, в чанках всё равно прописываем {$image}, зачем тогда эти смолы, медиумы и биги?
      2. Сергей 06 апреля 2017, 09:43 # 0
        У меня нет в настройках ms2_template_category_default. Я ничего не проставил) Надеюсь все получится сделать без него
        1. Леонид 22 июня 2017, 11:07(Комментарий был изменён) # 0
          И еще вопрос, может подскажете. В письме на почту не приходит атрибут src, собственно, как и его значение из тэга img. Хотя в самой корзине всё отображается. Тоже самое и с img style="{$style.logo}" src="{$site_url}assets/template/img/mailLogo.png"
          1. Петропавловский Артем 22 июня 2017, 11:10 # 0
            Почитайте про fenom. В письме адрес изображения должен быть абсолютный, включая URL сайта.
            1. Леонид 22 июня 2017, 11:11 # 0
              {$site_url}assets/template/img/mailLogo.png — так разве это не абсолютный адрес изображения?
              1. Петропавловский Артем 22 июня 2017, 11:14 # 0
                Я вам про fenom не зря написал. Так должно быть
                {$_modx->config.site_url}assets/template/img/mailLogo.png
                1. Леонид 22 июня 2017, 11:28 # 0
                  неа, всё равно пропал атрибут
                  1. Петропавловский Артем 22 июня 2017, 11:33 # 0
                    почтовый сервер не лочит картинки?
          2. Леонид 22 июня 2017, 11:35 # 0
            с этого же хоста другие сайты отправляют из коробки сразу, но их делал не я…
            1. Raiz 26 июля 2017, 16:20 # 0
              Я сделал все по инструкции в MS2 прописал yнастройки small, medium, big, но у меня почему то не создаются 3 папки с разными размерами картинок, а выводится только стандартные настройки размеров картинок.Подскажите пожалуйста в чем проблема?
              1. Евгений 23 января 2018, 19:33 # 0
                Создал шаблон «Категории товаров». Создаю категорию товаров и назначаю ей шаблон «категория товаров» и при просмотре стилей нет. Создаю прост документ и назначаю шаблон «категория товаров» страница выглядит нормально. В чем может быть проблема?
                1. ivan 06 января 2019, 23:21 # 0
                  Здравствуйте, так же делал все по видео. При просмотре категории — тянет шаблон Главной страницы
                2. Андрей 06 февраля 2018, 14:03 # 0
                  Артем, добрый день!Подскажите пожалуйста, как прописать свойства в параметрах thumbnails так, чтобы фон у генерируемых изображений был прозрачный?Загружаю png с прозрачным фоном, хочу тоже png в трех размерах (big, medium small) с прозрачным фоном. На деле получается, что он фон задает везде и белый.Спасибо
                  1. Петропавловский Артем 06 февраля 2018, 14:21 # 0
                    Попробуйте сделать следующее:Переходим в Источники файлов (Медиа -> Источники файлов), выбираем ms2images -> Свойства и в настройке thumbnails напишите что-то наподобие:
                    {"small":{"w":330,"h":209,"q":100,"zc":"0","bg":"","ra":1},"middle":{"w":159,"h":330,"q":100,"zc":"1","bg":""}}
                    Обратите внимание на параметр «ra»:1. Должно помочь.
                    1. Андрей 06 февраля 2018, 15:40 # 0
                      Артем, спасибо большое все получилось! Успехов тебе!
                  2. Tim Olien 15 октября 2018, 16:40 # 0
                    А почему то при установке Mini shop на сайте возникла ошибка 500 и в админке то же самое
                    1. avarov 28 февраля 2019, 01:49 # 0
                      здравствуйте, не могу просмотреть созданный ресурс, ошибка 404
                      1. Олег 04 августа 2020, 00:04(Комментарий был изменён) # 0
                        Артём доброго вам времени суток. Следуя вашим урокам и примерам, столкнулся с такой проблемой. Вот скриншот: prntscr.com/ttg549 Не загружается картинка. В документации смотрел, но мне ничего не помогло. Возможно что-то упустил, хотя все делал согласно примерам из уроков. Вы сможете подсказать, из за чего могла быть вызвана такая ошибка?P.S. я понимаю уроки были уже давно. и возможно какая то не совместимость, хотя я не знаю
                        1. Александр 17 августа 2022, 18:29 # 0
                          А у меня беда — не создается категория товаров. все падает когда я меняю тип на «категория товаров» и наживаю озранить

                          Наши клиенты

                          Многие компании уже доверяют нам. Будьте в их числе!

                          Хотите реализовать проект?

                          Контакты

                          Напишите нам - мы расскажем вам много интересного!


                          Пермь, шоссе Космонавтов 252, офис 218