WOOCOMMERCE — модификация и тонкая настройка. Тонкие настройки интернет-магазина

Вы знали, что 40% пользователей покидают сайты с плохим дизайном? Зачем терять прибыль? Выберите и установите один из лучших премиум шаблонов WordPress прямо сейчас!

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

WooCommerce – самое популярное решение для создания интернет-магазина, которое использует больше 28 миллионов eCommerce-площадок. Среди них известный производитель обуви и одежды New Balance и певица Taylor Swift .

Эта платформа выигрывает у других аналогичных решений не только по доле на рынке (41% у WooCommerce против 6% у Shopify и 4% у Magento), но и по многим другим параметрам, в том числе по простоте разработки сайта, управлению магазином, функционалу, безопасности и так далее. Подробнее сравнение WooCommerce с другими платформами можно прочесть и .

YITH WooCommerce самые лучшие плагины – Почему WooCommerce и YITH?

YITH – относительно молодая команда разработчиков, которая создает шаблоны и плагины специально для сайтов на WooCommerce. На ней размещено больше 26 тем с уникальным дизайном и чуть более 180 плагинов для магазинов. Плагины на сайте разбиты по категориям: администрирование, работа с клиентами, дизайн и навигация, страницы товаров, продвижение и маркетинг и другие. На сегодняшний день это лучшая площадка с самыми продвинутыми плагинами для интернет-магазина. Цены здесь относительно высокие, но, поверьте, эти плагины того стоят. Деньги, потраченные на их покупку, сполна окупятся теми преимуществами, которые они предоставляют. Правильно внедрив качественную стратегию продвижения, вы сможете довольно быстро отбить вложенную в покупку плагина сумму и продолжать зарабатывать в десятки и сотни раз больше. А от бесплатных плагинов только одна нервотрепка. Они могут глючить, иметь вредоносный код и поставить под угрозу не только безопасность данных ваших покупателей, но и безопасность всего магазина. Когда дело касается платежей, это особенно важно.

YITH WooCommerce – Подборка лучших плагинов от команды InBenefit

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

УПРАВЛЕНИЕ МАГАЗИНОМ

1. YITH WooCommerce Bulk Product Editing (стоимость – 79$)

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

– Редактирование любых полей товара.
– Добавление новых полей.
– Возможность редактирования текста для группы товаров.
– Групповое изменение цен (в процентном или числовом выражении).
– Простая и четкая фильтрация товаров для редактирования.
– Возможность добавления товаров.
– Быстрое удаление группы товаров.
– Импорт и экспорт данных из XML-файлов.
– Возможность перевода на русский.

Хватит мучиться и тратить лишнее время на тривиальные задачи – выберите плагин Bulk Product Editing, чтобы сделать администрирование своего магазина существенно проще.

ДИЗАЙН И НАВИГАЦИЯ

1. YITH WooCommerce Ajax Search (стоимость – 65$)

С этим плагином вашим покупателям будут предоставлены самые современные возможности поиска товаров. Находить любимые товары гораздо удобнее, если результаты сразу же отображаются в поисковой строке. Именно этого и позволяет добиться технология AJAX и плагин поиска товаров от команды YITH.

– Превью фото товара и выбор его расположения, отображение полной цены/цены со скидкой и отображение краткого описания непосредственно в результатах поиска.
– Поддержка значков «Распродажа» в результатах поиска для привлечения внимания.
– Расширенный поиск по тегам, коду товара и категориям для удобства покупателя.
– Возможность поиска по продавцам (при использовании с плагином Multi Vendor – о нем расскажем ниже).
– Два макета поисковой формы.
– Поддержка русского языка.

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

1. YITH WooCommerce Ajax Product Filter Premium (стоимость – 69$)

Вы знали о том, что 75% покупателей покидают сайт, если не могут найти то, что им нужно в течение 15 секунд? Цель этого плагина аналогична цели предыдущего – упростить и ускорить поиск нужных товаров. Чем удобнее и быстрее работает система фильтрации и поиска, тем больше вероятность покупки именно в вашем магазине. Позаботьтесь о том, чтобы ваши потенциальные покупатели не ушли с вашего сайта – в этом вам помогут возможности плагина Ajax Product Filter.

– Различные макеты и виджеты для оформления.
– Настройка параметров ценового фильтра в админ-панели.
– Настройка SEO-параметров URL-страниц.
– Фильтрация товаров по цене, категории и производителю (с плагином WooCommerce Brands Add-On).
– Сортировка товаров по алфавиту или количеству товаров в категории.
– Возможность отображения исключительно товаров «Есть в наличии» и/или «На складе».
– Возможность быстрого заказа товара на странице результатов поиска без перехода на отдельную страницу (технология AJAX).

Покупатели уже настолько привыкли к фильтрации товаров в магазинах, что эту функцию просто нельзя не добавить в свой магазин. Повысьте конверсию, установив плагин Ajax Product Filter прямо сейчас!

1. YITH WooCommerce Quick View (стоимость – 59$)

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

– Выбор информации, которая будет отображаться в режиме быстрого просмотра.
– Два варианта перехода в режим быстрого просмотра: кнопка рядом с «Добавить в корзину» или ссылка, встроенная в фото товара.
– Выбор иконки или текста с надписью «Быстрый просмотр».
– Возможность перехода к следующему товару в режиме быстрого просмотра.
– Переключение фотографий товара с эффектом слайдера.

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

– Неограниченное количество вишлистов.
– Скрытые или открытые вишлисты.
– Возможность поиска вишлистов других покупателей.
– Перенос товаров из одного вишлиста в другой.
– Возможность прямого добавления товаров из вишлиста в корзину.
– Ограничение возможностей вишлиста для незарегистрированных пользователей с предложением зарегистрироваться, чтобы получить полный доступ к функциям вишлиста (позволяет расширить клиентскую базу).
– Анализ статистики популярности товаров в вишлистах с возможностью проведения акций для самых популярных из них.

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

– Поддержка большого количества опций.
– Возможность создания групп опций и настройка их поддержки всеми товарами, конкретными категориями и конкретными товарами.
– Отображение опций только для тех, кто выбрал соответствующий «флажок».
– Отображение всплывающих подсказок для опций и атрибутов.
– Варианты опций: цвет, текст и изображение.
– Изменение фото товара в зависимости от выбранной опции.
– Отображение различных вариантов опций в каталоге.
– Поддержка обязательных к заполнению опций для добавления товара в корзину.
– Предложение дополнительных услуг (доставка, страховка и так далее).

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

– Автоматический выбор системой доступной даты доставки и возможность изменения даты вручную.
– Возможность выбора временного промежутка для доставки.
– Отслеживание товара.
– Настройка максимального количества заказов за один временной промежуток (для администратора).
– Изменение стоимости доставки для различных дней и времени.
– Связь с графиком работы служб доставки.

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

Перед началом чтения убедитесь в том, что:

1. У вас установлены WordPress и WooCommerce на сайте.
2. Вы знаете, как создавать темы для WordPress и умеете работать с HTML и CSS.
3. Вы знаете, как работать со средствами разработки Chrome Developer Tools и с такими инструментами, как Firebug.

Настройка WooCommerce CSS

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

Поэтому у нас есть 2 пути для редактирования CSS в теме оформления WooCommerce:

1. Можно использовать базовые стили и переписать их поверх существующих.
2. Можно отключить стили по умолчанию и вместо них начать с нуля.

Помните, что WooCommerce добавляет класс "woocommerce " ко всем своим страницам.

Отключаем стили по умолчанию

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

Скопируйте содержимое всего файла WooCommerce CSS, он расположен по адресу:

wp-content\plugins\woocommerce\assets\css\woocommerce.css или woocommerce.less

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

1. Найдите на сайте все стили, которые надо заменить.
2. Затем используйте Chrome Developer Tools (или аналогичный инструментарий) для идентификации классов и внесения правок в браузере, чтобы сразу видеть, что и как будет выглядеть после редактирования. Сделать это можно правым кликом на странице и выбрав инспектирование элементов в выпадающем меню.
3. Скопируйте полученный код CSS из Chrome Developer Tools в файл вашей темы с таблицей стилей.
4. Не забудьте сменить значения переменных, чтобы сохранить целостность таблицы стилей и связь стилей и контента для разных браузеров.
5. Если вы найдете что-то, что не меняется в кастомизированном файле, то можете удалить это значение: если оно не меняется, нет смысла включать его в кастомный файл CSS.

Такой подход хорошо экономит вам время.

В Google Chrome можно кликнуть правой кнопкой мыши на элементе в режиме окна Developer Tools для проверки разных состояний элемента. Так вы увидите все состояния элементов без необходимости выискивать их в файле таблицы стилей.

Отключаем родную таблицу стилей и начинаем с нуля

Отключить таблицу стилей, предлагаемую по умолчанию, можно добавлением короткой строки в файле functions.php :

Define("WOOCOMMERCE_USE_CSS", false);

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

Включаем поддержку WooCommerce в своей теме

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

Если не указать поддержку WooCommerce в вашей теме, пользователи будут сталкиваться с ошибкой при установке на WooCommerce. К счастью, решить эту проблему поможет маленький фрагмент кода, добавленный в файл functions.php :

Add_theme_support("woocommerce");

Редактируем шаблоны

Редактирование CSS в WooCommerce может отнять немало времени. Но есть способ сделать эту рутинную долгую работу не такой скучной.

Плагин WooCommerce поставляется с набором шаблонов front-end на HTML, равно как с набором шаблонов для писем. Вместо прямого редактирования всех этих файлов в плагине (не очень хорошая идея, потому что любое обновление плагина приведет к тому, что все ваши изменения будут удалены), вы можете скопировать их в свою настраиваемую тему:

1. В папке с темой создаем вложенную папку с названием "woocommerce ".
2. Переходим в папку с плагином WooCommerce и открываем папку "templates ". Здесь много вложенных папок, в которых хранятся шаблоны, используемые в WooCommerce. К счастью, структура здесь сравнительно простая и визуально понятная.
3. В новой папке "woocommerce " поместим все файлы шаблонов, скопированные из первоисточника, которые мы хотим отредактировать. Не забудьте сохранить ту же структуру папок, что и в первоисточнике. Не забудьте переименовать связанные папки, если вносите в названиях какие-то изменения.
4. После редактирования всех необходимых файлов и папок сохраняем изменения в папке "woocommerce ".

Практический пример

К примеру, нам надо поменять код в разделе с заказанными товарами в WooCommerce.

Для начала определим нужный нам шаблон. Секция "My Orders " находится в "My Account ". Структура пути к файлу выглядит так:

/wp-content/plugins/woocommerce/templates/myaccount/my-orders.php

Делаем вложенную папку "woocommerce ", а в ней - вторую вложенную с названием "myaccount ". Копируем туда файл my-orders.php .

У вас должен получиться путь:

/wp-content/themes/вашатема/woocommerce/myaccount/my-orders.php

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

WooCommerce и циклы

Если вы ранее создавали или редактировали темы для WordPress, тогда вам знакомо понятие цикл (The Loop). У WooCommerce есть свои циклы для настроек своих внутренних страниц. Например, вы можете их применять, если надо вывести другую боковую панель для страниц WooCommerce.

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

Создание шаблона происходит в несколько шагов:

• Делаем дубликат файла темы page.php и переименовываем его в woocommerce.php
• Находим цикл WordPress в файле woocommerce.php . Он выглядит примерно так:
• Заменяем ваш цикл на цикл WooCommerce:
• Теперь можно делать любые желаемые изменения.

Заключение

Теперь вы знаете основы работы с подключением и настройкой тем для торговой платформы WooCommerce на WordPress.

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

Рассмотрим тонкую настройку компонента интернет-магазина WooCommerce без внесения изменений в ядро . Описанные здесь модификации безопасны и валидны . При обновлении WordPress и WooCommerce никакие модификации не будут утрачены.

Добавление валюты «Российский рубль» в магазин на WooCommerce.

Эта модификация добавит рубль в ваш магазин на WooCommerce. Вы можете установить плагин Saphali Lite и рубль будет добавлен автоматически в комплекте с плагином.

Откройте файл функции темы (для вашей активной темы оформления WordPress). Для этого в админ. панели перейдите в меню «Внешний вид» --> «Редактор» --> «Функции темы» — файл functions.php . Добавьте указанный код в конец файла и сохраните:

Add_filter("woocommerce_currencies", "add_my_currency"); function add_my_currency($currencies) { $currencies["ABC"] = __("Российский рубль", "woocommerce"); return $currencies; } add_filter("woocommerce_currency_symbol", "add_my_currency_symbol", 10, 2); function add_my_currency_symbol($currency_symbol, $currency) { switch($currency) { case "ABC": $currency_symbol = "руб"; break; } return $currency_symbol; }

Изменение количества товаров на одной странице магазина WooCommerce.

Я рекомендую использовать плагин WooCommerce Customizer — он позволит настроить число продуктов на страницу, число колонок с продуктами на странице магазина.

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

Add_filter("loop_shop_per_page", create_function("$cols", "return 30;"));

Количество товара в колонке Вашего магазина.

Можете изменить на нужное Вам значение (в коде цифра 35). Код добавляем как обычно в functions.php:

Add_filter("loop_shop_columns", "loop_columns"); if (!function_exists("loop_columns")) { function loop_columns() { return 35; } }

Изменяет количество up-sells товаров.

Up-sells — это товары или продукты, которые вы рекомендуете вместо просматриваемых клиентом товаров Пример: более выгодные и недорогие либо более качественные и функциональные, но дорогие варианты.

Цифры в коде означают число колонок и число товара в колонках. Добавьте код в функции темы как обычно:

Remove_action("woocommerce_after_single_product", "woocommerce_upsell_display"); add_action("woocommerce_after_single_product", "woocommerce_output_upsells", 20); if (!function_exists("woocommerce_output_upsells")) { function woocommerce_output_upsells() { woocommerce_upsell_display(4,4); // Показать 4 товара в 4 колонки } }

Изменяем количество сопутствующих товаров.

Сопутствующие товары отображаются в карточке товара внизу страницы под основным товаром . По умолчанию отображается 2 сопутствующих товара. Изменим число сопутствующих товаров. Цифры задают число товаров и число колонок. Код вносим в файл functions.php:

Function woocommerce_output_related_products() { woocommerce_related_products(4,4); // Показать 4 товара а 4 колонки }

Изменение полей оформления заказа в WooCommerce.

Я рекомендую изменять набор полей для оформления заказа с помощью плагина Saphali Lite. Но это можно сделать с помощью правки функций темы. Ниже пример кода, который удалит указанные поля:

Add_filter("woocommerce_checkout_fields" , "custom_override_checkout_fields"); function custom_override_checkout_fields($fields) { /*Убрали ненужные поля*/ unset($fields["billing"]["billing_company"]); unset($fields["billing"]["billing_country"]); unset($fields["billing"]["billing_address_2"]); unset($fields["billing"]["billing_state"]); return $fields; } add_filter("woocommerce_billing_fields", "custom_woocommerce_billing_fields"); function custom_woocommerce_billing_fields($fields) { $fields["billing_address_1"]["class"] = array("form-row-wide"); /*Поле адреса шире*/ return $fields; }

Скрыть отображение количества товаров в категории.

В functions.php темы оформления нужно добавить такой код:

Add_filter("woocommerce_subcategory_count_html", "jk_hide_category_count"); function jk_hide_category_count() { }

Изменяем обертки (wrapper) для нашего шаблона на страницах интернет-магазина.

В принципе для WooCommerce-совместимых шаблонов это не требуется. Если хотите проэкспериментировать, код такой:

Remove_action("woocommerce_before_main_content", "woocommerce_output_content_wrapper", 10); // Убрали remove_action("woocommerce_after_main_content", "woocommerce_output_content_wrapper_end", 10); add_action("woocommerce_before_main_content", create_function("", "echo "

Убираем кнопку «В корзину» на основной витрине магазина.

Код как обычно добавляем в функции темы:

Remove_action("woocommerce_after_shop_loop_item", "woocommerce_template_loop_add_to_cart", 10);

Меняем местами краткое описание товара и цену.

Если Вы хотите поменять местами краткое описание и цену, добавьте такой код в functions.php:

Remove_action("woocommerce_single_product_summary", "woocommerce_template_single_price", 10); remove_action("woocommerce_single_product_summary", "woocommerce_template_single_excerpt", 20); add_action("woocommerce_single_product_summary", "woocommerce_template_single_price", 20); add_action("woocommerce_single_product_summary", "woocommerce_template_single_excerpt", 10); function HB_woocommerce_template_dimensions(){ //Добавим функцию вызова панельки с размерами и весом global $woocommerce, $post, $product; $product->list_attributes(); } add_action("woocommerce_single_product_summary", "HB_woocommerce_template_dimensions", 15); //Поставим панельку после краткого описания

Убираем хлебные крошки на страницах магазина WooCommerce и на странице карточки товара.

Если Вам не нравятся стандартные хлебные крошки WooCommerce или вместо них у Вас есть специальный плагин, выводящий Breadcrumbs, то добавться в functions.php такой код:

Remove_action("woocommerce_before_main_content", "woocommerce_breadcrumb", 20, 0);

Убираем вкладку «Дополнительное описание» товаров в магазине WooCommerce:

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

Remove_action("woocommerce_product_tabs", "woocommerce_product_attributes_tab", 20); remove_action("woocommerce_product_tab_panels", "woocommerce_product_attributes_panel", 20);

Перенаправление (редирект) клиента после авторизации в магазине на нужную Вам страницу.

Чтобы после входа в личный кабинет клиент переходил на ту страницу, которую Вы хотите задать (адрес страницы в коде /checkout замените на нужный), добавьте такой код в функции темы:

Add_filter("woocommerce_login_widget_redirect", "custom_login_redirect"); function custom_login_redirect($redirect_to) { $redirect_to = "/checkout"; }

Меняем местами постраничную навигацию и сортировку.

Поменяем местами постраничную навигацию (список страниц внизу) и блок сортировки (вверху — по убыванию/возрастанию цены и т.д.). Код такой:

Remove_action("woocommerce_pagination", "woocommerce_pagination", 10); remove_action("woocommerce_pagination", "woocommerce_catalog_ordering", 20); function pre_woocommerce_pagination(){ //Добавим текст перед списком echo "Сортировка: "; } add_action("woocommerce_pagination", "pre_woocommerce_pagination", 5); add_action("woocommerce_pagination", "woocommerce_catalog_ordering", 10); add_action("woocommerce_pagination", "woocommerce_pagination", 20);

Добавляем навигацию и сортировку в начало страницы.

Код вносим как всегда в functions.php:

Add_action("woocommerce_before_shop_loop", "pre_woocommerce_pagination", 1); add_action("woocommerce_before_shop_loop", "woocommerce_catalog_ordering", 2); add_action("woocommerce_before_shop_loop", "woocommerce_pagination", 3);

Делаем поля в форме заказа WooCommerce необязательными.

Ставим кнопки «Продолжить покупки» и «Оформить заказ» вниз страницы корзины WooCommerce.

Function cart_more_buttons() { echo " ← Продолжить покупкиОформить заказ →"; } add_action ("woocommerce_after_cart_totals", "cart_more_buttons", 5);

Добавляем конпку «Продолжить покупки» на страницу оформления заказа.

Function checkout_more_buttons() { echo " ← Продолжить покупки"; } add_action ("woocommerce_review_order_before_submit", "checkout_more_buttons", 5);

Мы рассмотрели основные параметры тонкой настройки магазина на WooCommerce с помощью валидного способа правки функций темы (файла functions.php).

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

Если магазин и сайт новые, предварительно настройте ЧПУ как написано .

WooCommerce – Настройки – Общие

Общие настройки:

Первым делом необходимо выставить основное местоположение вашей страны.

Определить страны, где предполагается вести продажи. По умолчанию установлено – Все.

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

Опции валюты:

Установите вашу валюту.

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

WooCommerce – Настройки – Товары

Вывод товаров:

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

Информация о продукте:

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

Размеры изображений товаров:

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

Кроме того стоит помнить, что размеры изображений часто регулируются еще и в настройках самой темы. Так например, для некоторых премиум тем в руководствах указано - какие размеры нужно выставить в этом разделе. После изменения размеров следует перегенерить миниатюры с помощью отличного плагина - Regenerate Thumbnails .

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

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

WooCommerce – Настройки – Оплата

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

Безналичными через банковский перевод, Чеками, Наличными, Банковскими картами через сервис Mijireh и PayPal.

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

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

Отображение платежей:

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

WooCommerce – Настройки – Доставка

По аналогии с предыдущим пунктом, тут вы можете при необходимости настроить требуемые методы доставки, если они вообще предусмотрены. Ненужные типы доставок отключаются в их настройках, в чекбоках вида – Активировать…

WooCommerce – Настройки – Аккаунты

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

WooCommerce – Настройки – Эл. Почта

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

WooCommerce – Состояние системы

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

Вот собственно и все. Самые необходимые начальные настройки сосредоточены в первых двух разделах. Остальное зависит от ваших личных требований и возлагаемых на функционал магазина задач.

Супер популярный плагин — WooCommerce предназначен для электронной коммерции и позволит вам продавать как электронные, так и физические товары в любых формах и размерах. Данный плагин очень гибкий, функциональный и подойдёт для любой темы wordpress, хотя рекомендуется использовать плагин с темой — . На данный момент плагин woocommerce установлен на более чем 30% всех онлайн магазинов в интернете. Если вы хотите создать свой онлайн-магазин, то данный плагин — это идеальный вариант, так как в нём есть абсолютно всё для создания и ведения своего онлайн-магазина. Особенности плагина:

Настройки плагина на Русском языке , всё просто и понятно!

Плагин WooCommerce абсолютно Бесплатный!

Понятный помощник установки и настройки плагина.

Видео-уроки по работе с плагином.

Настройка доставки товара , поддержка дропшиппинга.

Широкие опции оплаты, большинство банковских карт, PayPal, BACS (банковские переводы), наличные при доставке и т.д.

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

WooCommerce может быть интегрирован практически с любым сервисом!

Более 300 дополнительных расширений доступных для вас.

Широкие настройки, открытый исходный код, создавайте свой онлайн-магазин!

Установить плагин вы сможете прямо из админ-панели wordpress. Перейдите по вкладке: Плагины — Добавить новый , введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.

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

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

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

Далее, на странице Доставка и налоги , вы можете указать будете ли вы осуществлять в своём магазине доставку товаров и будете ли вы включать налоги в стоимость своих товаров. Если вы будете использовать данные функции, то поставьте галочки в соответствующих полях. Нажмите на кнопку — Продолжить .

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

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

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

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

Основные

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

— Торговая точка(и), здесь вы можете ограничить список стран, в которых вы собираетесь вести продажу. Выберите значение — Продавать только в определённых странах и укажите страны.

— Адрес клиента по умолчанию, данная функция определяет адрес клиентов по умолчанию, до ввода ими данных. Выберите — Геолокация для авто-определения.

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

— Валюта, выберите валюту для вашего магазина.

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

— Тысячный разделитель, можете указать здесь разделитель для тысяч. 1,000

— Десятичный разделитель, можно указать разделитель для десятитысячных цифр. 10.000

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

Товары

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

Отображение.

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

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

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

— Добавить в поведение корзины, лучший вариант по умолчанию, Ajax кнопки.

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

Сохраните сделанные изменения .

Запасы.

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

Загружаемые товары.

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

Налог

Параметры налогов.

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

Стандартные ставки.

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

Платежи

Параметры оформления заказов.

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

— Оформление заказа, можете позволить гостям, незарегистрированным пользователям, оформлять заказы.

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

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

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

— Сохраните изменения .

Безналичный перевод.

Здесь вы можете включить безналичный банковский перевод в вашем магазине. Можете настроить Заголовок, Описание и Инструкции, которые будут отображаться для клиентов. В деталях учётной записи вам нужно указать реквизиты банка. Если вы хотите добавить несколько банков, то нажмите на кнопку — Добавить аккаунт . В конце Сохраните изменения .

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

Наложенный платёж.

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

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

Доставка

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

Аккаунты

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

— Эндпоинты Моего аккаунта, можно оставить без изменений.

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

— Создание аккаунта, можно включить или отключить автоматическое создание имени пользователя из email адреса, и создание пароля.

— Сохраните изменения .

Email

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

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

API

Можно включить REST API — вспомогательная функция для разработчиков приложений и для тех кто хочет внедрить в WooCommerce какое-либо приложение.

Заказы

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

Купоны

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

На странице создания купона вам нужно указать — Код купона (любой номер), Описание купона (необязательно), величину купона (размер скидки), а так же настроить остальные параметры купона, которые указаны на странице. После заполнения данных, нажмите на кнопку — Опубликовать .

Отчёты

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

Состояние системы

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

— Инструменты, здесь вы можете воспользоваться инструментами по очистке данных.

— Журналы, лог файл, где отображаются данные по работе плагина.

Аддоны

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

Товары

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

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

— Название товара.

— Можете добавить категорию для товара.

Так же вам необходимо указать:

— Данные товара, цена, цена со скидкой (если хотите), артикул (номер товара), дополнительные данные.

— Изображение товара .

— Краткое описание товара .

— Изображения для галереи товара, дополнительные фото, которые отображаются на странице товара.

После создания товара, на странице Магазин будет отображаться созданный товар.

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

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

Так же для товаров можно создавать:

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

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

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

Страницы

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

Магазин

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

Корзина

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

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

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

Мой аккаунт

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

Виджеты и Сайдбары

Плагин WooCommerce добавит на ваш сайт 10 новых виджетов. Если вы используете Тему Storefront (предназначенную специально для WooCommerce), то в вашем распоряжении будет 6 сайдбаров, боковая колонка, сайдбар под заголовком сайта и 4 колонки в подвале сайта. Виджеты:

— WooCommerce Корзина, показывает корзину пользователя в боковой панели.

— WooCommerce Метки товаров, показывает метки товаров в формате облака.

— WooCommerce Навигационные фильтры, показывает навигационные фильтры слоёв.

— WooCommerce Навигация по слоям, показывает произвольный атрибут товаров.

— WooCommerce Недавно просмотренные, показывает список недавно просмотренных товаров.

— WooCommerce Поиск по Товарам, форма поиска только для товаров.

— WooCommerce Товары, показывает список товаров.

— WooCommerce Товары с высокими ценами, показывает список товаров с самыми высокими ценами.

— WooCommerce Фильтр по цене, показывает слайдер, который позволяет выбирать товары по диапазону цен.

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

Заключение

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

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

Плагины для Магазина WooCommerce.

— Супер эффектная фишка! Увеличительное стекло зум для изображений, подойдёт не только для изображений товаров в woocommerce, но и для обычных изображений в записях и на страницах wordpress сайта.

— Супер плагин! Звёздный рейтинг и продвинутая система отзывов для онлайн-магазина WooCommerce. Как на Лучших Онлайн-Магазинах!

— Платёжный шлюз сервиса PayPal профессионал позволит вам принимать платежи с кредитных карт ваших клиентов.

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

— Данный плагин поможет вам очень просто перенести свой онлайн магазин из PrestaShop в Woocommerce.

— Вы сможете добавить в свой онлайн магазин woocommerce стильный слайдер товаров.