Как создать интернет магазин на вордпресс

Как создать интернет-магазин в WordPress

С каждым годом активность интернет-покупателей растёт. Популярность интернет-продаж подталкивает владельцев крупного и малого бизнеса к созданию интернет-магазинов. Сложно ли самому создать интернет-магазин? Не настолько, чтобы не попробовать. Тем более мы вам поможем — расскажем по шагам, как создать интернет-магазин на WordPress.

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

При выборе хостинга обратите внимание на объём дискового пространства. Если вы хотите разместить в магазине несколько десятков товаров — вам подойдёт тариф из раздела «Эконом» или «Скоростные». Если в магазине будет более сотни товаров, лучше выбрать VIP-тарифы хостинга с большим объёмом дискового пространства.

Создайте сайт легко

Чтобы не тратить время на настройку домена, хостинга и CMS, воспользуйтесь услугой REG.Site.

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

Плагины для интернет-магазина WordPress

WordPress ― это самая популярная CMS для создания сайтов. Создать интернет-магазин на WordPress можно с помощью плагинов. Самые популярные плагины:

• Ecwid,
• WooCommerce,
• UNIVERSAM
• WP Shop.

Один из самых практичных плагинов онлайн-торговли — WooCommerce. Ниже мы рассмотрим его подробнее и покажем, как создать интернет-магазин с его помощью.

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

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

Вы можете активировать плагин WooCommerce для нового или уже готового сайта WordPress по нашей инструкции.

Как создать интернет-магазин на WordPress

Чтобы создать интернет-магазин на Вордпресс, установите и активируйте плагин WooCommerce. Затем настройте интернет-магазин, добавьте товары и установите дополнительный настройки для оптимизации работы магазина. Ниже мы подробно описали каждый шаг.

Шаг 1. Установите WooCommerce

Нажмите на Плагины ― Добавить новый:

В поисковой строке введите WooCommerce, найдите нужный плагин в списке и нажмите Установить:

После установки нажмите Активировать:

Готово, теперь приступим к настройке интернет-магазина.

Шаг 2. Настройте интернет-магазин

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

Введите адрес и индекс. Если вы разработчик сайтов и вам надо создать интернет-магазин для клиента, то поставьте галочку в строке «Я настраиваю магазин для клиента». Нажмите Продолжить:

Выберите категорию, к которой относится товар. Нажмите Продолжить:

Выберите тип товара. Продукт может быть как физический, так виртуальный. Нажмите Продолжить:

Во вкладке «Данные о бизнесе» укажите примерное количество товаров, которое вы планируете разместить на сайте. Также укажите, продаёте ли вы товар на другой платформе или в физических магазинах. Укажите примерный годовой доход компании:

Во вкладке «Бесплатные функции» можно настроить дополнительные функции, которые могут пригодиться для вашего бизнеса (Jetpack, MailPoet, объявлений и рекламы Google, Mailchimp, Creative Mail). Чтобы выбрать дополнительные функции, нажмите на стрелку. Перед вами откроется список. После всех настроек нажмите Продолжить:

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

Готово, вы настроили интернет-магазин. Теперь добавим в него товары.

Шаг 3. Добавьте товары

Перейдите на вкладку Товары — Создать товар:

Впишите название товара и добавьте его описание. Справа в блоке «Категории товаров» вы можете назначить уже готовую категорию или нажать + Добавить категорию и указать свою:

В блоке «Данные товара» можно указать различные параметры товара. Разберём каждый из них отдельно.

• Во вкладке Основное можно выбрать «Тип товара». Самый распространённый тип — «Простой товар». Для него можно установить «Базовую цену», «Цену распродажи» и запланировать конкретную дату распродажи. Если у вас виртуальный или скачиваемый продукт, вы также можете выбрать один из этих типов, поставив галочку:

• Во вкладке Запасы можно указать «Артикул» и «Статус остатка». Если вы хотите, чтобы товар продавался индивидуально в одном заказе, поставьте галочку Продавать индивидуально:

• Во вкладке Доставка можно указать «Вес», «Размеры товара» и «Класс доставки»:

• Во вкладке Сопутствующие можно добавить товары, которые будут предлагаться пользователю вместе с основным товаром. Это поможет продвигать товар при помощи «Апсейл» (up-sells — увеличение суммы продажи) и «Кроссел» (cross-sells — перекрёстные продажи):

• Во вкладке Атрибуты можно добавить дополнительные параметры товара. Например — цвет, имя или значение. После заполнения нужных полей нажмите Сохранить атрибуты:

• Во вкладке Дополнительно можно создать примечание к покупке, выбрать порядок предъявления продукта и включить (или отключить) возможность оставлять отзывы о товаре:

• В поле Краткое описание товара добавьте комментарий, который будет располагаться под названием продукта. Справа в блоке «Метки товара» добавьте теги для удобного поиска в магазине. В блоке «Изображение товара» загрузите нужную картинку. Также можно сделать галерею:

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

На вкладке Товары можно увидеть все добавленные товары. Ими можно управлять — удалять, редактировать или дублировать. Также вы можете выбрать несколько товаров, чтобы отредактировать их вместе. Чтобы сделать товар рекомендуемым, отметьте товар Звездочкой:

Далее в разделе Настройки можно настроить параметры магазина — «Адрес», «Дополнения по адресу», «Город», «Страна/Область»:

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

В Товарах настраиваются: единицы измерения товара, формы работы с отзывами, корзина.

Во вкладке Доставка выбирается регион доставки и её методы. Доступен «Самовывоз», «Бесплатная доставка» и «Единая ставка» (единая стоимость доставки).

Во вкладке Платежи настройте методы оплаты: Прямой банковский перевод, Чековые платежи, Оплата при доставке, PayPal.

Кроме четырёх основных пунктов настройки товара есть ещё дополнительные настройки учёта и приватности, Email, Интеграция со службами MaxMind и дополнительные настройки страниц (корзина, оформление заказа, страница личного аккаунта).

Дополнительные плагины для создания интернет-магазина

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

Платёжные системы

Fondy позволяет интернет-магазину на базе WooCommerce принимать онлайн-оплаты картой от клиентов. Плагин может: адаптировать дизайн оплаты под сайт, отражать статус платежа и заказа в личном кабинете клиента, защищать транзакции по банковским стандартам платёжных систем. Плагин даёт возможность настроить регулярное списание с карты клиента (пригодится для сервисов, которые работают с подписками).

Stripe поддерживает 14 языков и более 135 валют. Доступны все основные цифровые варианты оплаты. Плагин поддерживает даже краудфандинговые проекты. Большие возможности кастомизации и высокая безопасность платёжных операций. Не требует ежемесячной оплаты, оплачивается только комиссия с транзакции.

Mollie Payments ― плагин для быстрой интеграции всех основных способов оплаты в WooCommerce. С его помощью можно принимать оплату с кредитных и дебетовых карт, а также международных платёжных систем (например, с PayPal).

SEO-оптимизация

Yoast SEO ― полезный плагин для SEO-оптимизации. С его помощью можно работать со сниппетом, контролировать «хлебные крошки», анализировать контент с точки зрения SEO и наполнять сайт ключевыми словами.

Второй по популярности плагин для SEO-оптимизации ― All in One SEO Pack. Это конкурент Yoast SEO. Он имеет схожие функции. Отличительной особенностью является расширенная поддержка для WooCommerce.

The SEO Framework по сравнению с предыдущими плагинами имеет меньше функций, но благодаря этому понятен и легок в использовании. Он способен удовлетворить все основные потребности SEO-оптимизации.

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

Гайд: как создать интернет-магазин на WordPress в 2023 году

Разработка сайта

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

Покажу из каких элементов и блоков состоит магазин на WordPress и плагине WooCommerce, как всё настроить через админку сайта без программирования.

Гайд подходит для новичков, и если вы уже работали с WordPress, тоже найдёте полезные советы для себя.

Пошаговый гайд: создание интернет-магазина на WordPress и WooCommerce в 2023 году

Инструментарий

Для начала давайте посмотрим что нам понадобится.

Вот какие инструменты я использовал:

CMS WordPress

Хотите научиться делать сайты?

Чтобы сэкономить на разработке или зарабатывать деньги создавая сайты для других? Недавно я записал новый курс «Идеальный сайт на WordPress» и «Лендинг в Elementor» , где рассказал пошаговый план как создавать крутые сайты.

Разработкой занимаюсь более 7-ми лет, на сайтах зарабатываю более 50 тысяч в месяц и в курсе я выложил всю технологию как делать такие сайты.

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

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

Плагин WooCommerce

WooCommerce — самый популярный плагин для магазина на Вордпресс. На сегодня активных установок плагина более 5 миллионов.

Премиум шаблон Bono от WpShop

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

Хостинг и домен

Timeweb — регистратор хостинга и домена. Чтобы мы могли разместить любой сайт в интернете нам нужен хостинг и доменное имя.

Хостинг, домен, SSL-сертификат

Разработка начинается с регистрации хостинга и домена, ещё я всем рекомендую сразу установить SSL-сертификат, чтобы сайт открывался по безопасному протоколу https.

Гайд + видеоуроки

Полностью эти шаги показывать не буду, я написал отдельную инструкцию «Что такое хостинг и домен, как правильно выбрать и зарегистрировать», можете посмотреть и повторить всё по шагам, плюс там есть видеоуроки.

Хостинг я рекомендую Timeweb . Домен регистрируйте любой на своё усмотрение, проверить на занятость и купить его можно также у Timeweb.

Сертификат SSL можно для начала поставить бесплатный, который называется Let’s Encrypt, он устанавливается также через админку хостинга Timeweb и потом самостоятельно обновляется каждые 3 месяца, установили и забыли.

Важно!

После установки SSL-сертификата подождите примерно 1 час, чтобы он был выпущен и установлен на домене.

И если в качестве хостинга вы выбрали Timeweb, то перейдите в Сайты — напротив домена нажмите шестерёнку — включите опцию «Использовать безопасное соединение https://» и «Использовать соединение HTTP/2 для доп IP-адреса», чтобы происходило перенаправление с http на https.

Если у вас другой хостинг, то спросите у службы поддержки как сделать правильное перенаправление с http на https.

Установка CMS WordPress

Движок Вордпресс я устанавливаю вручную:

• сначала создаём базу данных MySQL
• скачиваем WordPress с официального сайта wordpress.org
• редактируем файл wp-config.php
• закачиваем архив с WordPress на хостинг
• распаковываем и запускаем установку

Подробная инструкция есть в этой же статье про хостинг. И также прикреплю здесь видеоинструкцию для наглядности.

После установки мы увидим сайт, на стандартном шаблоне, с записью «Привет, Мир!». Выглядит так же? Значит всё сделали правильно.

Вид сайта сразу после установки WordPress

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

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

Выбор шаблона

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

Где взять шаблон? Есть бесплатные и платные варианты.

Бесплатные шаблоны

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

Минусы бесплатных шаблонов:

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

Если вы всё же хотите начать с бесплатного шаблона, то скачивайте его исключительно с официального сайта ru.wordpress.org/themes или с сайтов, которым точно доверяете. Если будете скачивать с левых сайтов в интернете, в 95% случаев вместе с шаблоном получите кучу вирусов.

Платные шаблоны

Плюсы платных шаблонов:

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

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

Где выбрать и купить платный шаблон?

ThemeForest.net — крупнейший магазин шаблонов в мире.

Магазин Themeforest

Только в категории eCommerce (электронная коммерция) 1300+ вариантов шаблонов и у многих внутри шаблона ещё есть целый список демо на разные тематики, в общем выбор огромный.

У меня есть подборка Топ 40 шаблонов для интернет-магазина, можете там подобрать вариант для себя.

Есть ещё отдельные веб-студии, которые не представлены на больших площадках, но которые делают крутые шаблоны. Лидером в СНГ сегменте является студия WPshop.ru , у которой на выбор всего 6, но очень популярных шаблонов.

Например, мой блог сделан на шаблоне Reboot , а для магазина есть очень крутой шаблон Bono , который я буду использовать в качестве примера создания магазина.

О шаблоне Bono

У шаблона Bono одно демо на мебельную тематику, но он подойдёт для любой тематики, просто добавьте свои данные, логотип, товары и категории, измените цвета и шрифты, получится совершенно другой магазин.

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

В итоге получился отличный шаблон, в котором собраны максимально нужные функции и убрано всё лишнее. Я делаю на этом отдельный акцент, потому что тот, кто работал с шаблонами с того же ThemeForest, меня поймёт.

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

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

Шаблон стоит 3800 р. для одного домена и 7800 р. неограниченная версия.

Ссылка на официальный сайт шаблона и на демо .

Отдельный обзор Bono можете посмотреть по этой ссылке.

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

Я буду работать на шаблоне Bono и покажу все настройки темы в этой статье.

Установка шаблона Bono

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

Лицензия Bono

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

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

Инструкция к шаблону

У всех премиум шаблонов есть документация и Bono не исключение. Ссылка на документацию приходит обычно в письме с шаблоном. У WPshop ссылку на документацию можно найти в подвале сайта. Вот прямая ссылка на страницу с документацией Bono https://support.wpshop.ru/docs/themes/bono/

Документация Bono

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

Дальше у нас есть на выбор два варианта:

1. Делаем сразу чистовой сайт со своими товарами, текстами и картинками.
2. Или устанавливаем готовые демо-данные (тестовый магазин) и редактируем под себя.

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

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

Установка плагина WooCommerce

Перед установкой демо-данных давайте установим WooCommerce — плагин, который добавит функционал интернет-магазина.

Переходим в Плагины — Добавить новый — в поиске пишем название WooCommerce, устанавливаем и активируем официальную версию (более 5 млн установок).

Установка плагина WooCommerce

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

Установка демо-данных

Ссылка на инструкцию по установке демо-контента https://support.wpshop.ru/docs/themes/bono/install/ (опуститесь ниже в раздел Демо-контент)

Установка демо-контента Bono

После установки обновите сайт и контент появится.

Как выглядит сайт после установки демо-данных

У меня всё установилось хорошо. Иногда не все элементы отображаются, тогда их нужно вывести вручную. В моём случае отдельно я добавил меню, рубрики товаров на главной и виджеты в подвал. Если у вас будут трудности с установкой, напишите ниже в комментариях к статье или в поддержку шаблона.

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

Типы контента у интернет-магазина

Давайте расскажу какие типы контента вы сможете размещать на сайте.

Страницы

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

Обязательные

Должны быть у каждого магазина, они создаются автоматически при установке WooCommerce:

• Страница магазина — вывод каталога всех товаров.
• Страница корзины — товары, которые вы добавили в корзину.
• Страница оформления заказа —вывод формы заказа и итоговая сумма покупки.
• Страница «Моя учётная запись» — страница, через которую покупатели могут авторизоваться в личный кабинет и отслеживать свои покупки.
• Избранное — товары, которые посетитель добавил в Избранное.
• Сравнение — товары, которые посетитель отметили для сравнения.

Второстепенные

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

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

Статьи

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

Создайте страницу для статей, например «Блог», затем перейдите Настройки — Чтение — на главной отображать Статическую страницу — для страницы записей выберите созданную страницу Блог — сохраните настройки.

Вывод страницы блога

Товары

Этот тип контента добавляет плагин WooCommerce. Товары — это основа любого магазина, я думаю это понятно и без объяснения. Редактор такой же, как и у статей, только добавлены специфичные разделы для редактирования информации о товаре.

Карточка товара

Давайте посмотрим из каких элементов состоит карточка товара.

1. Название товара — в качестве названия используйте главное ключевое слово, также является заголовком товара.
2. Описание товара — здесь обычно пишется полное описание товара, которое располагается в нижней части карточки товара.
3. Краткое описание товара (отрывок) — буквально 2-4 предложения о товаре, самое важное.
4. Категория — выбираем нужную категорию для товара.
5. Метки — с помощью меток можно дополнительно группировать товары, это удобно когда у вас большой каталог.
6. Главное изображение — превью для товара, картинка, которая будет отображаться в каталоге.
7. Галерея фото — дополнительные фотографии товара.
8. Данные товара — дополнительные настройки каждого товара, давайте разберём детальнее.

Данные товара

Тип товара

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

Путь настроек: Товары — выберите любой товар или создайте новый.

Выбор типа товара

Простой товар — чаще всего выбирают этот вариант, это просто товар без дополнительных правил.

Дополнительно у этого типа товара можно выбрать две галочки: Виртуальный и Скачиваемый. Эти настройки актуальны, если вы продаёте виртуальные товары, например, онлайн-курсы, пресеты для ретуши, шаблоны и пр.

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

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

Пример сгруппированного товара

Внешний/Партнёрский товар — такой тип товара следует выбрать, если вы хотите чтобы кнопка «Купить» вела на другой сайт. Чаще используют, когда ставят партнёрские ссылки на товар, например, перелинковка на сайт AliExpress.

Пример партнёрского товара

Вариативный товар — такой тип товара полезен, когда цена изменяется в зависимости от выбранной характеристики. Например, конечная цена зависит от цвета лампы или цена на айфон зависит от размера встроенной памяти (128, 256 или 512 гб).

Пример вариативного товара

Вкладки с настройками

Основные

В простом товаре мы задаём базовую цену и цену со скидкой, если на этот товар сейчас действует скидка.

В партнёрском товаре указываем ссылку, куда будет вести кнопка и название этой кнопки.

Настройки товара: вкладка Основные

Запасы

Заполняем артикул: уникальный идентификатор для каждого отдельного товара.

Выбираем складской статус: в наличии, нет в наличии, предзаказ.

Ещё можно управлять запасами, выставлять какое количество конкретного товара осталось и когда это количество закажут, будет показано что товара нет в наличии.

Настройки товара: вкладка Запасы

Доставка

Указываем вес и размеры товара.

Настройки товара: вкладка Доставка

Сопутствующие

Апсейл: другой похожий товар, который показывается в карточке товара с заголовком «Вам также будет интересно…»

Кросселы: другие товары, которые вы предлагаете добавить в корзину на странице корзины.

В сгруппированном товаре вы выбираете товары, которые хотите сгруппировать.

Настройки товара: вкладка Сопутствующие

Атрибуты

В этой вкладке можно добавить атрибуты, которые вы сначала создадите во вкладке Атрибуты (о ней мы ещё дальше поговорим).

Часто у товаров атрибуты повторяются, например выбор цвета, чтобы не прописывать эту настройку отдельно для каждого товара, можно заранее создать атрибут «Цвет» с нужным количеством вариантов, например «Белый, Красный, Синий, Зелёный» и выбирать данный атрибут к нужным товарам.

Настройки товара: вкладка Атрибуты

Дополнительно

Примечание к покупке: этот текст будет отправлен клиенту после покупки товара.

Порядок: произвольное упорядочивание позиций.

Включить или отключить отзывы к определённому товару можно в этой вкладке.

Настройки товара: вкладка Дополнительно

Вариации

Эта вкладка появляется только при выборе вариативного товара. Здесь задаётся отдельная цена для каждой вариации.

Настройки вариативного товара

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

Категории, метки, атрибуты

Когда товара много, его нужно как-то сортировать, эти три настройки помогут навести порядок в вашем магазине.

Категории

Создавайте категории и выбирайте одну или несколько для каждого товара.

Метки

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

Атрибуты

С помощью атрибутов можно настроить дополнительные сведения о товаре, например размер или цвет. Атрибут может состоять:

• из двух вариантов, например «Тип зарядки», варианты «Проводная» или «Беспроводная».
• из вариантов да или нет, например «Подсветка корпуса», варианты «да» или «нет».
• из нескольких вариантов, например «Страна производитель», варианты «Россия», «Италия», «Малайзия», «Китай»

Настройки шаблона

С контентом на сайте разобрались, теперь переходим к настройкам шаблона. У шаблона Bono настройки находятся во вкладке Внешний вид — Настроить. Если вы используете другой шаблон, то настройки могут быть в отдельной вкладке слева в меню админки.

Верхняя полоса

Путь настроек: Внешний вид — Настроить — Блоки — Верхняя полоса

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

Цвет текста и самой полосы можно задавать любой.

Настройки верхней полосы

Шапка

Шапка состоит из элементов: логотип, меню, ссылки на соцсети, телефон и время работы, иконки поиска и магазина.

Путь настроек: Внешний вид — Настроить — Блоки — Шапка

Шапка сайта

Логотип

Логотип может быть картинкой, текстом или картинкой с текстом. Текст названия и описания подгружается с Настройки — Общие — с первых двух полей.

Включаем галочку, чтобы отображалось меню в шапке, а сами пункты идём настраивать во Внешний вид — Меню.

Здесь можно создать новое меню, с левого столбца выбрать нужные страницы и добавить их в меню. Настроить уровень вложенности, если какие-то страницы должны быть подпунктами к другим страницам и снизу ставим галочку Меню в шапке, нажимаем Сохранить меню.

Проверяем на сайте, меню должно появиться.

Настройки меню

Иконки социальных сетей

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

Теперь нужно перейти в Модули — Социальные профили — и добавить ссылки для нужных соцсетей.

Не забываем опубликовать (сохранить настройки) и проверить отображение на сайте.

Виджет телефона

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

В поле Телефонные номера добавьте номер, а через // (две косые черты) добавьте доп. текст, он перенесётся на новую строку и будет написан шрифтом поменьше. Номеров можно добавлять несколько, каждый пишите с новой строки.

Иконка поиска

Если хотите выводить иконку поиска в шапке, выберите нужную галочку в блоке Порядок.

Иконки магазина (Избранное, Корзина, Сравнить товары)

В шапке можно вывести эти три иконки, выберите нужные в блоке Порядок.

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

Панель настроек шапки

Подвал

После шапки давайте сразу настроим нижнюю часть сайта.

Путь настроек: Внешний вид — Настроить — Блоки — Подвал

• Здесь выбираем количество колонок для контента
• Прописываем текст копирайта, который располагается в самом низу на всю ширину подвала
• Ещё здесь можно добавить код счётчиков аналитики

Чтобы добавить виджеты в колонки подвала идём во Внешний вид — Виджеты и в каждую вкладку подвала добавляем нужный контент, я для примера добавил меню из дополнительных страниц. Добавлять можно любые виджеты из доступных слева.

Настройки подвала

Сайдбар

Путь настроек: Внешний вид — Виджеты

Сайдбар — это боковая панель, куда вы можете добавлять различные полезные виджеты.

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

Например, на странице магазина можно вывести сайдбар 1 с фильтрами интернет-магазина, а на странице блога и статьях выводить сайдбар 2 с формой подписки, последними статьями, комментариями и т.д.

Настройки сайдбара

Главная страница

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

Путь настроек: Внешний вид — Настроить — Конструктор главной

У конструктора есть несколько виджетов:

1. Слайдер — блок растянут на всю ширину, состоит из картинки на фоне, заголовок, подзаголовок и кнопка.
2. Товары — выводите товары по категориям и изменяйте внешний вид блока.
3. HTML — можно добавлять любой HTML-код, например, код формы захвата со стороннего сервиса типа SendPulse.
4. Посты — вывод статей из блога.

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

Цвета и фон

Путь настроек: Внешний вид — Настроить — Цвета и фон

Здесь вы можете настроить цвет элементов и фон. Четыре вкладки: общие, шапка, меню и подвал, в каждой вкладке настройки цвета конкретных элементов. Всё подписано, поэтому трудностей с настройкой не возникнет.

Лучше выбрать 1-2 основных цвета, помимо чёрного и белого, и с помощью них настроить все цвета сайта. В данном примере основной цвет это синий.

Настройки цвета

Типографика

Путь настроек: Внешний вид — Настроить — Типографика

Если вы захотите изменить шрифт, эти настройки делаются здесь. В шаблоне Bono установлено 25 популярных кириллических шрифтов с Google Fonts. Эти шрифты можно использовать бесплатно и на любом сайте.

Через настройки можно изменить шрифт у основного текста, названия и описания сайта, пунктов в меню.

Настройки типографики

Настройки WooCommerce от Bono

Путь настроек: Внешний вид — Настроить — WooCommerce

В этой вкладке собраны настройки элементов магазина WooCommerce, которые можно настроить через шаблон Bono. Эта вкладка сильно упрощает настройку функционала магазина.

Уведомление магазина

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

Настройка уведомления

Каталог товаров

Настройка страницы с выводом товаров.

Настройки каталога товаров

Оформление заказа

Точечная настройка формы при оформлении заказа.

Настройки формы заказа

Магазин

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

Настройки сайдбара магазина

Товар

Настройки карточки товара.

Настройки карточки товара

Избранное

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

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

Теперь вам нужно связать эту страницу в настройках WooCommerce. Перейдите по пути WooCommerce — Настройки — Дополнительно — Страница избранного.

Сравнить товары

Здесь включается виджет Сравнение, где посетители могут сравнивать характеристики 2-5 товаров. Для этой функции нужно будет создать отдельную страницу и прописать там два шорткода

Если не разберётесь, вот инструкция .

Теперь вам нужно связать эту страницу в настройках WooCommerce. Перейдите по пути WooCommerce — Настройки — Дополнительно — Страница сравнения.

Настройка шильдика для цены со скидкой.

Дополнительные стили

Путь настроек: Внешний вид — Настроить — Дополнительные стили

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

Дополнительные css стили

Купить в один клик

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

Эта модуль от шаблона Bono и включается в настройках темы.

Путь настроек: Внешний вид — Настроить — Модули — Купить в один клик

• в Действие по кнопке выбираем Создать заказ и отправить письмо;
• Статус заказа оставлю Обработка;
• напишите какое сообщение будет показываться покупателю при успешной отправке формы;
• заполняем данные письма, которое придёт вам как оповещение о новом заказе.

Настройки плагина WooCommerce

Теперь разберём настройки WooCommerce — главного плагина магазина.

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

Путь настроек: WooCommerce — Настройки

Вкладка Основные

Адрес магазина

Если у вас физический магазин и есть адрес, то пропишите его, если продаёте онлайн товары, то можно оставить поля пустыми.

Woocommerce — Настройки — Основные — Адрес магазина

Основные настройки

• Здесь нам нужно выбрать страны, в которых осуществляется продажа товаров.
• Можно выбрать все страны, определённую страну или продавать во всех странах кроме конкретных.
• Это же касается настроек доставки, выберите правила доставки конкретно вашего магазина.
• В поле Стандартная локация лучше оставить Адрес магазина.
• Включение налогов: эту опцию можно не включать, потому что, как правило, итоговая цена указана уже с учётом налогов.
• Использование купонов: если планируете в дальнейшем делать скидочные купоны на товары, то ставим галочку.

Настройки валюты

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

Вкладка Товары

Основные

Страницы Магазина

• Страница Магазина должна быть автоматически выбрана, если нет, то выберите её сами. Здесь мы задаём основную страницу для магазина.
• Изображение заполнитель: можно прописать ID картинки, которая будет появляться, если у товара нет своей картинки (миниатюры).

Габариты

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

Отзывы

• Оставляем отзывы включёнными, так как отзывы на сайте это всегда хорошо. Также я оставляю вторую галочку, этот значок будет у покупателей.
• Рейтинг оставляйте по желанию, я оставлю.

Запасы

Эти настройки актуальны, если у вас всегда ограниченное количество товаров и вы указываете запасы к товарам. Когда будет оставаться мало запасов, вам будет приходить оповещение об этом.

Эта опция подходит только для физических товаров.

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

Скачиваемые товары

Настройки выдачи виртуальных товаров.

• Метод загрузки файла оставляем Принудительное скачивание.
• Ограничение доступа: я оставляю две галочки, эти настройки наиболее логичны.

Вкладка Доставка

Зоны доставки

• В этой вкладке мы добавляем зону доставки и выбираем нужные методы доставки.

Нажимаем Добавить зону доставки

• Название зоны: напишем Россия
• Зоны: выбираем Россия

Методы доставки

Нажимаем Добавить метод доставки и у нас на выбор 3 варианта:

1. Единая ставка
2. Бесплатная доставка
3. Самовывоз

Каждый метод доставки мы можем отредактировать и включить/выключить для конкретной зоны доставки.

Разберём настройки каждого метода доставки.

Единая ставка

• Заголовок: Пишем название, например Платная доставка
• Статус налога: Выберем Нет, потому что мы решили что налог уже включён в стоимость товара
• Стоимость: Указываем сумму доставки, например 500 р.

Бесплатная доставка

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

Самовывоз

• Наименование: Пишем название, я так и оставлю
• Статус налога: Выберем Нет, потому что мы решили что налог уже включён в стоимость товара
• Стоимость: Оставляем 0

Это стандартные методы доставки от WooCommerce. Если вы хотите добавить больше вариантов, например, добавить сервисы типа СДЕК или Boxberry, то у них, как правило, есть свои плагины и, при настройке сервиса, вы сможете его настроить по инструкции.

Параметры доставки

Расчёты

Включить калькулятор стоимости доставки в корзине и Спрятать стоимость доставки, пока адрес не введён: Эти функции имеют смысл, если у вас цена доставки рассчитывается исходя из региона покупателя, если же цена за доставку фиксированная, то опцию выключаем.

Назначение доставки: Я выберу 3-й пункт Принудительная доставка по платёжному адресу клиента, чтобы не путать клиента дополнительными полями для заполнения.

Woocommerce — Настройки — Доставка — Параметры доставки

Классы доставки

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

Платежи

Методы оплаты

В стандартном функционале WooCommerce доступны 4 метода оплаты:

1. Прямой банковский перевод
2. Чековые платежи
3. Оплата при доставке
4. PayPal

Каждый метод можно включить/выключить, переместить выше/ниже и дополнительно настроить.

Woocommerce — Настройки — Платежи

Оплата при доставке

Нажимаем Управление и попадаем в настройки метода оплаты.

• Наименование: Название метода оплаты
• Описание: Здесь напишите подробнее про детали и правила оплаты.
• Инструкции: Этот текст будет показан на странице после оформления и также придёт в письме на почту.
• Включено для способов доставки: Выберите метод доставки, для которого этот метод оплаты будет доступен.

Прямой банковский перевод

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

• Также как и в самовывозе заполняем Наименование, Описание и Инструкции.
• В разделе Данные учётной записи добавляем платёжные реквизиты.

Такой метод оплаты часто использовался до введения обязательных кассовых аппаратов и выдачи чеков.

Обычно из этих методов оставляют только Оплату при доставке и иногда Прямой банковский перевод, а чтобы принимать платежи с карт и электронных кошельков подключают платёжные системы, типа Robokassa или ЮKassa (в прошлом Яндекс.Касса) и другие, вариантов много.

Какую систему приёма платежей выбрать, вам нужно решить самостоятельно, это зависит от типа товара, типа бизнеса, оборота и пр.

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

Учётки и приватность

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

Woocommerce — Настройки — Учётки и приватность

Политика конфиденциальности

Поля, в которых вы можете изменить текст политики, который показывается при регистрации и на странице оформления заказа.

Woocommerce — Настройки — Учётки и приватность — Политика конфиденциальности

Хранение персональных данных

Ничего не меняем.

Woocommerce — Настройки — Учётки и приватность — Хранение персональных данных

Email’ы

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

Изначально все поля заполнены стандартно, если вы хотите что-то поправить, выбирайте Управление напротив нужного письма.

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

Woocommerce — Настройки — Учётки и приватность — Емейлы

Параметры отправителя Email

Можно изменить данные отправителя.

Woocommerce — Настройки — Емейлы — Параметры отправителя Email

Email шаблон

Здесь можно настроить дизайн письма, поставить картинку в шапку и изменить цвета.

Woocommerce — Настройки — Емейлы — Email шаблон

Дополнительно

Настройки страницы

Обычно здесь автоматически выбраны нужные страницы, которые соответствуют своему значению. Если же нет, то выберите вручную.

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

Woocommerce — Настройки — Дополнительно — Настройки страницы

Эндпоинты оформления заказа и Эндпоинты учётной записи

Здесь ничего не трогаем, все настройки уже сделаны.

Woocommerce — Настройки — Дополнительно — Эндпоинты

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

Clearfy Pro — лучший помощник любого сайта на WordPress

Если хотите ещё улучшить свой магазин, советую приобрести и установить плагин Clearfy Pro. Этот плагин мастхев и я его использую на всех своих проектах и также покупаю для клиентов. Там десятки настроек, которые помогают оптимизировать код WordPress и улучшить показатели скорости и сео сайта.

Особенно рекомендуется, если вы решите использовать тему Bono, потому что разработчики те же ребята WpShop и все функции плагина совместимы и синергичны с шаблоном на 100%.

По ссылке подробный обзор. Официальный сайт плагина.

Личный кабинет покупателя

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

Аккаунт покупателя

Вы как администратор можете отслеживать аккаунты клиентов во вкладке Пользователи.

Пользователи

Купоны

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

Путь настроек: Маркетинг — Купоны

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

Купоны

В дальнейшем купон можно применить на странице Корзины или Оформлении заказа.

Аналитика

В сфере онлайн продаж аналитика важный элемент, благо у WooCommerce есть своя система аналитики, где вы можете отслеживать важные показатели: заказы, продажи, остатки, купоны и пр.

Путь настроек: Аналитика

Аналитика

Примеры оформленного заказа

Страница после оформления заявки

Письмо, которое приходит покупателю

Письмо, которое приходит владельцу сайта

Чек-лист: 8 важных элементов проверки перед запуском онлайн-магазина

После настройки магазина нужно проверить все элементы:

1. Страницы магазина. Пройдитесь по всем страницам, чтобы убедиться что все шорткоды подгружаются, кнопки и поля корректно работают.
2. Общие страницы, товары и статьи. Проверьте вёрстку и корректное отображение всех страниц.
3. Тестовый заказ. Оформите тестовый заказ и проверьте, чтобы письма приходили на оба емейла, продавцу и покупателю.
4. Оплата. Если прикручивали сервис оплаты, сделайте тестовую оплату.
5. Элементы в шапке. Номер телефона, соцсети, иконки.
6. Вёрстка на главной странице. Если вы использовали конструктор.
7. Ссылки в меню и подвале. Перейдите по всем ссылкам, чтобы убедиться что они ведут на нужные страницы.
8. Проверка с разных устройств. Посмотрите сайт с компьютера, ноутбука и разных смартфонов, важно чтобы вёрстка везде была корректная.

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

В каком месте настроек у вас возникает больше всего вопросов? Делитесь в комментариях.

Продающий + красивый интернет-магазин на WordPress за 269$ «с нуля» — наш опыт

Это longread будет друзья и довольно откровенный, но я чего-то не видел подобных статей. Тут масса опытных ребят в части Интернет-магазинов (разработки и продвижения), но что то никто не написал как сделать классный магазин за условно 250$ (а можно и за 70$) который будет отлично выглядеть и отлично работать (продавать!). И все это можно сделать самому без программиста. Ну вообще неплохо иметь программиста рядышком, который будет нежно дышать вам в затылок и поправлять ваши корявые ручки, но т.к. я сам не будучи программистом сделал инет-магазин, то знаю о чем говорю. Еще раз — программист ни разу мне не помог для этого магазина.

Итак, погнали. Магазин вот этот — мы ловко продаем базы для спама. Ага. Для спама. Я напишу отдельную статью, как мы делаем эти базы… мы сами то не спамим, а продаем базы (к слову, если кто то думает, что достаточно просто спарсить 2ГИС и дело в шляпе — разочарую — все на порядок сложнее и у нас работает 3 программиста на этом направлении fulltime между прочим). Статья в работе и будет веселой :). Там еще поделимся итогами спама от наших клиентов — работает, кстати, работает всеми нелюбимый спам.

Что заставило написать эту статью? Сегодня на VC вышла публикация, где ребята сравнивали Битрикс и некие другие среды разработки. Пацанам в комментариях написали, мол чего забыли WordPress? Ответ интересный — ну так там дыр полно как в швейцарском сыре. И привели ссылку на отчет…(там в статье найдите сами). И да, я видел этот отчет от производителя отличного плагина для защиты WordPress 🙂 они классно напугали, чтобы покупали их плагин. Но если чуть-чуть (слегка, не вспотев) поработать (последняя версия, обновления + бесплатный плагин для защиты типа Wordfence) то вероятность взлома стремиться к минимуму. Дело в том, что 80% сайтов на WordPress сделаны «на коленках» — их миллионы и конечно же % взлома большой по сравнению с magenta которую внедряют уже более опытные спецы.

Наша задача была сделать Интернет-магазин по продаже баз. Кстати, это чуть сложнее чем продажа физических товаров (хотя там могут быть определенные нюансы из-а калькулятора доставки, здесь я признаюсь не ковырялся). Почему? У нас базы компаний хранятся на Amazon S3 (почему — напишу позже) и пришлось повозится с связкой. Если у вас стоимость доставки одинаковая для всех регионов и товаров (ну или логика очень простая) — то вам будет даже проще запустить все из коробки.

Ну давайте по шагам, так будет проще всем осознать как сделать неплохой Инет-магазин за 200$ (а я приведу вам пример как сделать все тоже самое и за 50$ без потери качества).

Хостинг

Хостинг — у нас hostland.ru. Ссылка не реферальная, я там никого не знаю. Да просто нормальные парни, делают нормальное дело. Ау… если вы там меня слышите — закиньте нам может на баланс пару вкусняшек что ли — реклама то нативная 🙂 Хостинг WordPress стоит около 300 рублей плюс минут 50 рублей, даже перепроверять не хочу). Личный кабинет простой, все понятно, с первого раза за пару часов сделаете типовой WordPress.

Доменное имя

А забыл друзья мои — доменное имя! 🙂 Это же шаг №1 — ну мы покупали на nic.ru (я вообще рекомендую этих парней), хотя сейчас наш хостер дает нам бесплатные доменные бонусы и мы новые домены у них берем. Можно я не буду считать стоимость покупки домена в зоне RU? Наверное в метро в Москве проехать туда-сюда стоит столько же, только там за год оплата 🙂 Шаг 2 — нужно направить доменное имя на ваш созданный сайт WordPress у хостера. Ну для этих целей мы используем Yandex.Connect. Честно скажу, нужно повозится, но если голова на плечах есть, то вы сможете сделать связку следующую:

nic.ru -> Яндекс.Коннект -> редактор DNS и там прописать IP адреса -> хостера.

Но а если лень это делать, то — хостер дает бесплатные домены (иногда, я пока не понял всею логику бонусов) в зоне .RU и сам все прописывает, или поддержка поможет.

Ну, что у нас там по балансу? 300 рублей за хостинг (дальше буду в долларах, так проще — около 5$) + 0 рублей (не хочу считать) за регистрацию доменного имени. Ну пока бизнес тянет эти затраты 🙂 скрипим, но тянем.

Нам нужна тема. Я выбрал тему SAVOY — 50$ стоит. Почему? Ну она такая милая 🙂 и простая, без ущерба функциональности. Есть документация на английском (тоже все понятно). Причем с темой идет сразу woocommerce с демо-контентом. Что такое woocommerce? А это плагин, который позволяет вам сделать Интернет-магазин с нуля. Он бесплатный.

Так, что там у нас — 55$ потратили.

К слову, в покупку темы входит 6 месяцев поддержки. Поверьте — помогают ответами на дурацкие вопросы даже на Pidgin English. Тема ставиться легко и быстро, ставит нужные плагины сама.

После установки можете уже начинать в woocommerce править товары свои. Удалять демо товары, добавлять свои. Тут нечего писать вообще, руководств как это сделать миллион, все просто и понятно.

Спам 🙂 после покупки

Таки дальше? Что говорят умные дяди и тети с высоких трибун конференций по электронной коммерции? Они советуют после покупки «замучать» тебя письмами с напоминаниями. ОК, мы же следуем рекомендациям взрослых? И как это сделать? А у нас есть отличный плагин для этих целей стоит 99$. Если вам вдруг это дорого (я и сам так подумывал, да ладно, один раз живем), то прошу пожаловать сюда, тут он стоит целых 5$! Вы прежде чем писать гневные комментарии, что я пропагандирую ворованный софт, прочитайте ниже суть.

Надо переводить текст на картинке? Если коротко — плагины для WordPress выпускаются под лицензией GPL, что означает что после покупки плагина любой может распространять его как угодно. Что делают эти красавцы? Они покупают плагин за 99$ и потом продают за 5$ всем желающим. И это в правовом поле заметьте. И я там был, пиво-мед пил — скажу так, работает. Минус? Нет поддержки, поэтому если хотите сделать ваш магазин на перспективу — лучше купить у разработчиков официально. А если проверяете гипотезу надо-ненадо-получится-неполучится — можно и здесь. Но, еще раз — это не пропаганда воровства, это данность, которую можно принимать и использовать или нет. Решать вам, но я за официальные источники.

У меня ушло часа 2 чтобы разобраться с плагином follow up и настроить “догоняющие” письма. Ну конечно, там функционал просто огромный, триггеров может быть масса. Выглядит это как на картинках ниже. Видно, что есть два «догоняющих» письма и уже есть запланированные отправки тем, кто скачивал базы. Все понятно и работает четко.

Ну что, сколько мы там уже потратили? Ну давайте считать что 55 + 99 = 150$. Кстати, там многие плагины предлагаю подписку на год — не советую, купили установили и все. Пройдет год, можете купить обновления ну или нет.

Так, что там у нас дальше? А! как письма то слать триггерные? Яндекс.Почта вам в помощь. Она бесплатная, к ней можно по SMTP подключиться и все. Я для этих целей использую плагин (он бесплатный тоже )) WP Mail SMTP. Разберетесь, там все просто.

Мы правда сейчас перешли от Яндекс.Почты на SendGrid, т.к. стали слать по 1000 писем триггерных в день и Яндекс.Почта посчитал что мы спамеры (если что — Яндекс, мы не спамеры, мы делаем базы для спама, но сами ни-ни, это честные триггерные письма). SendGrid’у все равно на далеких Питерских парней, и он за 15$ в месяц дает нам 40 000 писем 🙂 и что удивительно, указанный выше плагин для отправки писем из WordPress просто превосходно с ним дружит (1 касание и работает).

Ну да ладно, почту настроили, 150$ потратили. Поехали дальше?

Оплаты

Нам надо принимать оплаты за базы компаний по кредитным картам? Надо бы. Есть плагин Яндекс.Касса для Woocommerce. Бесплатный. Работает. Что же все бесплатно-то? Чудеса, но это правда.

Партнерка

Мы пошли дальше и сделали реферальную партнерку, т.к. базы дорогие, можно платить много. Я не уверен, что все владельцы Инет-магазинов делают свою партнерскую программу (чаще подключаются к таким сервисам, как admitad), но если вдруг — загляните сюда affiliatewp.com/pricing 99$ и могучий (я не шучу, там можно сделать ВСЕ) инструмент у вас в кармане. Баланс 240$ (гуляем…).

Аналитика

Какой владелец магазина без аналитики? Никакой. Как слепой котенок — это не я сказал, это дяди и тети с трибун. Давайте подключим Google Analitycs + Яндекс.Метрика. Плагинов полно, бесплатные. Даже ничего писать больше не хочу — все работает ИЗ коробки. Но! У нас ведь Интернет-магазин, нам надо отслеживать конверсии, воронки, коробки, избушки, кукушки — ловите плагин и не благодарите. Тоже гад бесплатный (капиталисты развращают нас, стонущих под гнетом санкций :).

Так, баланс не изменился, погнали дальше. Что говорят SEO — магистры? Картинки надо сжимать, дабы было хорошо, если сжимать не будете — будет хреново. Я вот кстати верю, поэтому ставим БЕСПЛАТНЫЙ (сука) плагин SMUSH. Сами найдете, вам хватит, поверьте.

Чтобы сайт хорошо ранжировался в поиске, он должен работать быстро (это не я сказал). Ну вообще я не знаю как еще можно ускорить мой сайт на хостинге за 300 рублей в месяц (по мне он и так очень быстрый, хотя стоп — это же wordpress, я что то не то говорю?) но как в том анекдоте — (кеширование) нам не помешает. Поэтому ставим плагин для кеширования.

WP Fastest Cache (пара кликов и он находится и ставится). Я не удивлю наверное уже никого, если скажу что он тоже бесплатный. Там много каких-то мутный настроек, я вообще ничего не настраивал, включил его (активировал и включил кеширование) и все. Спецы могут схватиться за умные головы — но мне и так ОК. Вот так:

В нем настройки были по умолчанию какие-то, я их даже не трогал. Дальше я вычитал в одной статье (она была большая, а это значит полезная и умная) что стоит поставить плагин Autoptimize для еще лучшей работы сайта. Ну… сказано сделано, поставил, потыкал галочки и все. Работает. Там, кстати, есть прикольная опция — lazy load для картинок. В чем суть — он картинки подгружает чуть позже после загрузки текста, человеку так приятнее (сам проверил, факт) — то есть уже читаешь, а картинка плавно так появилась. Причем он что то там умеет сжимать — но это уже высшая математика, ну ее нафиг — у нас цель базы для спама продавать, а не вникать глубоко в недра PHP.

Что это дает в итоге? Ну вот смотрите, я без программиста добился в анализаторе Google неплохого результата. Есть мнение что это влияет на ранжирование в поиске, я верю поэтому радуюсь. На десктопе результат близок к 100, а вот мобайл (78) подкачал, подкачал — но тут нужны уже ловкие и слегка волосатые руки программиста, т.к. я не знаю как улучшить. Картинка для доказательства:

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

Доставка

Мы продаем не физические товары, а файлы Excel (их дяди загружают в CRM и спамят, если кто забыл) и поэтому нам эти файлы надо где-то хранить. Кстати, если я не сказал — woocommerce отлично продает как физические товары, так и виртуальные (скачиваемые). Мы решили, что базы будем хранить в облаке, там их обновлять и оттуда люди будут скачивать.

Сказано — не сразу сделано. Нашли плагин который интегрируется с woocommerce и позволяет людям, кто купил базу, получать ее с S3. Целых 29$ стоит, но мы скрипя осилили. И это отлично работает. Вот так хранятся базы (см. картинку ниже). Цена хранения в год близка к чашке кофе тоже, не буду считать даже. Там есть нюансы, которые я узнал побившись головой об стену настроек, но если у вас голова на плечах — справитесь (впрочем, вряд ли тут много тех, кто продает скачиваемые товары — вам это даже не надо будет делать).

Что у нас по балансу? 240 + 29 = 269$.

Резервное копирование

Чуть не забыл резервное копирование сайта – есть плагины, бесплатные, скопирую куда хочешь в облака. Впрочем чего это я – хостер делает резервные копии сам в рамках тарифа. Но если вдруг кому-то нужно — поищите backup плагины для WordPress. Я настроил в облако DropBox и работает :). И да, это все тоже бесплатно (включая DropBox).

Для сайта нужен SSL? Ой да ладно – сертификат Let’s encrypt плюс бесплатный плагин Really Simple SSL = все работает. Кстати, разработчики плагина Really Simple SSL не соврали — там нет настроек :). Что касается сертификата, то хостер дает его нам автоматически и продлевает сам каждые 90 дней. Все работает, копейки не заплатили.

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

Яндекс.Маркет

Что то просто у нас все так идет, не находите? Может быть надо помучаться с фидами для Google merchant + Yandex Market? Ну вы ведь хотите как-то рекламировать свои товары на эти площадках? Если да – бесплатный (вот гады, слов нет) плагин Product feed Pro все делает на УРА. Он поддерживает какое-то немыслимое количество разных типов фидов (feeds), включая Яндекс :). Работает из коробки, проверено. Вот как у нас, фид для Яндекса, обновляется ежедневно:

Кто-то может спросить — а зачем вам фид на Яндекс.Маркет, вы ведь продаете виртуальный продукт. Отвечаю картинкой:

Я подумал, не помешает 🙂 и сделал. Вообще забегая вперед отмечу, что базы компаний — это абсолютно легальный продукт. Мы просто анализируем сайты (в РФ или около 9 млн.), чтобы классифицировать компании (Инет-магазины, Мед.центры и т.п.) и собрать контактные данные, хотя звучит “базы для спама” очень агрессивно что ли. Поэтому мы не имеем проблем с Яндексом и Google вообще, т.к. это в правовом поле. Я вот точно категорически против сбора контактов физиков с АВИТО (сотовые телефоны) и т.п. меня самого замучили телефонные спамеры.

Ну так что у нас с балансом? А он не поменялся, 269$ а магазин то уже работает и очень неплох. Что еще? Все ругают безопасность WordPress (точнее ее отсутствие) — БЕСПЛАТНЫЙ плагин WordFence творит чудеса. Вам чего там не хватит? Я уверен, что хватит, настроек масса в бесплатной версии, можно очень сильно затянуть гайки.

Скорость работы

Часто говорят, что при большой количестве товаров (страниц) WordPress начинает работать медленно. Это не так. Проверено моим опытом. Вообще отвлекусь, в моей компании около 10 программистов .NET, мы делаем и крупные порталы и приложения, но мы сами очень активно используем WordPress для проектов, где можно им обойтись, хотя никто не знает PHP. Причина? Из коробки можно сделать очень многое, да, это будет не так «кошерно», как если бы поработал дизайнер, специалист по UI, верстальщик и т.п. — но вы сами то верите, что можно сделать Интернет- магазин который уже работает (!) и приносит прибыль за 269$ “с нуля” без готовых компонентов? Я не верю, т.к. знаю сколько стоит разработка. Если уж WordPress “из коробки” вам станет мал, то поверьте, есть большое количество спецов, которые докрутят вам плагины + тему под ваши нужды.

Ну я отвлекся, в заключение — про производительность. Мы тут ради бизнес- эксперимента делаем сайт один сайт, там подразумевается около 3 млн. записей (страниц). Портал такой смешной. И мы попробовали сделать его на WordPress (точнее еще делаем, вы статью читаете — а мы еще делаем, заливаем контент). Я попросил знакомого DevOps настроить виртуальную машину под управлением Ubuntu чтобы WordPress работал при таком количестве записей быстро. Это стоило 4 000 рублей — работа спеца (там он много мне слов сказал типа redis, memcache, nginx и т.п.) и 300 рублей в месяц за VPS (я взял самую простую — вот здесь). Так вот, мы пока залили в WordPress порядка 15 000 записей, он даже не пукнул — летает (тем кто не верит — siteprofile.ru — туда еще данные заливаются, пока пишу). Я уверен, что 1 млн. он переварит. Собственно если в вашем Интернет- магазине будет условно 500 000 товаров — то поверьте, WordPress будет работать даже на самом дешевом хостинге, ну уж если начнет тупить, вместо 300 рублей в месяц, заплатите 600 рублей в месяц 🙂 и вам подкинут ресурсов.

Как импортировать данные в WordPress? Есть отличный плагин WP all Import который просто творит чудеса — проверено опытом. Он не дешевый, но я ведь вам подсказал, где найти на 95% дешевле, а? 🙂 (еще раз — это не совсем правильно использовать плагины за 5$, но ресурс очень популярный, оттуда берут если не все, то многие — мы сами разработчики, и я понимаю как это когда твой продукт вместо 100$ продают за 5$ и ничего не поделать). Данный плагин потребуется, если решите залить массово товары, он, к слову, и картинки отлично импортирует.

На этом все. Вывод? Потратили 269$ (а можно и меньше, если покупать плагины по 5$) и запустили Интернет- магазин. Он, кстати, выглядит очень даже прилично и что более важно — стабильно работает. И еще — он красивый, даже сам удивляюсь что «из коробки» получается все очень даже аккуратно.

Как создать интернет-магазин на WordPress с нуля: пошаговая инструкция

Сайт интернет-магазина сложен в разработке: чтобы покупателям было удобно оставлять заказы, нужно многое предусмотреть. Например, создать фильтры по типу товаров, организовать расчет стоимости доставки, выделить лучшие товары и дать возможность оставлять отзывы и многое другое.

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

Что нужно, чтобы создать интернет-магазин на WordPress?

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

Чтобы создать сайт интернет-магазина на WordPress, понадобится как минимум две составляющих: деньги и время.

Деньги

Несмотря на то, что и WordPress, и плагин WooCommerce полностью бесплатны, деньги на создание все-таки понадобятся. Вот примерный перечень затрат, которые могут сопровождать запуск сайта интернет-магазина:

1. Хостинг + домен (обязательно)

Сколько: от 1500 руб. в год

Зачем:
Хостинг — это пространство на сервере, которое вы арендуете у хостинг-провайдера для того, чтобы ваш сайт отображался в интернете. Проще говоря, это включенный 24/7 компьютер, который показывает ваш сайт всем желающим на него зайти.

Домен — это буквенный адрес вашего сайта, например, seoforge.ru или лучшиймагазин.рф.

1. SSL-сертификат (обязательно)

Сколько: от 3000 руб. в год, но можно использовать бесплатный

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

1. Бюджет на наполнение (не обязательно)

Сколько: 50-500 руб. за товар

Зачем:
Если у ваших поставщиков есть готовые прайсы, которые можно импортировать (например, в формате XML), наполнить сайт товарами можно будет за считанные секунды. Но если вы создаете интернет-магазин в узкой нише, то вероятность того, что поставщик предоставит такие прайсы, снижается — наполнять магазин придется вручную.

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

1. Бюджет на доработки, интеграции, платные модули

Сколько: индивидуально

Зачем:
Большинство функций можно реализовать бесплатными модулями и расширениями WooCommerce. Но есть и специфические вещи, для которых понадобятся доработки — например, интеграции с нестандартными службами доставки, CRM или подключение особого функционала вроде умного поиска или коллтрекинга.

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

Время

1. Настройка WordPress и WooCommerce

Сколько: от 1 дня до 1 недели

Зачем:
Сама установка занимает около часа, если не меньше — с оплатой хостинга, домена, настройкой SSL и прочим. Но понадобится настроить и другие вещи — например, подключить Google Analytics и Яндекс.Метрику, подтвердить сайт в инструментах для вебмастеров, настроить условия оплаты и доставки, подключить дополнительные модули и так далее.

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

1. Наполнить сайт

Сколько: от 2 дней до 2 месяцев

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

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

1. Настроить тему (дизайн)

Сколько: от 1 дня до 1 недели

Зачем:
Как и в случае с самим WordPress и WooCommerce, установить красивую тему — дело считанных секунд. Но чтобы настроить ее под конкретные нужды, понадобится некоторое время — например, изменить цвет, включить или отключить отображение блоков, плашек и прочих декоративных элементов.

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

1. Протестировать все функции

Зачем:
Проверить, что все работает нормально — обязательный пункт перед запуском. Да, из коробки все и так будет работать верно, но лишняя проверка не помешает. Особенно если вы установили дополнительные модули и плагины — иногда они могут конфликтовать, и это приведет к непредсказуемым результатам.

Лучше семь раз отмерить прежде, чем запускать интернет-магазин в свободное плавание — так вы будете уверены, что покупатели точно смогут оставить заказ.

Запускаем интернет-магазин!

С теорией покончено, переходим к самому интересному — как настроить и запустить интернет-магазин на WordPress.

Шаг 1. Купить домен + хостинг

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

Например, для интернет-магазина на 50-100 позиций можно смело выбирать наименьший тариф на 1 Гб (обращайте внимание на то, сколько гигабайт в тарифе предлагает ваш хостинг-провайдер). С ассортиментом от 5000-10000 товаров, если у каждой позиции будет в среднем по 5 фотографий, даже со сжатием картинок без потерь понадобится не меньше 5 Гб.

Домен многие хостеры, в том числе и SpaceWeb, дают в подарок к хостингу, но вы можете приобрести его и самостоятельно. Например, в доменных зонах .ru и .рф адрес обойдется в среднем в 180-200 рублей в год.

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

Шаг 2. Установка SSL

Теперь, чтобы защитить данные пользователей, понадобится установить SSL-сертификат. Рассмотрим установку на примере бесплатного сертификата Let’s Encrypt.

Почти все российские хостинг-провайдеры могут зарегистрировать его сами через панель управления. В панели хостинга SpaceWeb этот пункт находится в меню SSL ⟶ Установить ⟶ Let’s Encrypt.

Выберите домен, к которому хотите подключить сертификат. Если вы планируете создавать поддомены для сайта (например, интернет-магазин для всей России находится на адресе mysite.ru, а для Москвы — на msk.mysite.ru, в таком случае msk.mysite.ru — это поддомены), отметьте галочку Wildcard-сертификат, чтобы защитить домен вместе с поддоменами.

После того, как сертификационный центр одобрит выпуск SSL-сертификата, в панели управления вы увидите его статус, а сайт станет доступен по адресу https://mysite.ru.

Шаг 3. Установить WordPress

Многие российские веб-хостеры могут сделать это за вас — достаточно найти в панели управления пункт CMS и выбрать установку WordPress.

Хостинг проведет вас по этапам установки и сообщит данные для входа в панель управления WordPress.

Можно установить WordPress и вручную — это очень просто. Зайдите на сайт WordPress и нажмите на кнопку «Получить WordPress» в верхнем правом углу.

После этого нажмите «Скачать WordPress».

В панели управления хостингом откройте файловый менеджер и нажмите кнопку «Загрузить», а затем найдите скачанный архив wordpress.zip и загрузите его на хостинг.

Когда загрузка закончится, останется только распаковать архив на хостинге:

Теперь WordPress будет доступен по адресу [ваш домен]/wordpress. Чтобы сделать доступ напрямую, по адресу вашего домена без подпапок, перейдите в папку wordpress и переместите все файлы из нее в папку public_html. Готово! WordPress установлен.

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

И последний шаг — откройте свой сайт в браузере, чтобы запустить установку WordPress.

Заполните информацию о базе данных — понадобится название БД, логин, пароль и сервер базы данных.

Назовите сайт и введите свой e-mail. Пароль лучше оставить сложным, чтобы злоумышленники не смогли взломать сайт. После этого нажмите на кнопку «Установить WordPress».

WordPress готов к работе.

Шаг 4. Установка WooCommerce

В панели управления WordPress перейдите в меню Плагины ⟶ Добавить плагины и введите в поиск WooCommerce.

После того, как плагин установится, нажмите «Активировать».

Это запустит мастер установки WooCoomerce. Вам нужно будет ответить на несколько вопросов о магазине: адрес, сфера, какие товары вы собираетесь продавать, сколько их будет и хотите ли вы подключить плагины для продаж через Facebook, Google Merchant Center и email-рассылки.

• 
• 
• 
• 

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

Для тестирования функционала выберите тему Storefront — она поможет узнать, на что способен WooCommerce. Потом ее можно будет сменить.

Шаг 5. Установить темы для WooCommerce

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

Bono

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

• 
• 
• 

Merchandiser

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

• 
• 
• 

Simply Natural от Astra

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

• 
• 
• 

Home v16 от Sober

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

• 
• 
• 

Как установить тему?

Перейдите в меню Внешний вид ⟶ Темы в панели управления WordPress и введите в поиск название темы, которую хотите установить — например, Astra. Если вы хотите посмотреть список всех подходящих тем для интернет-магазина, в поиск можно ввести WooCommerce. Наведите курсор на понравившуюся тему и нажмите «Установить», а затем «Активировать».

Если у вас уже есть скачанная тема, ее можно установить, нажав на кнопку «Загрузить тему» сверху. Найдите архив на компьютере и нажмите «Установить».

После установки WordPress предложит посмотреть или активировать тему. Нажмите «Активировать».

Шаг 6. Установить плагины

Есть несколько полезных плагинов, которые стоит установить перед запуском интернет-магазина — они помогут сделать сайт быстрее, безопаснее и функциональнее.

Clearfy Pro

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

Yoast SEO

Мощный плагин для управления SEO помогает оптимизировать сайт для поисковых систем. С его помощью вы сразу увидите, как будет выглядеть ваш сайт в поисковой выдаче, получите подсказки по метатегам, сможете редактировать htaccess и robots.txt и многое другое. Недостающие настройки SEO в WordPress — все в этом плагине.

iThemes Security

Этот плагин отвечает за безопасность сайта — поможет защитить его от злоумышленников и предупредит, если что-то идет не так. iThemes умеет создавать бэкапы, блокировать пользователей и даже настраивать график доступа в административную панель. Рекомендуем установить сразу же — потом может быть поздно.

TinyPNG

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

Yml для Yandex Market

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

Примеры интернет-магазинов на WooCommerce

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

• 
• 
• 
• 
• 
• 
• 
• 

Резюме

Чтобы создать интернет-магазин на WordPress, понадобятся время и деньги: на первом этапе лучше всего заложить минимум 8000-10000 руб. при условии, что сайт вы наполните самостоятельно, и месяц-два на первичную настройку.

Порядок запуска: оплатите домен и хостинг, установите SSL-сертификат, установите WordPress, WooCommerce, тему для WooCommerce, недостающие плагины и наполняйте сайт.

Хорошие темы для WooCommerce: Bono, Merchandiser, Astra (Simply Natural), Sober (Home v16).

Полезные плагины для интернет-магазина: Clearfy, Yoast SEO, iThemes Security, TinyPNG, Yml для Yandex Market.