Примеры интернет-магазинов созданных на WordPress

В стандартной конфигурации WordPress нет инструментов для электронной коммерции, поэтому создать интернет-магазин нельзя. Но всё меняется после установки плагинов. Самое популярное расширение для электронной коммерции — WooCommerce. Это бесплатный плагин, который добавляет на движок инструменты, необходимые для нормальной работы магазина: каталог товаров, страницы оформления заказа, корзину, онлайн-оплату и доставку.

Связка WordPress и WooCommerce — один из самых простых и распространённых способов создания интернет-магазина. Для работы с ней не нужны навыки в веб-разработке — можно обойтись инструментами визуального редактора и стандартными настройками плагина. Кроме WooCommerce есть и другие расширения для электронной коммерции, однако их выбирают гораздо реже.

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

1. Заборы и ограждения под ключ

Заборы и ограждения под ключ

Простой сайт с каталогом заборов, ворот, материалов для ограждений, товаров для дачи. На главной странице — слайдер, который не несёт особого смысла и карточки категорий из каталога. Для общения с клиентами используется виджет «ВКонтакте».

Страницы категорий выстроены по одному принципу. Сначала идёт описание товаров или услуг с прайс-листом. Ниже — конкретные товары и услуги с ценами. У каждой позиции из каталога есть собственная страница с описанием, стоимостью и кнопкой «Заказать». При нажатии на неё открывается форма обратной связи, в которой пользователь должен указать имя, телефон и e-mail для продолжения общения с менеджером. Товары также можно добавлять в список желаний и сравнительный лист.

На странице товара отображаются дополнительные блоки: «Похожие товары» и «Недавно просмотренные товары». Это полезные секции, которые вовлекают пользователя в изучение каталога и помогают быстро вернуться к предыдущим карточкам.

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

2. Авточехлы, автоковрики и другие автоаксессуары

Авточехлы, автоковрики и другие автоаксессуары

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

Корзина открывается на отдельной странице. В ней можно удалить товар, изменить количество, выбрать способ доставки. Но есть одно неудобство. Если покупатель меняет количество товара, то цена не пересчитывается автоматически — для этого нужно нажать на кнопку «Обновить корзину». При этом стоимость доставки добавляется к цене товара автоматически.

Если клиент оформляет первый заказ, то ему нужно обязательно указать имя, фамилию, телефон и e-mail. Остальные поля в форме опциональные. На странице оформления можно также изменить способ доставки и выбрать метод оплаты: банковской картой, переводом на карту, банковским переводом. После оформления первого заказа клиент получает доступ в личный кабинет, где может следить за статусом своей покупки.

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

3. Кожгалантерейные изделия и дорожные аксессуары

Bagazh Anturazh

Багаж Антураж – оффлайн компания с офисом в г.Уфа. В 2017 году был запущен интернет-магазин для осуществления розничной торговли по всем регионам России.

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

Первый экран занимает рекламный баннер с ссылкой на каталог товаров. Ниже – преимущества компании, галерея с активными ссылками на разделы каталога и текстовый блок. В подвале продублированы меню и контакты, размещены кнопки соцсетей и интерактивная карта.

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

Общее впечатление: на сайте отсутствуют важные инструменты, влияющие на конверсию сайта, например, прием онлайн-платежей, чат с менеджером, личный кабинет покупателя. Странно работает функция вишлиста – при добавлении товара в избранное, он автоматически попадает в корзину. К оформлению магазина замечаний нет.

4. Продукция для красоты и здоровья

Artlife Market

АртЛайф – крупная компания-производитель БАДов и продуктов функционального питания, реализующая свою продукцию по реферальной системе.

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

Каталог продукции скрыт под кнопкой в шапке сайта. При этом перейти можно только в конкретный подраздел, посмотреть полный каталог невозможно. Сортировка в подразделах каталога также отсутствует. Онлайн-оплата не подключена.

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

Установлен виджет push-уведомлений от платформы SendPulse с ссылками на Telegram-канал и аккаунты в социальных сетях.

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

5. Керамика ручной работы

Agami Ceramics

Компания Агами Керамика занимается производством посуды для ресторанов и керамики для дома.

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

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

В подвале есть ссылки на Telegram-канал, страницу ВКонтакте, контактные данные, условия оплаты и доставки.

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

6. Натуральная крымская косметика

Aroma Crimea

В магазине Aroma Crimea можно приобрести натуральную косметику различных крымских брендов. На сайте действует накопительная система скидок для зарегистрированных покупателей.

Первый экран содержит все основные элементы продающего лендинга – фоновое изображение, заголовок, призыв к действию (ссылки на каталог продукции и производителей).

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

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

Для оформления заказа необходимо указать телефон и email, что позволит собрать базу подписчиков. Форма подписки также расположена в подвале сайта. Всплывающее окно от SendPulse предлагает посетителям отправку push-уведомлений.

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

7. Авторские стикеры

Nokids Stickers

NKS (NoKidsStickers) – команда художников, занимающаяся разработкой стикеров на виниловой водостойкой пленке. Дизайн сайта разработан в профессиональной вебстудии и соответствует творческому направлению деятельности компании.

В закрепленной шапке сайта находится строка поиска, ссылки на разделы каталога, кнопки входа/регистрации, вишлиста и корзины. Перейти в нужную коллекцию можно также из слайдера, занимающего первый экран страницы, и расположенной ниже галереи.

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

Цены на стикеры внутри категорий одинаковые, поэтому в сортировке указано только два критерия – по новизне и популярности. Каждая позиция имеет кнопки быстрого просмотра и добавления в избранное.

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

Общее впечатление: удобный во всех отношениях сайт с приятным дизайном. Виджет онлайн чата позволяет задать вопросы менеджерам непосредственно на сайте, ВКонтакте и Instagram.

Выводы

На WordPress можно создать полнофункциональный интернет-магазин. Для этого обычно используют плагин WooCommerce с другими расширениями для электронной коммерции. Даже если специфика бизнеса не позволяет продавать товары онлайн (например, заборы и материалы для ограждений), можно сделать удобный каталог с подробной информацией о продукции.

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

У всех рассмотренных выше сайтов был адаптивный дизайн. Это зависит от того, какой шаблон используется. Если вы будете делать интернет-магазин на WordPress, обратите внимание на эту характеристику тему. Шаблоны с адаптивным дизайном обычно помечены как mobile-friendly и responsive. Среди бесплатных вариантов их достаточно много, так что будет из чего выбирать, не говоря уже о премиум-темах.

» Примеры сайтов » Примеры интернет-магазинов созданных на WordPress