Как создать интернет магазин на WordPress с помощью WooCommerce

В этой статье я расскажу, как создать интернет магазин на WordPress с помощью плагина Woocommerce. С помощью этого интернет-магазина вы сможете продавать различные продукты: информационные, физические товары и т.д. Связка woocommerce + wordpress хорошо работает и главное – это бесплатно.

WooCommerce и WordPress

Используем связку Woocommerce + WordPress

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

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

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

Что можно продавать с помощью связки WordPress + WooCommerce?

Продавать можно что угодно:

  • Физические продукты
  • Сервисы
  • Электронные продукты (электронные книги, софт и т.д.)
  • Бронирования (например, аренда жилья и прочее)
  • Подписки
  • Чужие товары в качестве партнера.

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

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

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

Шаг #1 Покупаем доменное имя и хостинг

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

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

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

Для начала идем на bluehost.com и нажимаем Get Started

bluehost.com

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

тарифные планы bluehost.com

Дальше нужно выбрать домен для вашего будущего магазина, либо ввести уже существующий. Если вы хотите бесплатно получить домен с историей и обратными ссылками, заглядывайте на бесплатный сайт https://www.expireddomains.net/, здесь можно найти толковые варианты.

создание домена bluehost.com

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

Поздравляю, теперь у вас есть хостинг и доменное имя!

Шаг #2 Устанавливаем WordPress (бесплатно)

Следующий шаг знаменует начало вашей работы с самой популярной системой управления сайтами в мире – WordPress.

Если работать через Блюхост, то установить WordPress можно будет прямо из панели администратора на хостинге.

Мы должны найти что-то вроде этого

установка WordPress

Кликаем на иконку WordPress и следуем дальнейшим инструкциям. Весь процесс будет интуитивно понятен, поэтому не стоит беспокоиться.

Когда пройдем все шаги, у нас должен появиться пустой сайт на WordPress.

Вы сможете посмотреть его, введя в браузере ваш домен (yourdomain.com). А дальше можно залогиниться в админке: yourdomain.com/wp-admin.

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

Шаг #3 Устанавливаем плагин WooCommerce

Как и с любым другим плагином WordPress, нам нужно пойти на страницу «Плагины» > «Добавить новый». Находясь здесь, вводим в поисковое поле «WooCommerce». Первым результатом в поисковом поле будет WooCommerce.

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

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

Создаем основные страницы магазина

Интернет-магазин – это отдельный вид сайта, на котором есть специфические страницы. И первый шаг в настройке интернет-магазина – это создание таких вот страниц:

  • Шоп, магазин – это те страницы сайта, где будет представлен ваш товар
  • Корзина – это страница, куда добавляются товары, которые выбирают ваши покупатели перед тем, как осуществить покупку
  • Касса (checkout) – это где клиенты выбирают предпочитаемый способ доставки и оплачивают все, что они купили
  • Аккаунт – это страница профиля, личного кабинета зарегистрированного пользователя. Здесь клиенты смогут посмотреть их прошлые покупки и управлять другими функциями.

Все, что вам потребуется сделать на этом шаге – это кликать на кнопку «Продолжить». WooCommerce настроит все нужные страницы самостоятельно.

Локальные настройки WooCommerce

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

Выбираем предпочитаемый вариант оплаты

Способность принимать онлайн-платежи – это ключевой момент интернет-магазина. Вариантов предостаточно, включая биткоин, прямые банковские переводы, чековые платежи, оплата наложенным платежом, PayPal.

предпочитаемый вариант оплаты WooCommerce

В буржунете наиболее распространены приемы платежей в PayPal. Этот метод платежей легко интегрировать и он подходит в 99,99% случаев.

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

Шаг #4 Добавляем свой первый продукт

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

Чтобы создать новый продукт, в панели управления WordPress находим заголовок «Товары» > «Добавить новый», нажимаем на «Добавить новый»

добавляем товар Woocommerce

Дальше мы должны оказаться в привычном нам окне редактирования контента классического редактора WordPress.

добавляем товар Woocommerce

  1. Название товара
  2. Главное описание товара. Это поле позволит вам ввести любое количество описания товара, которое вам потребуется. Так как это WordPress, вы сможете добавить сюда не только текст, но и изображения, столбцы, заголовки, видео и другие медиа. В общем, здесь можно добавить все, что вам потребуется
  3. Это одна из важнейших секций с данными о товаре. Здесь вы сможете установить тип продукта, который вы добавляете, и указать, либо это будет физический продукт, либо скачиваемый (скачиваемые товары предоставляют доступ к файлу после покупки), либо виртуальный (сервисы тоже можно отнести к виртуальным продуктам). В этом же блоке можно заполнить соответствующие значения различных параметров продукта, таких как:
  4. – Основные. В этой секции можно установить базовую цену товара
    – Запасы. WooCommerce позволяет вам управлять уровнем запаса продаваемого товара
    – Доставка. Можно установить вес, размеры и стоимость доставки товара
    – Сопутствующие товары. Идеально подходит для настройки дополнительных (сопутствующих) продаж, кросс-продаж и т.д. Условно, продавая мобильные телефоны, можно предлагать покупать чехлы для них
    – Атрибуты. Установка произвольных атрибутов для продаваемых товаров. Например, если вы продаете рубашки, то в этой секции можно установить альтернативные цвета
    – Дополнительно. Дополнительные настройки, не так существенно.

  5. Краткое описание товара. Это текст, который отображается на странице товара под его названием. Используется как краткое описание сущности продаваемого товара.
  6. Категории товаров. Похожие товары, объединенные в группы, например, шапки, рубашки и т.д. Работает также, как и стандартные WordPress категории (см. Как оптимизировать категории WordPress и страницы тегов для SEO)
  7. Метки товаров. Еще один способ организовать группировку товаров. Работает также как и стандартные WordPress теги
  8. Изображение товара. Главное изображение для продаваемого товара
  9. Галерея товара. Дополнительное изображение для продукта, чтобы продемонстрировать его крутость =)

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

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

Шаг #5 Выбираем тему для интернет-магазина (бесплатно)

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

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

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

WooCommerce и наша текущая тема

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

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

Вот рекомендации:

выбор темы для WooCommerce

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

тема Storefront

Если эта тема не понравится, можно заглянуть на сайт themeforest.net и подыскать подходящий вариант. ThemeForest – это, пожалуй, самая большая директория премиум шаблонов для WordPress.

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

Правильный дизайн интернет-магазина

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

Что делает дизайн интернет-магазина хорошим (читай – профитным)? Вот эти критические параметры:

  • Дизайн должен быть простым и понятным. Посетители не будут покупать, если все будет запутанно
  • Центральный контент-блок на сайте должен привлекать к себе внимание в первую очередь при попадании пользователя на сайт. Центральный контент-блок – это место вывода карточек товаров (как на изображении выше, где сумки)
  • Настраиваемые сайдбары. Вы должны определиться, сколько вам нужно сайдбаров, а для некоторых страниц отключить их вообще (подробнее об этом ниже)
  • Отзывчивый и оптимизированный для мобильных устройств. Исследования показывают, что более 80% интернет-пользователей – это владельцы смартфонов. И если дизайн интернет-магазина не будет оптимизирован для мобильных устройств, вы будете терять посетителей (клиентов)
  • Хорошая структура навигации (см. Как правильно оптимизировать структуру сайта для нужд SEO). Должны быть меню, которые легко понять, чтобы ваши посетители легко могли найти страницу, которую они ищут

Помня сказанное выше, вот что можно сделать с отдельными страницами магазина:

Страница вашего магазина

Это где будет находиться основной список ваших товаров. Если вы уже поигрались с настройками WooCommerce, то эту страницу можно было бы найти по адресу: mysite.com/shop.

Это стандартная WordPress страница, и вы можете редактировать ее через панель управления WordPress.

Вот то, что необходимо сделать:

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

контент-поле Storefront

Главная особенность страницы магазина заключается в том, что прямо над стандартным контентом есть рандомная часть, где отображается список товаров. Вот как это выглядит в теме Storefront

список товаров Storefront

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

Отдельная страница продукта

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

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

Вот пример карточки товара темы Storefront. Здесь стоят настройки по-умолчанию

карточка товара Storefront

Корзина товара

Еще одна ключевая страница, которая должна быть приведена в надлежащий вид – это корзина товара.

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

корзина товара Woocommerce

Заказ

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

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

страница заказа woocommerce

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

Шаг #6 Расширяем функционал Woocommerce

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

Полезные плагины Woocommerce:

Давайте сначала начнем с официальных расширений, которые были одобрены командой Woocommerce. Чтобы посмотреть все доступные плагины для Woocommerce, идем на эту страницу.

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

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

  • WooCommerce Shop to Facebook. Facebook – это мощный канал продаж, поэтому наличие вашего магазина еще и в Facebook непременно повлечет рост продаж. С помощью данного плагина вы быстро и просто перенесете все свои товары в Facebook, а также сможете настроить важные параметры
  • Booster for WooCommerce. Этот плагин окажется незаменимым, если у вас на сайте тысячи различных товаров, а вам иногда необходимо внести в них правки, а править вручную каждый товар – это просто сумасшествие. Тогда на помощь придет плагин Booster for WooCommerce, с помощью которого можно производить массовые операции над товарами, например, можно разом изменить все значения цены у товаров и прочее.
  • WooCommerce — платежный шлюз для Робокассы. С помощью этого плагина вы сможете подключить платежный агрегатор Робокасса в качестве платежного шлюза.
  • WPML – это плагин для создания многоязычных сайтов на базе WordPress. Полностью совместим с WooCommerce
  • YITH WooCommerce Wishlist. С помощью плагина ваши потенциальные покупатели смогут добавлять на вашем сайте товары в так называемый wishlist, то есть, список понравившихся товаров. Совместим с плагином WPML
  • Woo Pack & Ship Bundle. Этот платный плагин пригодится, если вы пакуете и отправляете свои товары покупателям. С помощью плагина можно настроить варианты доставки, отслеживания доставки, формировать заказы с помощью Amazon fulfillment и т.п.

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

Еще полезные плагины

Есть ряд плагинов, которые можно использовать в связке Woocommerce + WordPress. Они, вне всяких сомнений, весьма полезны:

  • Yoast SEO – плагин для установки параметров, помогающих в SEO продвижении сайта
  • Contact Form 7 – плагин, с помощью которого посетители сайта смогут писать вам напрямую
  • UpdraftPlus – бэкапы всего сайта
  • MonsterInsights – интеграция вашего сайта с Google Analytics.

Создание интернет-магазина (если кратко)

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

Тем не менее, это реально круто, потому что создать интернет магазин на WordPress с помощью плагина Woocommerce сможет любой человек, не являющийся веб-разработчиком. Хотя еще лет пять-десять назад за эту же самую работу вам пришлось бы заплатить несколько тысяч долларов.

В заключение делюсь простым чек-листом по созданию интернет-магазина на WordPress.

Перед тем, как вы вообще начали что-либо делать:

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

Устанавливаем Woocommerce

  • Устанавливаем и активируем плагин Woocommerce
  • Проходим все шаги по мастеру установки, особое внимание акцентируем на настройках страниц корзины, оплаты, настройках налогов и доставке товаров, настройке методов оплаты.

Дизайн

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

Плагины

Рассмотрите возможность установить полезные дополнительные плагины, такие как, например, Yoast SEO, Akismet Anti-Spam, Smush Image Compression and Optimization, Google Analytics Dashboard for WP by ExactMetrics, Google XML Sitemaps, Elementor Page Builder, UpdraftPlus WordPress Backup Plugin, TinyMCE Advanced, WP Super Cache.

Оцените статью по 5-бальной шкале:

1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (1 оценок, среднее: 5,00 из 5)
Загрузка...




Подпишитесь на e-mail рассылку

блога max1net.com

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

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

Ваши персональные данные защищены.