Как искать в категории в WooCommerce

Хотите знать, как искать по категориям в WooCommerce?

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

В этой статье мы покажем вам 2 способа включить поиск по категориям в WooCommerce.

Вот оглавление, которое поможет вам ориентироваться:

• Как создать форму поиска, ограниченную определенной категорией
• Как создать форму поиска по категориям

Зачем искать по категориям в WooCommerce

По умолчанию в результатах поиска WooCommerce отображаются товары из всех существующих категорий.

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

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

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

Если посетители вашего интернет-магазина не смогут найти товар, за которым они пришли, они, скорее всего, сразу же уйдут.

Это не только влияет на ваш доход, но и увеличивает показатель отказов вашего сайта.

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

Есть 2 способа позволить вашим посетителям искать по категориям WooCommerce.

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

Разберем каждый из них по порядку.

Способ 1: создание формы поиска, ограниченной определенной категорией

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

Это лучший поисковый плагин WordPress, которому доверяют более 30 000 веб-сайтов по всему миру.

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

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

Кроме того, SearchWP имеет бесшовную интеграцию с WooCommerce и автоматически интегрируется с любыми существующими панелями поиска на вашем сайте.

SearchWP также может повысить ваш поиск в WordPress за счет:

• Индексирование документов PDF и Office . По умолчанию WordPress не индексирует текст в документах, которые есть на вашем сайте. SearchWP позволяет включать PDF и офисные документы в результаты поиска всего за несколько кликов.
• Составление ключевых слов . Собственная поисковая система WordPress не понимает, что разные варианты ключевых слов, такие как «шляпа» и «шляпы», по сути относятся к одному и тому же продукту. Используя SearchWP, вы можете включить определение корней ключевых слов и решить эту проблему.
• Отслеживание поиска . Вам когда-нибудь было интересно, что посетители ищут на вашем сайте? SearchWP позволяет собирать все данные о поисковой активности на сайте. Используя эту ценную информацию, вы сможете лучше понять потребности своих клиентов.

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

Шаг 1: Установите и активируйте SearchWP

Первый шаг — получить вашу копию SearchWP здесь.

Затем перейдите в свою учетную запись SearchWP и откройте вкладку « Загрузки ».

Оказавшись там, нажмите кнопку « Загрузить SearchWP» и сохраните плагин на свой компьютер.

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

Следующим шагом будет загрузка ZIP-файла плагина SearchWP на ваш сайт WordPress.

Нужно освежить в памяти, как это сделать? Ознакомьтесь с этим пошаговым руководством по установке плагина WordPress.

После того, как вы установили SearchWP, нажмите кнопку SearchWP , которая появляется на верхней панели панели инструментов WordPress.

Затем перейдите на вкладку « Лицензия ».

Вставьте лицензионный ключ плагина в соответствующее поле и нажмите « Активировать» .

Поздравляем. Вы успешно активировали свою копию SearchWP и готовы перейти к следующему шагу.

Шаг 2. Загрузите и установите расширение интеграции WooCommerce.

Следующим шагом будет установка расширения интеграции WooCommerce.

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

Вы можете получить его на странице загрузки расширения WooCommerce Integration.

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

Когда загрузка будет завершена, просто установите и активируйте его так же, как SearchWP.

Шаг 3: Создайте новую поисковую систему

Следующим шагом будет создание новой поисковой системы. Для этого перейдите на вкладку Engines в настройках SearchWP.

Здесь вы увидите список имеющихся у вас поисковых систем, сможете настроить их и добавить новые.

Вы можете думать о поисковой системе как о наборе правил, которым WordPress следует при выполнении поиска. Редактируя их, вы можете полностью настроить работу поиска на своем сайте.

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

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

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

Для этого нажмите кнопку « Добавить новый ».

После этого появится Дополнительный поисковик.

Как видите, в нашем случае у него 5 источников поиска: посты, страницы, медиа, товары и пользователи.

Количество источников может зависеть от количества установленных на вашем сайте плагинов.

Например, источники « Продукты » и « Пользователи » были добавлены автоматически, так как у нас установлен плагин WooCommerce.

Поскольку мы хотим, чтобы эта поисковая система выполняла поиск исключительно среди продуктов WooCommerce, мы удалим все другие источники, кроме продуктов .

Для этого нажмите « Источники и настройки » в правом верхнем углу.

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

Допустим, мы хотим создать поисковую систему для категории товаров «Шляпы», поэтому назовем ее Шапки .

Когда вы закончите, нажмите Готово .

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

Для этого нажмите « Редактировать правила» .

Затем нажмите «Добавить правило» .

Выберите таксономию категорий товаров из выпадающего списка.

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

В нашем случае мы выберем категорию «Шляпы». Когда вы закончите, нажмите Готово .

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

Вот и все. Вы успешно создали новую поисковую систему, которая выполняет поиск только по категории продуктов Hats WooCommerce.

Шаг 4: Загрузите и установите расширение Shortcodes

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

Вы можете получить его на странице загрузки расширения Shortcodes.

Как только вы доберетесь туда, нажмите кнопку « Загрузить расширение» .

Затем установите и активируйте расширение так же, как и SearchWP.

Шаг 5: Создайте новую страницу формы поиска

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

Для этого нажмите « Добавить новую » в разделе « Страницы » на панели управления WordPress.

Затем дайте название своей странице и нажмите « Плюс », чтобы добавить к ней новый блок.

Найдите блок Custom HTML и нажмите на него.

Затем скопируйте приведенный ниже код и вставьте его в только что добавленный блок пользовательского HTML:

[searchwp_search_form engine="hats" var="searchvar" button_text="Find Results"]
  
<div class="search-results-wrapper">
 [searchwp_search_results engine="hats" var="searchvar" posts_per_page=4]
  <h2>[searchwp_search_result_link direct="true"]</h2>
  [searchwp_search_result_excerpt]
 [/searchwp_search_results]
</div>
  
<div class="no-search-results-found">
 [searchwp_search_results_none]
 No results found, please search again.
 [/searchwp_search_results_none]
</div>
  
<div class="search-results-pagination">
 [searchwp_search_results_pagination direction="prev" link_text="Previous" var="searchvar" engine="hats"]
 [searchwp_search_results_pagination direction="next" link_text="Next" var="searchvar" engine="hats"]
</div>

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

Этот код выводит форму поиска, связанную с поисковой системой Hats . Это означает, что он ищет исключительно по категории «Шляпы» WooCommerce.

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

Затем нажмите « Просмотр страницы », так как на следующем шаге мы будем тестировать наше новое окно поиска.

Шаг 6. Проверьте свой новый поиск

Мы создали 2 продукта для тестирования нового окна поиска: красную шапку и красную футболку. Оба они отнесены к соответствующим категориям.

Давайте посмотрим, что произойдет, если мы введем «красный» поисковый запрос в форму поиска.

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

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

Способ 2: создание формы поиска по категориям

Но что, если вы хотите, чтобы ваши посетители сами выбирали, в какой категории они хотят искать? Лучший способ сделать это — добавить форму поиска по категориям.

Шаг 1: Установите и активируйте SearchWP

Первый шаг — установить и активировать плагин SearchWP. Если вы еще этого не сделали, вы можете получить свою копию SearchWP здесь.

Ранее в этой статье мы уже подробно описали, как установить SearchWP на свой веб-сайт, поэтому не стесняйтесь ознакомиться с этим руководством.

Шаг 2: Создайте дочернюю тему

После того, как вы установите и активируете SearchWP, следующим шагом будет создание дочерней темы текущей темы, которую вы используете на своем сайте.

Это очень важно, так как этот метод включает в себя внесение изменений в код вашей темы.

Дело в том, что когда вы редактируете код дочерней темы, изменения сохраняются отдельно от файлов родительской темы.

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

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

Вот почему важно иметь дочернюю тему, если вы собираетесь редактировать код темы WordPress.

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

Шаг 3: Внесите изменения в файл Functions.php

После того, как вы создали дочернюю тему, следующим шагом будет открытие файла functions.php.

Для этого перейдите в « Внешний вид» Редактор файлов темы на панели управления WordPress.

Затем на правой панели найдите файл functions.php и нажмите на него.

Открыв его, скопируйте и вставьте следующий код в самый низ файла:

function my_searchwp_get_search_form_with_categories_dropdown( $form ) {
    ob_start(); ?>
        <form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
            <label>
                <span class="screen-reader-text">Search For</span>
                <input type="search" class="search-field" placeholder="Search..." value="<?php echo esc_attr( get_search_query() ); ?>" name="s" title="Search for:" />
            </label>
            <?php
                // for more information see http://codex.wordpress.org/Function_Reference/wp_dropdown_categories
                $swp_cat_dropdown_args = array(
                        'show_option_all'  => __( 'Any Category' ),
                        'name'             => 'swp_category_limiter',
                    );
                wp_dropdown_categories( $swp_cat_dropdown_args );
            ?>
            <input type="submit" class="search-submit" value="Search" />
        </form>
    <?php return ob_get_clean();
}
 
add_filter( 'get_search_form', 'my_searchwp_get_search_form_with_categories_dropdown' );

Вот как это выглядит на нашем тестовом сайте:

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

После добавления кода не забудьте нажать кнопку « Обновить файл» внизу страницы, чтобы сохранить изменения.

После этого вы готовы перейти к последнему шагу и протестировать новый поиск.

Шаг 4. Проверьте свой новый поиск

Для этого нажмите кнопку « Посетить сайт » под названием вашего сайта в левом верхнем углу панели управления WordPress.

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

В этой статье вы узнали 2 метода создания формы поиска, которая выполняет поиск по категориям WooCommerce.

Если вы готовы создавать формы для конкретных категорий, вы можете скачать свою копию SearchWP здесь.

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

Не знаете, как добавить панель поиска на свой сайт? Тогда вам может быть интересно, как добавить панель поиска в WordPress с помощью учебника 4 разных способов.