Различия

Показаны различия между двумя версиями страницы.


Предыдущая версия
woocommerce [2025/06/25 12:29] (текущий) – [Расширение и плагины для WooCommerce] darkfire
Строка 1: Строка 1:
 +====== Как открыть интернет-магазин? ======
 +
 +~~Title: Интернет-магазин с помощью плагина WooCommerce для Wordpress~~
 +{{htmlmetatags>
 +metatag-description=(Как настроить магазин на плагине WooCommerce для Wordpress.)
 +}}
 +
 +{{ ::wordpress-woocommerce-02.jpg?nolink&400 |}}
 +
 +Популярные CMS для магазинов [[OpenCart|OpenCart]], [[https://dieg.info/review/obzor-shopify/|Shopify]], Magento и менее популярные разработки ECSHOP, Okay CMS, Diafan CMS. [[https://ru.wordpress.org/plugins/woocommerce/|WooCommerce]] – это бесплатный плагин электронной коммерции с открытым исходным кодом, разработанный специально для WordPress. Это отличная платформа для магазина любых размеров. WooCommerce имеет целый ряд функций, таких как различные способы доставки и приема платежей, настраиваемые типы товаров и многое другое.
 +
 +WooCommerce устанавливается стандартно из каталога бесплатных плагинов WordPress. После завершения установки, вы увидите приветственное сообщение от WooCommerce с просьбой о запуске Помощника установки.
 +
 +Техническая реализация интернет магазина на плагине WooCommerce для [[Wordpress|Wordpress]]. Читайте также:
 +  * [[отключение лишних функции WooCommerce]]
 +  * [[WooCommerce перевод строк]]
 +  * [[Шорткоды WordPress]]
 +  * [[Storefront]]
 +  * [[sortirovka_tovara_v_woocommerce_storefront]]
 +  * [[woocommerce_pinterest]]
 +  * [[vkladki_v_kartochke_tovara_woocommerce]]
 +  * [[REST API WC WooCommerce]]
 +  * [[wordpress#kak_avtomaticheski_dobavit_alt_title_k_zagruzhennym_kartinkam_wordpress_woocommerce|Как автоматически добавить alt, title к загруженным картинкам Wordpress WooCommerce?]]
 +  * [[woocommerce_sozdanie_unikalnogo_url_dlja_kazhdogo_tovara]]
 +
 +===== Плагины для WooCommerce =====
 +  * Плагин Product Subtitle For WooCommerce создает заголовки и подзаголовки для товаров. Подзаголовок можно будет указывать для названия товара, для цены, для рейтинга, для отрывка, для описания, для кнопки "Добавить в корзину". В настройках плагина можно будет указать расположение надписи, до или после. Можно будет выбрать размер подзаголовка или заголовка от h1 до h6, либо обычный текст.
 +  * [[wcpt]]
 +===== Статистика использования CMS для интернет-магазинов =====
 +
 +Статистика использования CMS для интернет-магазинов по данным [[https://builtwith.com|BuiltWith Top Sites Rank]].
 +
 +По всему интернету:
 +<file>
 +•  35% WooCommerce
 +•  8%  Shopify
 +•  4%  Magento
 +•  1%  BigCommerce
 +•  52% Другие CMS
 +</file>
 +
 +Россия:
 +<file>
 +•  50% OpenCart
 +•  11% VirtueMart
 +•  8%  Wix Stores
 +•  7%  PrestaShop
 +•  6%  InSales
 +•  3%  osCommerce
 +
 +</file>
 +Характеристика ГЕO [[xarakteristiki_geo#ukraina|Украина]]. Важно [[https://dieg.info/tsod/ukraine/|выбрать оптимальный хостинг]] для вашего магазина в Украине.
 +<file>
 +•  65% OpenCart
 +•  9%  VirtueMart
 +•  8%  PrestaShop
 +•  5%  Magento
 +•  4%  osCommerce
 +</file>
 +
 +Китай:
 +<file>
 +•  53% ECSHOP
 +•  24% Zen Cart
 +•  5%  Magento
 +•  3%  ShopEx
 +•  2% OpenCart
 +</file>
 +
 +США:
 +
 +  * 20% [[https://dieg.info/review/obzor-shopify/|Обзор возможностей Shopify]]
 +  * 19% Wix Stores
 +  * 11% Squarespace Commerce
 +  * 7%  Magento
 +  * 5%  Zen Cart
 +  * 5%  OpenCart
 +  * 5%  Weebly eCommerce
 +  * 5%  [[PrestaShop|PrestaShop]]
 +
 +
 +===== FAQ Правильный старт WooCommerce 3.4 и выше =====
 +Минимальные системные требования для корректной работы плагина WooCommerce: PHP 7.0, memory limit 128 Mb.
 +
 +Желательно выбирать [[https://dieg.info|хорошо зарекомендовавший себя хостинг]], который будет заточен под работу с WordPress вообще и возможно именно под интернет магазин. Если у вас большие амбиции в плане электронной коммерции, у вашего интернет-магазина хорошая посещаемость, и там уже добавлено 100+ товаров, то советуем вам [[https://dieg.info|подумать о VPS]].
 +
 +==== Как убрать (отключить) страницы атрибутов woocommerce? ====
 +
 +Каждый атрибут, и его значение в сайте WooCommerce создает страницы. Зачастую это мусорные страницы и на них никогда не будет [[SEO|SEO]]. Иногда такие страницы действительно нужно, иногда нет. Если вы не уверены нудны или нет - закройте их от индексации [[yoast_seo|плагином Yoast SEO]].
 +
 +Если вам точно они не нужны, зайдите в настройку атрибутов и уберите галочка с "Включать архивы".
 +{{ ::galochka_vkljuchit_arxivy_vukomers.jpg?nolink&600 |}}
 +
 +==== WooCommerce добавление товаров ====
 +
 +Для запуска интернет-магазина, безусловно, первой вещью является  добавление товаров. Но для начала важно изучить основы WooCommerce и узнать о том, что такое категории, атрибуты и типы товаров:
 +
 +  * **Категория товара** – категория товара помогает сгруппировать ваши товары. К примеру, если вы продаете верхнюю одежду, белье и другие группы товаров. Категория позволяет покупателю быстро найти товар из той же категории. Вы можете создать столько категорий, сколько захотите и сможете отредактировать их в любое время.
 +  * **Атрибуты** – атрибуты помогают в сортировке товаров. Размер, цвет, ткань и другие атрибуты помогают пользователю легко выбрать желаемый товар. Вы можете присвоить атрибут для каждого товара по отдельности, либо установить атрибут для всей страницы.
 +  * **Тип товара** – в WooCommerce существуют предустановленные типы товаров, которые сэкономят ваше время.
 +  * **Простой** – этот тип товаров поставляется без каких-либо опций. К примеру, бумажная книга.
 +  * **Сгруппированный** – это группа связанных между собой **простых товаров**, которые можно купить отдельно. Например, Playstation может быть сгруппированным товаром с 80Гб, 120Гб и 200Гб памяти и являться вариацией одного и того же родительского товара.
 +  * **Виртуальный** – товары не нуждающиеся в доставке, вроде услуг.
 +  * **Скачиваемый** – это товары которые вы можете скачать. К примеру песни, изображения, видео, электронные книги и т.д.
 +  * **Внешний/Партнерский** – вы рекламируете этот товар на вашем сайте, но он продается в другом месте.
 +  * **Вариативный** – эти товары имеют разные свойства: размер, цвет и т.д. К примеру одежда.
 +
 +Процесс добавления товаров на ваш сайт напоминает публикацию статьи в блоге. Для начала, пройдите в раздел Товары и кликните кнопку Добавить товар или Создайте свой первый товар!
 +
 +
 +==== Как убрать product и product-categoty из URL WooCommerce? ====
 +Простого решения нет. Существуют платные плагины для решения проблемы, например [[Rank Math]].
 +
 +Моя настройка: переходим "Настройка-постоянные ссылки":
 +  - Параметр "База категорий товара" указываем одну букву "p"
 +  - В группе "Постоянные ссылки товаров" выбираем параметр "База магазина"
 +
 +Получаем укороченный URL и все товары буду находится в категории /shop/
 +{{ ::woo-01.jpg?nolink&600 |}}
 +
 +
 +==== Как вместо знака валюты вывести название валюты в WooCommerce? ====
 +По умолчанию, WooCommerce выводит украинскую гривну в виде знака (₴). Мне нужно знак (₴) заменить на грн.
 +Для этого в Woocommerce существует встроенная функция woocommerce_currency_symbol. Ниже указан код, который требуется вставить в function.php темы вашего магазина:
 +<file php>
 +add_filter('woocommerce_currency_symbol', 'change_existing_currency_symbol', 10, 2);
 +
 +function change_existing_currency_symbol( $currency_symbol, $currency ) {
 +     return 'грн';
 +}
 +</file> Более подробно смотрите в документации WooCommerce [[https://docs.woocommerce.com/document/change-a-currency-symbol/|Change a currency symbol]]
 +
 +==== Как включить или отключить систему рейтингов товаров и отзывы в WooCommerce? ====
 +
 +Для включения системы рейтингов WooCommerce для определенного товара:
 +  - Авторизуйтесь в админ-панель вашего сайта и перейдите во вкладку Товары -> Все товары
 +  - Нажмите на кнопку Свойства нужного вам товара.
 +  - Поставьте галочку "Включить отзывы" и нажмите обновить, смотрите скриншот ниже. После этого на странице товара станет активная вкладка отзывов.
 +
 +{{ ::woo-02.jpg?direct&600 |}}
 +
 +==== Как сделать поиск по артикулу (SKU) товара в WooCommerce ====
 +Поиск товара по артикулу (SKU) в Wordpress Storefront Woocommerce не реализован. Поиск товаров по артикулу нужен менеджерам, общающихся с заказчиками в онлайн-режиме, проводящих ревизии интернет-магазина, создающих выборки определенных типов товаров. Полезным окажется такой поиск и для посетителей интернет-магазина, знающих артикулы продукции.
 +
 +В интернете я нашел 2 варианта.
 +
 +**(Рекомендую!) Первый вариант позволяет добавить поиск только по артикулу (SKU) товара в WooCommerce.**
 +Плагин [[https://wordpress.org/plugins/search-by-sku-for-woocommerce/|Search by SKU for Woocommerce
 +By Matthew Lawson]]. После установки и активации плагина. На странице Виджеты разместите в подходящее место стандартный (дефолтный) виджет WordPress Поиск. Особых рекомендаций к месту размещения нет – вебмастеры устанавливают поисковое поле и в навигационное меню, и в шапку сайта, и в сайдбар (боковую панель). Выбирайте сами, ориентируясь на дизайн вашего интернет-магазина. Установленный плагин дополняет стандартный Поиск возможностью поиска по артикулам товаров в Woocommerce. При этом стандартные «свойства» поисковый движок WordPress не теряет. Search by SKU не имеет настроек и начинает работу сразу после активации.
 +
 +**Второй вариант добавляет поиск Woocommerce по артикулу, атрибутам, описанию товара и цене товара.** Источник: [[https://inprocess.by/blog/poisk-woocommerce-po-artikulu-atributam-opisaniyu-tovara/|Поиск Woocommerce по артикулу, атрибутам, описанию товара]]. Поиск woocommerce по умолчанию ищет по заголовку товара и его описанию. Для того, чтобы поиск смог искать по артикулу, атрибутам товара и любым другим мета-данным (например по цене товара) нужно установить [[https://wordpress.org/plugins/relevanssi/|плагин Relevanssi – A Better Search
 +By Mikko Saari]] . Он также умеет делать поисковую выдачу более релевантной запросу, чем стандартный поиск WooCommerce.
 +
 +<note warning>Для правильной настройки читаем статью [[https://www.relevanssi.com/user-manual/woocommerce/|Relevanssi Index SKUs]]</note>
 +
 +Для того, чтобы настроить поиск по товарам и категориям WooCommerce перейдем в настройки плагина ( меню настройки->Relevanssi):
 +  * Настройки индексирования выделяем product и product_variation
 +  * Выберите таксономии для индексирования - тут выделяем product_cat и product_tag
 +  * Произвольные поля (Custom fields) для индексирования: выбираем all
 +  * Снимаем галочку: Expand shortcodes when indexing
 +  * Для создания индекса жмем кнопку "Build the index", смотрите на скрншоте:
 +
 +{{ ::relevanssi-01.jpg?nolink&600 |}}
 +==== Как добавить вариативный товар в сгруппированный? ====
 +
 +Итак, задача:
 +У меня есть вариативные товары:
 +  * портативная аудиоколонка (цвет чёрный и серебристый);
 +  * чехол-бампер для неё (пяти цветов);
 +и простой товар:
 +  * дорожная сумка для неё.
 +
 +Из этих трёх товаров мне хочется сделать ещё один товар (сгруппированный) - комплект: серебристая колонка + розовый чехол + сумка.
 +
 +Решение:
 +  - Дублирую товар "портативная аудиоколонка", удаляю вариации, меняю название и URL, меняю тип товара на сгруппированный. Публикую его.
 +  - Захожу в редактирование товара "дорожная сумка" и во вкладке "Сопутствующие" нахожу и добавляю Группировку - товар, созданный в пункте 1. Всё просто, потому что товар простой.
 +  - Если попытаться точно так же добавить розовый чехол или серебристую колонку, то не получится. Поэтому опять выполняем п.1 с нужным вариативным товаром и публикуем нужную вариацию в виде простого, но СКРЫТОГО товара. Затем легко добавляем его в группировку, как в п.2.
 +
 +
 +==== Как удалить похожие товары в woocommerce ====
 +Возможность отключать похожие товары, следует применять для магазина который просто продает свой товар, и у которых нет связанных похожих товаров.
 +Для отключения добавьте в конец файла function.php вашей темы:
 +<file php>
 +remove_action('woocommerce_after_single_product_summary', 'woocommerce_output_related_products', 20);
 +</file>
 +
 +==== Как заменить слово "Распродажа" Акция в woocommerce ====
 +
 +Для замены этого слова нужно использовать хук woocommerce_sale_flash.
 +
 +<file php>
 +add_filter('woocommerce_sale_flash', 'my_custom_sale_flash');
 +function my_custom_sale_flash() {
 +return '<span class="onsale">Акция!</span>';
 +}
 +</file>
 +Код для мультиязычного сайта на плагине Polylang:
 +<file bash>
 +add_filter('woocommerce_sale_flash', 'my_custom_sale_flash', 10, 3);
 +function my_custom_sale_flash($text, $post, $product) {
 +    if (function_exists('pll_current_language')) {
 +        $current_lang = pll_current_language();
 +        
 +        $translations = array(
 +            'ru' => 'Акция!',
 +            'en' => 'Sale!',
 +            'uk' => 'Розпродаж!'
 +            // Добавьте другие языки по необходимости
 +        );
 +        
 +        if (isset($translations[$current_lang])) {
 +            return '<span class="onsale">' . $translations[$current_lang] . '</span>';
 +        }
 +    }
 +    
 +    // Если Polylang не активен или нет перевода для текущего языка,
 +    // возвращаем оригинальный текст без изменений
 +    return $text;
 +}
 +</file>
 +
 +Для изменения стиля надписи, добавим в файл style.css дочерней темы Storefront
 +<file css>
 +span.onsale {
 +padding: 3px 7px;
 +background: #7b1616;
 +color: white;
 +font-size: 13px;
 +}
 +</file>
 +==== Как переименовать в woocommerce кнопку "В корзину" на "Купить" ====
 +Если вы хотите изменить стандартные названия кнопок в WooCommerce, вам надо добавить несколько строк кода в файл functions.php. Вы можете добавить этот код в файл functions.php дочерней темы. Альтернативный вариант переименования кнопок - это использования плагина [[https://wordpress.org/plugins/woocommerce-jetpack/|Booster WooCommerce]].
 +<file php>
 +<?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' );
 +}
 +</file>
 +
 +==== woocommerce убрать доставка по другому адресу ====
 +Скрыть можно так: Настройки - Доставка - Назначение доставки - По умолчанию на адрес оплаты или  Принудительная доставка по платёжному адресу клиента.
 +
 +Удалить с помощью кода:<file php>
 +add_filter( 'woocommerce_cart_needs_shipping_address', '__return_false');
 +</file>
 +
 +
 +==== Remove image zoon on WooCommerce. woocommerce отключить лупу ====
 +
 +Отключить woocommerce-product-gallery__trigger. По умолчанию увеличение изображения включено для продуктов в магазине WooCommerce. Но я не хочу масштабировать изображение. Для отключения лайтбокса и кнопки "Лупа" используйте код:
 +<file php>
 +// Удаляет лупу для увеличения картинок
 +function remove_product_zoom_support() {
 +    remove_theme_support( 'wc-product-gallery-zoom' );
 +}
 +add_action( 'wp', 'remove_product_zoom_support', 100 );
 +</file>
 +==== Удалить ссылку на изображение продукта WooCommerce ====
 +
 +WooCommerce автоматически помещает основное изображение продукта в тег <a>. Решение найдено у [[https://www.intelliwolf.com/remove-woocommerce-product-image-link/|Mike Haydon]] подробнее смотрите на его странице.
 +
 +Чтобы удалить ссылку вокруг изображения продукта WooCommerce, добавьте следующий код в свой файл function.php. При этом берется необработанный HTML и удаляется все, кроме div и изображения.
 +<file php>
 +add_filter( 'woocommerce_single_product_image_thumbnail_html', 'custom_remove_product_link' );
 +function custom_remove_product_link( $html ) {
 +  return strip_tags( $html, '<div><img>' );
 +}
 +</file>
 + 
 +
 +
 +===== Расширение и плагины для WooCommerce =====
 +  * Saphali Woocommerce Russian – Набор Русских дополнений для магазина WooCommerce! В общий список валют будут добавлены: Украинская гривна, Российский рубль, Белорусский рубль, Армянский драм, Киргизский сом, Казахстанский тенге, Узбекский сум.
 +
 +
 +  * [[https://vc.ru/marketing/70193-2-sposoba-redaktirvoaniya-poley-oformleniya-zakaza-v-woocommerce|2 способа редактирвоания полей оформления заказа в WooCommerce]]
 +  * [[https://wordpress.org/plugins/woocommerce-delivery-notes/|WooCommerce Print Invoice & Delivery Note]] Заметки о доставке.
 +  * [[https://wordpress.org/plugins/woocommerce-pdf-invoices-packing-slips/|WooCommerce PDF Invoices & Packing Slips]] PDF-накладные и описи заказов.
 +  * [[https://wordpress.org/plugins/affiliates-woocommerce-light/|Affiliates WooCommerce Light]] Интеграция партнёрской программы Light
 +
 +  * [[https://wordpress.org/plugins/woocommerce-jetpack/|Booster for WooCommerce]] умеет изменять цены и валюты. Ценовые и кнопочные этикетки. Добавить пользовательские данные на странице корзины.
 +
 +
 +
 +===== WooCommerce импорт экспорт товаров из CSV, XML прайсов при помощи плагина WP All Import =====
 +  - [[Импорт товаров xml yml csv в woocommerce]] и другие плагины
 +  - [[Настройка WooCommerce для использования с Google Merchant Shopping]] выгрузка фида, микроразметка
 +===== Google аналитика и WooCommerce =====
 +[[https://wordpress.org/plugins/woocommerce-google-analytics-integration/|WooCommerce Google Analytics Integration]] - для подключения Google Аналитика. Бесплатный. После установки плагина, появляется вкладка "Интеграция": WooCommerce-> Настройки-> Интеграция. Где нужно вставить Google Analytics ID.
 +
 +<note tip>В настройках Google Analytics обязательно включите расширенную электронную торговлю и ремаркетинг.</note>
 +
 +Для корректной работы плагина необходимо внести следующие настройки:
 +  - Google Analytics ID: сюда вставляем ваш ID, полученный на этапе настройки Google Analytics
 +  - Enable Standard Tracking: включаем
 +  - Enable Universal Analytics: отмечаем
 +  - Purchase Transactions: отмечаем
 +  - Add to Cart Events: отмечаем
 +  - Enable Enhanced eCommerce: отмечаем
 +
 +Остальные пункты можно оставить без изменений.
 +<note important>Плагин GoogleTag Assistant не видит кода Google аналитика на сайте, но все работает!</note>
 +
 +
 +===== Купоны в WooCommerce =====
 +Плагин [[https://wordpress.org/plugins/woocommerce-auto-added-coupons/|WooCommerce Extended Coupon Features]] расширяет возможности настроек купонов. После активации плагина добавятся новые настройки WooCommerce->Купоны.
 +
 +===== Как скрыть товары на странице категории в WooCommerce =====
 +Эта задача актуальна, если у вас настроено отображение не категорий/производителей, а сразу всей продукции магазина. Хак находим на официальном сайте с документацией Вукоммерс.
 +<file php>
 +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' );
 +</file>
 +Важно! Тут вместо «clothing» опять же подставляете свой slug, причем если вам нужно исключить несколько рубрик, то в сниппете, указанном выше, сроку с параметром ‘terms’ надо заменить на следующую (не забудьте запятую в конце):
 +
 +<file php>
 +'terms' => array( 'chaj','hyson' ),
 +</file>
 +==== Оформление страницы заказа плагин WooCommerce Flexible Checkout Fields ====
 +
 +{{ ::flexible_checkout_fields_for_woocommerce.jpg?nolink |}}
 +
 +  * [[https://wordpress.org/plugins/flexible-checkout-fields/|Flexible Checkout Fields for WooCommerce
 +By WP Desk]]
 +
 +После установки и активации плагина перейдите на страницу: Woocommerce —> Checkout Fields. Здесь вы можете редактировать поля, которые отображаются на странице оформления заказа.
 +
 +Каждое виджет поля имеет много настроек. Чтобы изменить их откройте нужный вам виджет.
 +На вкладке General:
 +  * Enable Field, включить или отключить поле.
 +  * Required Field, сделать поле обязательным или нет.
 +  * Label, указать название поля.
 +
 +На вкладке Appearance:
 +  * Placeholder, можно указать текст внутри поля по умолчанию.
 +  * CSS Class, указать стиль и класс поля.
 +  * Сохраните изменения.
 +
 +Можно добавить новое поле. Слева в блоке Add New Field, выберите тип поля, укажите название поля и нажмите на кнопку Add Field. Справа у вас появится новый виджет поля. Сохраните настройки.
 +
 +===== Как вывести текстовую надпись вместо цены в Woocommerce, если цена 0 =====
 +
 +Если цена в Woocommerce не задана или равна 0, вы можете использовать хук woocommerce_get_price_html, например
 +
 +<file php>
 +add_filter( 'woocommerce_get_price_html', 'product_price_free_zero_empty', 100, 2 );
 +
 +function product_price_free_zero_empty( $price, $product ){
 +if ( '' === $product->get_price() || 0 == $product->get_price() ) {
 +    $price = '<span class="woocommerce-Price-amount amount">Цену уточняйте</span>';
 +}
 +return $price;
 +}
 +</file>
  

📌 Удобный подбор VPS по параметрам доступен на DIEGfinder.com - официальном инструменте проекта DIEG. Это часть единой экосистемы, созданной для того, чтобы помочь быстро найти подходящий VPS/VDS сервер для любых задач хостинга.

📌 Для тестирования скриптов, установщиков VPN и Python-ботов рекомендуем использовать надежные VPS на короткий срок. Подробнее о быстрой аренде VPS для экспериментов - читайте здесь.

💥 Подпишись в Телеграм 💥 и задай вопрос по сайтам и хостингам бесплатно!