Обновление 1.2.0."Одежда, обувь и аксессуары. Современный интернет-магазин"

Обновление 1.2.0."Одежда, обувь и аксессуары. Современный интернет-магазин"

17 июля 2013


Автор: Голубев Владислав
Обновление решения «Одежда, обувь и аксессуары. Современный интернет-магазин» 1.2.0 от 17 июля 2013 года включает в себя следующее:

1. Отложенная загрузка фотографий товаров

На странице каталога всегда много товаров, а значит много картинок. Это сильно влияет на скорость загрузки страницы в целом. По-умолчанию на странице раздела отображается 30 товаров – это всего 10 строк товаров по 3 в каждой. А что если нужно показывать больше товаров? Например, 60? Ответ очевиден – скорость загрузки страницы значительно упадёт.

Для оптимизации данной ситуации и повышения скорости загрузки страниц в целом мы реализовали отложенную загрузку изображений товаров. Давайте посмотрим, как это выглядит:

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

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

2. Подсказка к корзине в шапке сайта

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


3. Поиск в шапке сайта – отображение фото и цен товаров

Теперь быстрый поиск в шапке сайта стал намного удобнее и информативнее. Для товаров отображается изображение и цена. Для раздела каталога также отображается изображение (если оно есть) и полный путь к разделу:


4. Настройка генерации превью товаров

Изначально каталог был предназначен для товаров с горизонтальными фотографиями (высота изображения больше чем ширина) и при попытке размещения более квадратных фотографий происходила генерация превью с «обрезкой» слева/справа, что естественно выглядело не очень презентабельно:

Специально для таких случаем мы реализовали возможность менять настройки генерации превью товаров в списках - слайдерах на главной странице (новинки, распродажа) и в разделах каталога. Настройки доступны в административной части сайта в разделе «Настройки › Настройки продукта › Настройки модулей › Одежда, обувь и аксессуары. Современный интернет-магазин», вкладка «Изображения»:

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

Итак, возвращаясь к примеру «обрезки» превью товаров, посмотрим как будут генерироваться превью с настройками по-умолчанию:

Получилось, что превью создаются с сохранением пропорций и фото не «обрезается» слева/справа.

Что нужно учесть: на сайте используется кеширование, поэтому изменение настроек генерации превью не повлияет на отображение уже закешированных страниц. Необходимо сбросить кеш сацта. Для этого в административной части сайта перейдите в раздел «Настройки › Настройки продукта › Автокеширование» на вкладку «Очистка файлов кеша», выберите режим «Все» и нажмите «Начать».



5. Полная поддержка объединения CSS и JS файлов

Решение было проверено и оптимизировано для работы с новыми возможностями платформы «Объединять CSS файлы» и «Объединять JS файлы». Главный плюс от использования данных возможностей – ускорение загрузки страниц сайта. Вместе с нашим новым функционалом «отложенной загрузкой изображений товаров» данный функционал дал прирост в скорости загрузки страниц магазина почти в 2 раза!

Для включения данного функционала в административной части сайта перейдите в раздел «Настройки › Настройки продукта › Настройки модулей › Главный модуль» на вкладку «Настройки»:


6. Отображение описания раздела каталога

Для SEO немаловажным является наличие описания раздела на странице, поэтому мы добавили отображение описания раздела после списка товаров (страница раздела каталога):



Итак, перечислим всё, что вошло в обновление 1.2.0 ещё раз:

  1. Отложенная загрузка фотографий товаров
  2. Подсказка к корзине в шапке сайта
  3. Поиск в шапке сайта – отображение фото и цен товаров
  4. Настройка генерации превью товаров
  5. Полная поддержка объединения CSS и JS файлов
  6. Отображение описания раздела каталога
Как всегда, все эти обновления вы можете получить в административной части в разделе "Marketplace -> Обновление решений".

Обновить шаблон вашего сайта Вы можете в разделе «Настройки › Настройки продукта › Настройки модулей › Одежда, обувь и аксессуары. Современный интернет-магазин», вкладка «Обновление».