Новое возвращение: адаптивный шаблон PrestaShop от TemplateMonster

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

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

Команда TemplateMonster проделала большую работу и вслед за адаптивными шаблонами Drupal теперь презентует новую линейку адаптивных шаблонов PrestaShop. Адаптивный дизайн это не просто перестановка блоков, увеличение или уменьшение изображений и размеров шрифта в зависимости от размеров экрана, темы для создания онлайн-магазинов превратились практически в «приложения для смартфонов». Абсолютно во всех элементах шаблонов был произведен рестайлинг. Изменилось все, в том числе и расположение “Корзины покупок”, были добавлены скрипты Ajax для перезагрузки страниц, элементы для сенсорных экранов также были тщательно продуманы и реализованы наиболее удобным способом.

А сейчас давайте рассмотрим самые крутые и наиболее важные особенности шаблонов PrestaShop.

Ниже вы можете увидеть три основных адаптивных макета PrestaShop. С первого взгляда все они похожи друг на друга, но на самом деле это далеко не так.

Давайте начнем с верхней панели, где в правой части находятся кнопки Языка, Валюты и Входа в систему.

При нажатии на любую из кнопок появляется выпадающее меню. Для Языка, например, это 5 дополнительных пунктов, для Валюты — 3 пункта.

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

***

Корзина покупок

А теперь давайте взглянем на новшества в “Корзине покупок”:

В новых адаптивных шаблонах PrestaShop нет необходимости открывать “Корзину”, чтобы просматривать и управлять заказанными товарами. Достаточно просто нажать на кнопку “Корзина”, как сразу появится выпадающее меню с заказанными товарами. Удалить любой товар можно нажатием на крестик.

Выбранный товар добавляется в “Корзину” с симпатичной анимацией.

***

Просмотр товара

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

Категории

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

Параметры вывода товаров

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

***

Страницы со скидками

Давайте взглянем на “Страницу со скидками”. По умолчанию там доступны два типа просмотра товаров: Mosaic и List.

***

С адаптивными шаблонами немного разобрались, а теперь пришло время посмотреть на другие адаптивные шаблоны PrestaShop.

Модный магазин на адаптивном шаблоне PrestaShop

***

Спортивный онлайн-магазин на адаптивном шаблоне PrestaShop

***

Модный интернет-магазин на базе адаптивной темы PrestaShop

***

Сайт для электронной коммерции на адаптивном PrestaShop шаблоне

***

Магазин по продаже мобильных устройств на базе адаптивного шаблона PrestaShop

***

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

2 комментариев

  1. Александр

    Ольга, добрый день!
    А что делать, если сайт уже сделан…Я вот это не понял…Шаблоны ведь для новых сайтов?

    Спасибо.

  2. Ольга, добрый день!
    Присоединяюсь к предыдущему вопросу…А что делать, если сайт уже сделан? Спасибо.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>