Инструменты пользователя

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


kak_otkryt_internet-magazin

Содержание

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

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

Помимо популярных CMS типа OpenCart, Shopify, Magento, ECSHOP и пр., обратите внимание на менее популярные разработки.

  • Okay CMS, https://okay-cms.com Все нужное для SEO здесь есть. Ну и весь другой важный функционал.
  • Diafan CMS, https://www.diafan.ru много положительных отзывов от российских коллег

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

Статистика использования 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

Украина:

•  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

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

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

FAQ WooCommerce 3.4

  • Минимальные требования для корректной работы плагина WooCommerce: PHP 7.0, memory limit 128 Mb.
  • Размер изображения товара квадратный (1:1), рекомендую 800х800px

WooCommerce добавление товаров

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

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

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

Кастомизация Storefront темы для WooCommerce

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

Все изменения Storefront рекомендуется производить в дочерней теме. Скачать чистую дочернюю тему Storefront.

Как убрать product и product-categoty из URL WooCommerce?

Простого решения нет. Существуют платные плагины для решения проблемы.

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

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

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

Как вместо знака валюты вывести название валюты в WooCommerce?

По умолчанию, 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?

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

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

Как удалить форму отзывов на странице в WooCommerce?

Для удаления вкладки отзывов достаточно добавить небольшой код в файл functions.php активной темы на вашем сайте.

<?php
add_filter( 'woocommerce_product_tabs', 'wcs_woo_remove_reviews_tab', 98 );
function wcs_woo_remove_reviews_tab($tabs) {
    unset($tabs['reviews']);
    return $tabs;
}
?>

После этого обновите файл functions.php на сервере и обновив страницу товара вы увидите что вкладка Отзывы на странице товара отключена.

Как убрать ссылку на Storefront Woocommerce в футере сайта?

Для того чтобы убрать ссылку с надписью "Работает на Storefront и WooCommerce.", нужно переопределить встроенную в тему Storefront функцию storefront_credit. Для этого в дочерней теме Storefront в файле functions.php вписываем код

  1. Первый вариант (рекомендуемый мной)
    /*Delete Footer Text in the Storefront Theme */
     
    function storefront_credit() {
            ?>
            <div class="site-info">
                    &copy; <?php echo get_bloginfo( 'name' ) . ' ' . get_the_date( 'Y' ); ?>
            </div><!-- .site-info -->
            <?php
    }
  2. Второй вариант, очень сильно распространенный в интернете, но на мой взгляд не к месту сложный
    add_action( 'init', 'custom_remove_footer_credit', 10 );
     
    function custom_remove_footer_credit () {
        remove_action( 'storefront_footer', 'storefront_credit', 20 );
        add_action( 'storefront_footer', 'custom_storefront_credit', 20 );
    } 
     
    function custom_storefront_credit() {
    	?>
    	<div class="site-info">
    		&copy; <?php echo get_bloginfo( 'name' ) . ' ' . get_the_date( 'Y' ); ?>
    	</div><!-- .site-info -->
    	<?php
    }

Как в Wordpress Storefront Woocommerce в футере социальные иконки сделать FB и Instagram (2 варианта)

Первый вариант:

  1. Код для социальных сетей HTML и CSS копируем из https://inter-net.pro/css/knopki-sotssetej-dlya-sajta
  2. Код CSS вставляем в файл стилей дочерней темы Storefront public/wp-content/themes/storefront-child/style.css
  3. Код HTML вставляем в файл footer.php дочерней темы Storefront public/wp-content/themes/storefront-child/footer.php перед строкой </div><!– .col-full –>

Второй вариант (рекомендую!): установите виджет от Jetpack настройте его

Как сделать поиск по артикулу (SKU) товара в WooCommerce

Поиск товара по артикулу (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.

Как удалить похожие товары в woocommerce

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

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

Как заменить слово "Распродажа" Акция в woocommerce

Для замены этого слова нужно использовать хук 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

  • Easy Woocommerce Customizer не обновлялся с 2 года, но работает. Позволяет удалить лишние поля со страницы «Оформление заказа» или добавить новые.
  • Booster for WooCommerce умеет изменять цены и валюты. Ценовые и кнопочные этикетки. Добавить пользовательские данные на странице корзины.

Плагин кеширования для WooCommerce

Google аналитика и 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

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

Оформление страницы заказа плагин WooCommerce Flexible Checkout Fields

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

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

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

На вкладке Appearance:

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

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

загрузка...
kak_otkryt_internet-magazin.txt · Последние изменения: 2018/10/13 17:52 — darkfire