Как открыть интернет-магазин?

Читайте также:

Техническая реализация интернет магазина на плагине WooCommerce для Wordpress.

Популярные CMS для магазинов Преимущества и особенности системы Opencart для сайта-магазина, Shopify, Magento и менее популярные разработки ECSHOP, Okay CMS, Diafan CMS.

Плагины WooCommerce

  1. Плагин Product Subtitle For WooCommerce создает заголовки и подзаголовки для товаров. Подзаголовок можно будет указывать для названия товара, для цены, для рейтинга, для отрывка, для описания, для кнопки "Добавить в корзину". В настройках плагина можно будет указать расположение надписи, до или после. Можно будет выбрать размер подзаголовка или заголовка от h1 до h6, либо обычный текст.

Статистика использования CMS для интернет-магазинов по данным built with.

По всему интернету:

•  35% WooCommerce
•  8%  Shopify
•  4%  Magento
•  1%  BigCommerce
•  52% Другие CMS

Россия:

•  50% OpenCart
•  11% VirtueMart
•  8%  Wix Stores
•  7%  PrestaShop
•  6%  InSales
•  3%  osCommerce

Характеристика ГЕO Украина. Важно выбрать оптимальный хостинг для вашего магазина в Украине.

•  65% OpenCart
•  9%  VirtueMart
•  8%  PrestaShop
•  5%  Magento
•  4%  osCommerce

Китай:

•  53% ECSHOP
•  24% Zen Cart
•  5%  Magento
•  3%  ShopEx
•  2% OpenCart

США:

•  20% Shopify
•  19% Wix Stores
•  11% Squarespace Commerce
•  7%  Magento
•  5%  Zen Cart
•  5%  OpenCart
•  5%  Weebly eCommerce
•  5%  PrestaShop

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

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

Минимальные системные требования для корректной работы плагина WooCommerce: PHP 7.0, memory limit 128 Mb.

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

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

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

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

  • Категория товара – категория товара помогает сгруппировать ваши товары. К примеру, если вы продаете верхнюю одежду, белье и другие группы товаров. Категория позволяет покупателю быстро найти товар из той же категории. Вы можете создать столько категорий, сколько захотите и сможете отредактировать их в любое время.
  • Атрибуты – атрибуты помогают в сортировке товаров. Размер, цвет, ткань и другие атрибуты помогают пользователю легко выбрать желаемый товар. Вы можете присвоить атрибут для каждого товара по отдельности, либо установить атрибут для всей страницы.
  • Тип товара – в WooCommerce существуют предустановленные типы товаров, которые сэкономят ваше время.
  • Простой – этот тип товаров поставляется без каких-либо опций. К примеру, бумажная книга.
  • Сгруппированный – это группа связанных между собой простых товаров, которые можно купить отдельно. Например, Playstation может быть сгруппированным товаром с 80Гб, 120Гб и 200Гб памяти и являться вариацией одного и того же родительского товара.
  • Виртуальный – товары не нуждающиеся в доставке, вроде услуг.
  • Скачиваемый – это товары которые вы можете скачать. К примеру песни, изображения, видео, электронные книги и т.д.
  • Внешний/Партнерский – вы рекламируете этот товар на вашем сайте, но он продается в другом месте.
  • Вариативный – эти товары имеют разные свойства: размер, цвет и т.д. К примеру одежда.

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

Простого решения нет. Существуют платные плагины для решения проблемы, например Настройка Rank Math SEO плагина для WordPress.

Моя настройка: переходим "Настройка-постоянные ссылки":

  1. Параметр "База категорий товара" указываем одну букву "p"
  2. В группе "Постоянные ссылки товаров" выбираем параметр "База магазина"

Получаем укороченный URL и все товары буду находится в категории /shop/

По умолчанию, WooCommerce выводит украинскую гривну в виде знака (₴). Мне нужно знак (₴) заменить на грн. Для этого в Woocommerce существует встроенная функция woocommerce_currency_symbol. Ниже указан код, который требуется вставить в function.php темы вашего магазина:

add_filter('woocommerce_currency_symbol', 'change_existing_currency_symbol', 10, 2);
 
function change_existing_currency_symbol( $currency_symbol, $currency ) {
     return 'грн';
}

Более подробно смотрите в документации WooCommerce Change a currency symbol

Для включения системы рейтингов WooCommerce для определенного товара:

  1. Авторизуйтесь в админ-панель вашего сайта и перейдите во вкладку Товары → Все товары
  2. Нажмите на кнопку Свойства нужного вам товара.
  3. Поставьте галочку "Включить отзывы" и нажмите обновить, смотрите скриншот ниже. После этого на странице товара станет активная вкладка отзывов.

Поиск товара по артикулу (SKU) в Wordpress Storefront Woocommerce не реализован. Поиск товаров по артикулу нужен менеджерам, общающихся с заказчиками в онлайн-режиме, проводящих ревизии интернет-магазина, создающих выборки определенных типов товаров. Полезным окажется такой поиск и для посетителей интернет-магазина, знающих артикулы продукции.

В интернете я нашел 2 варианта.

(Рекомендую!) Первый вариант позволяет добавить поиск только по артикулу (SKU) товара в WooCommerce. Плагин Search by SKU for Woocommerce By Matthew Lawson. После установки и активации плагина. На странице Виджеты разместите в подходящее место стандартный (дефолтный) виджет WordPress Поиск. Особых рекомендаций к месту размещения нет – вебмастеры устанавливают поисковое поле и в навигационное меню, и в шапку сайта, и в сайдбар (боковую панель). Выбирайте сами, ориентируясь на дизайн вашего интернет-магазина. Установленный плагин дополняет стандартный Поиск возможностью поиска по артикулам товаров в Woocommerce. При этом стандартные «свойства» поисковый движок WordPress не теряет. Search by SKU не имеет настроек и начинает работу сразу после активации.

Второй вариант добавляет поиск Woocommerce по артикулу, атрибутам, описанию товара и цене товара. Источник: Поиск Woocommerce по артикулу, атрибутам, описанию товара. Поиск woocommerce по умолчанию ищет по заголовку товара и его описанию. Для того, чтобы поиск смог искать по артикулу, атрибутам товара и любым другим мета-данным (например по цене товара) нужно установить плагин Relevanssi – A Better Search By Mikko Saari . Он также умеет делать поисковую выдачу более релевантной запросу, чем стандартный поиск WooCommerce.

Для правильной настройки читаем статью Relevanssi Index SKUs

Для того, чтобы настроить поиск по товарам и категориям WooCommerce перейдем в настройки плагина ( меню настройки→Relevanssi):

  • Настройки индексирования выделяем product и product_variation
  • Выберите таксономии для индексирования - тут выделяем product_cat и product_tag
  • Произвольные поля (Custom fields) для индексирования: выбираем all
  • Снимаем галочку: Expand shortcodes when indexing
  • Для создания индекса жмем кнопку "Build the index", смотрите на скрншоте:

Итак, задача: У меня есть вариативные товары:

  • портативная аудиоколонка (цвет чёрный и серебристый);
  • чехол-бампер для неё (пяти цветов);

и простой товар:

  • дорожная сумка для неё.

Из этих трёх товаров мне хочется сделать ещё один товар (сгруппированный) - комплект: серебристая колонка + розовый чехол + сумка.

Решение:

  1. Дублирую товар "портативная аудиоколонка", удаляю вариации, меняю название и URL, меняю тип товара на сгруппированный. Публикую его.
  2. Захожу в редактирование товара "дорожная сумка" и во вкладке "Сопутствующие" нахожу и добавляю Группировку - товар, созданный в пункте 1. Всё просто, потому что товар простой.
  3. Если попытаться точно так же добавить розовый чехол или серебристую колонку, то не получится. Поэтому опять выполняем п.1 с нужным вариативным товаром и публикуем нужную вариацию в виде простого, но СКРЫТОГО товара. Затем легко добавляем его в группировку, как в п.2.

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

remove_action('woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20);

Для замены этого слова нужно использовать хук woocommerce_sale_flash.

add_filter('woocommerce_sale_flash', 'my_custom_sale_flash');
function my_custom_sale_flash() {
return '<span class="onsale">Акция!</span>';
}

Для изменения стиля надписи, добавим в файл style.css дочерней темы Storefront

span.onsale {
padding: 3px 7px;
background: #7b1616;
color: white;
font-size: 13px;
}

Если вы хотите изменить стандартные названия кнопок в WooCommerce, вам надо добавить несколько строк кода в файл functions.php. Вы можете добавить этот код в файл functions.php дочерней темы. Альтернативный вариант переименования кнопок - это использования плагина Booster WooCommerce.

<?php
/* Add to cart */
add_filter( 'woocommerce_product_single_add_to_cart_text', 'tb_woo_custom_cart_button_text' );
add_filter( 'woocommerce_product_add_to_cart_text', 'tb_woo_custom_cart_button_text' );   
function tb_woo_custom_cart_button_text() {
        return __( 'Купить', 'woocommerce' );
}

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

Удалить с помощью кода:

add_filter( 'woocommerce_cart_needs_shipping_address', '__return_false');

Отключить woocommerce-product-gallery__trigger. По умолчанию увеличение изображения включено для продуктов в магазине WooCommerce. Но я не хочу масштабировать изображение. Для отключения лайтбокса и кнопки "Лупа" используйте код:

// Удаляет лупу для увеличения картинок
function remove_product_zoom_support() {
    remove_theme_support( 'wc-product-gallery-zoom' );
}
add_action( 'wp', 'remove_product_zoom_support', 100 );
  • Saphali Woocommerce Russian – Набор Русских дополнений для магазина WooCommerce! В общий список валют будут добавлены: Украинская гривна, Российский рубль, Белорусский рубль, Армянский драм, Киргизский сом, Казахстанский тенге, Узбекский сум.
  • Easy Woocommerce Customizer не обновлялся с 2 года, но работает. Позволяет удалить лишние поля со страницы «Оформление заказа» или добавить новые.
  • Booster for WooCommerce умеет изменять цены и валюты. Ценовые и кнопочные этикетки. Добавить пользовательские данные на странице корзины.

WooCommerce Google Analytics Integration - для подключения Google Аналитика. Бесплатный. После установки плагина, появляется вкладка "Интеграция": WooCommerce→ Настройки→ Интеграция. Где нужно вставить Google Analytics ID.

В настройках Google Analytics обязательно включите расширенную электронную торговлю и ремаркетинг.

Для корректной работы плагина необходимо внести следующие настройки:

  1. Google Analytics ID: сюда вставляем ваш ID, полученный на этапе настройки Google Analytics
  2. Enable Standard Tracking: включаем
  3. Enable Universal Analytics: отмечаем
  4. Purchase Transactions: отмечаем
  5. Add to Cart Events: отмечаем
  6. Enable Enhanced eCommerce: отмечаем

Остальные пункты можно оставить без изменений.

Плагин GoogleTag Assistant не видит кода Google аналитика на сайте, но все работает!

Плагин WooCommerce Extended Coupon Features расширяет возможности настроек купонов. После активации плагина добавятся новые настройки WooCommerce→Купоны.

Эта задача актуальна, если у вас настроено отображение не категорий/производителей, а сразу всей продукции магазина. Хак находим на официальном сайте с документацией Вукоммерс.

function custom_pre_get_posts_query( $q ) {
 
    $tax_query = (array) $q->get( 'tax_query' );
 
    $tax_query[] = array(
           'taxonomy' => 'product_cat',
           'field' => 'slug',
           'terms' => array( 'clothing' ), // Don't display products in the clothing category on the shop page.
           'operator' => 'NOT IN'
    );
 
 
    $q->set( 'tax_query', $tax_query );
 
}
add_action( 'woocommerce_product_query', 'custom_pre_get_posts_query' );

Важно! Тут вместо «clothing» опять же подставляете свой slug, причем если вам нужно исключить несколько рубрик, то в сниппете, указанном выше, сроку с параметром ‘terms’ надо заменить на следующую (не забудьте запятую в конце):

'terms' => array( 'chaj','hyson' ),

После установки и активации плагина перейдите на страницу: Woocommerce —> Checkout Fields. Здесь вы можете редактировать поля, которые отображаются на странице оформления заказа.

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

  • Enable Field, включить или отключить поле.
  • Required Field, сделать поле обязательным или нет.
  • Label, указать название поля.

На вкладке Appearance:

  • Placeholder, можно указать текст внутри поля по умолчанию.
  • CSS Class, указать стиль и класс поля.
  • Сохраните изменения.

Можно добавить новое поле. Слева в блоке Add New Field, выберите тип поля, укажите название поля и нажмите на кнопку Add Field. Справа у вас появится новый виджет поля. Сохраните настройки.