Логотип imagecms

Преимущества шаблона Multishop

Представляем вашему вниманию фундаментальный для наших пользователей шаблон - Multishop, который полностью переписан с использованием современных технологий и методологий разработки. О всех его новшествах и преимуществах для работы вашего интернет-магазина и поговорим далее.

Обновленная адаптивная версия

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

Избавились от таких старых багов:

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

Обновленная навигация

Один из самых сложных элементов адаптивы для комфорта пользователей - детально продуманная навигация. Вся навигация шаблона Multishop удобно расположена в боковой выплывающей панели, к чему привыкли пользователи смартфонов. Это максимально приближает шаблон к большинству мобильных приложений. Навигация позволяет вместить неограниченное количество вложенности без потери вида и удобства в использовании.

 

Гибкость к расширениям

Препроцессор Sass для написания CSS-кода

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

Использование БЭМ-методологии

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

Универсальный дизайн

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

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

Корректное отображение при любом наборе элементов

Если забрать из шаблона некоторые блоки (новости, виджеты, баннера), то он не утратит целостности и будет выглядеть все также гармонично и корректно.

Стабильность работы

Модульная сетка Bootstrap

Для создания фундамента интерфейса шаблона была использована модульная сетка самого популярного фреймворка Bootstrap. Это дает прочную основу для структуры шаблона на всех устройствах. Расширять и модифицировать разметку очень просто, и нет причин опасаться, что что-то может некорректно отобразиться. Сетка также дает фундамент под адаптивную версию сайта. Она проверена сотнями разработчиков, всегда стабильна и может быть обновлена в любой момент (когда появится новая улучшенная версия). Клиент раз и навсегда забудет о том, что где-то может “поехать” верстка.

Уничтожили все баги из предыдущих шаблонов: 

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

Отсутствие багов переполнения

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

Дополнительные возможности

Микровзаимодействие

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

Локализация под 3 языка

Шаблон полностью переведен на языки:

  • английский 
  • русский 
  • украинский 

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

Настройка баннеров из административной панели

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

  • период изменения баннеров 
  • автозамена при ожидании 
  • показывать или нет стрелки и навигационные указатели 
  • выбор между эффектами изменения. 

Автоматический вывод информации про покупку на карточку товара

Автоматический вывод информации про покупку на карточку товара 

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

Возможность добавить описание к параметрам товара

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

Усовершенствованная типографика

В шаблоне предусмотрены элементы типографики для:

  • заголовков 6 уровней 
  • абзацев, цитат 
  • нумерованных и ненумерованных списков 
  • таблиц 
  • медиа-элементов 
  • таких стилей текста: перечеркнутый, выделенный, кавычки, аббревиатуры, и подобных. 

Информирование о скидке

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

Дополнительные поля пользователя

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

  • регистрация пользователя
    регистрация пользователя
  • оформление заказа
    оформление заказа
  • личный кабинет
    личный кабинет


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

Multishop послужит фреймворком для остальных шаблонов ImageCMS Shop со следующих релизов, так как мы планируем переписать все наши шаблоны для интернет-магазинов. Они, как и Multishop, без багов и сбоев будут работать в два раза быстрее.

Читайте также:
Подпишитесь на еженедельную рассылку и получайте скидки на популярные e-commerce продукты
И совсем скоро Вы станете гуру в e-commerce, веб-разработке, SEO и в интернет-маркетинге! Развивайте свой бизнес с актуальной информацией, успешными кейсами и вдохновляющими примерами.
Обсуждение этого поста (Комментарии: 33)
Вы должны , чтоб присоединиться к разговору
Давайте дружить!

Узнавайте все новости, получайте обзоры, кейсы
и другие полезные материалы по e-commerce через социальные сети!

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

    2. В результатах поиска дублируются товары. Пример по ссылке - http://multishop.imagecms.net/shop/search?text=спорт

    3. В категории где таблица товаров если у одного товара много характеристик, а у другого рядом меньше - смотрится совсем печально. Место пустует например тут - http://multishop.imagecms.net/shop/category/elektronika/planshety
    Можно было бы реализовать как на шаблоне Full Market, чтобы характеристики выпадали при наведении.

    Это на первый взгляд что бросилось в глаза. А так работа проделана колоссальная, очень приятный, легки и ненавязчивый шаблон. Так держать команда ImageCMS!

    Сохранить
    • Большое спасибо за отзыв, мы очень старались) Также - прошу учесть, что это версия больше для разработчиков, без множества скриптов. В следующих релизах мы на нем сделаем основной шаблон.

      По поводу первого пункта - не совсем понятно, можете заскринить?

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

      Сохранить
      • Скрин куда отправлять?

        Сохранить
        • Уже не нужно, увидели ошибку. Будем смотреть. Большое спасибо за замечания!

          Сохранить
      • Вот скрины:
        1. не переключается номер:
        http://prntscr.com/a7pr9i
        http://prntscr.com/a7prif
        в категориях работает.

        2. на мобильной версии в карточке товара налазят друг на друга "Добавить в избранные" и "Добавить к сравнению"
        http://prntscr.com/a7ps2b

        3. Также присоединяюсь к Deem - перепады по высоте как-то не совсем смотрятся:
        http://prntscr.com/a7ptuw - в категориях еще в принципе решаемо скрытием характеристик, а вот на главной уже сложнее подровнять: http://prntscr.com/a7pt9u

        4. в карточке товара, в нижней части, как по мне слишком наляписто смотрятся аксессуары и просмотренные товары:
        http://prntscr.com/a7pux1

        Лично мне понравилось отображение главной, категории и нижней части карточки товаров реализованной под мобильную версию! Не так наляписто, только важная информация и компактно:
        http://prntscr.com/a7pw0v
        http://prntscr.com/a7pw6v
        http://prntscr.com/a7pweg
        http://prntscr.com/a7pwjn

        Сохранить
        • Спасибо за полезный отзыв. По поводу пункта 3, не хотели перегружать шаблон лишним. Он задумывался больше как легкий прототипный вариант, на базе которого будет легко создавать новые шаблоны и магазины. Но мы подумаем как найти оптимальное решение.

          Сохранить
      • Кстати, по поводу 3-го пункта, там без скриптов, css-ом все решается..
        Будем маневрировать)

        Сохранить
  • Он на 4.8.1 работать будет или обновляться?

    Сохранить
    • Нужно обновится, работает только на 4.9.

      Сохранить
      • Обновления, кстати, уже сегодня будут доступны.

        Сохранить
        • Точно сегодня?
          Почти конец рабочего дня.

          Сохранить
  • Не работает(((

    Сохранить
  • В каталоге товаров в верстке есть переключение вида отображения товаров (список, таблица). Но переключатели скрыты - Их скрыли, потому что скриптов нет?

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

      Сохранить
  • еще заметил, что много товаров имеют 1 отзыв, но в низу ни одно отзыва нет!
    http://prntscr.com/a7q34r
    также ранее в шаблоне Fullmarket при нажатии на количество отзывов прокручивало страницу до уровня отзывов, а в данном шаблоне нет.

    в отзывах не нашел кнопки "ответить" на нужный отзыв:
    http://prntscr.com/a7q4vq

    Сохранить
    • [также ранее в шаблоне Fullmarket при нажатии на количество отзывов прокручивало страницу до уровня отзывов, а в данном шаблоне нет.]
      Да, пока этого нету, спасибо, учтем.

      [в отзывах не нашел кнопки "ответить" на нужный отзыв:
      http://prntscr.com/a7q4vq]
      Пока ответы на комментарии не реализованы, задача запланирована, решили не откладывать публикацию шаблона из-за этой возможности.

      [еще заметил, что много товаров имеют 1 отзыв, но в низу ни одно отзыва нет! http://prntscr.com/a7q34r]
      Спасибо! Посмотрим в чем дело.

      Сохранить
      • Нужно для элемента <iframe> с видео добавить стили:
        max-width: 100%;
        height: auto;

        Сохранить
      • да, очень не хватает кнопки "ответить"

        Сохранить
  • Добрый день.
    Подскажите, как поправить в шаблоне Full Market адаптацию видео в описании? То есть, если в описании товара есть видео (пример: http://demoshop.imagecms.net/shop/product/asus-transformer-book-t100ta) - в мобильной версии видео не адаптируется под размер экрана:
    http://prntscr.com/a83tro

    Сорри что спрашиваю в этой теме, просто в Multishop это уже исправлено, и возможно решение можно взять с данного шаблона:
    http://prntscr.com/a83uot

    Заранее благодарен.

    Сохранить
  • Для работы со стилями и скриптами шаблона используйте эту инструкцию - http://docs.imagecms.net/rabota-s-shablonom-multishop/rabota-s-css-i-javasctipt-dlia-razrabotchikov

    Сохранить
  • Если в карточке товара выбрать вариант товара чтобы поменялось фото, например другой цвет, то также меняются фото аксессуаров.
    Печаль.
    http://prnt.sc/aa13tq

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

    Сохранить
  • Решение очень простое. Перенесите в файле shop\product.tpl атрибут data-product-scope в блок content__row в строке 8, то есть должно быть так - http://prntscr.com/aao1py

    Сохранить
  • Добрый вечер. Скажите, каким образом обновить версия сайта до 4.9?

    Сохранить
  • При нажатии на виджет "Настройки" "Обновления системы" написано на белом экране "Ошибка вервера 500"
    Что это?

    Сохранить
  • В формах "Регистрация" и "Оформить заказ" надо обязательно вписывать город.
    Но почему он не запоминается в Персональных данных? И каждый раз при покупке его надо вводить снова! Не проще ли его вообще убрать? Хотя бы из обязательных?!

    Сохранить
  • "Оформление заказа" занимает 2 экрана! При ошибке заполнения (например, не вписан город) сообщение об этом на 2-ом экране! А на смартфоне - на 5-м экране. Но при этом на 1-м экране "Подробности заказа". Большинство пользователей будут уверены, что всё ок, и будут уходить, не завершив заказ. А это потеря клиентов, потеря выгоды!

    Сохранить
    • Добрый день. Спасибо за ценный замечания. Учтем в будущих обновлениях. На будущее, если не сложно, можете писать подобные сообщения на форум. Можно прямо в тему с этим шаблоном http://forum.imagecms.net/viewtopic.php?id=4845
      За постом в блоге не слежу постоянно. Спасибо.

      Сохранить
  • Вы пишите:
    Избавились от таких старых багов: меню каталога пряталось при прокрутке вниз

    А сейчас разве работает по другому?

    Сохранить
    • На этом шаблоне меню каталога работает совсем по другому, Аналогичной ошибки быть в в принципе не может. Используется выносная панель слева - http://take.ms/mNBJR
      А на других шаблонах используется выпадающее меню вниз.
      Если Вы увидели ошибку, опишите ее более подробно, спасибо.

      Сохранить
      • Вы сейчас написали про меню на малых экранах. А я поняла - о меню на больших. (более13"). А вот о чём написано в статье тогда не понятно.
        Не знаю ошибка это или нет, мне не понятно утверждение из вашей статьи .

        Сохранить
  • Шаблон ещё не доработан, как я поняла. Предполагаются ещё некоторые обновления. Но возможности обновиться до новой версии через панель управления пока нет. Только путём удаления старого, и установкой нового. Без возможности бекапа. Так что наверно лучше подождать пока данный шаблон будет доработан и потом его использовать.

    Сохранить
Консультация по ImageCMS Shop
 
Уже уходите? Еще секундочку!

Зарегистрируйтесь, и вам навсегда обеспечены скидки на популярные
e-commerce продукты! Также мы будем делиться с вами самой ценной
информацией для развития вашего бизнеса.

или