Поиск и фильтр WordPress записей по произвольным полям

Опубликовано: 01.09.2018

Нередко на WordPress создают сайты в виде каталога товаров. И как правило, для больших каталогов требуется продвинутый фильтр товаров или поиск по произвольным полям - параметрам. Именно такой поиск и фильтр на WordPress нам пришлось разрабатывать. Посмотреть действующий пример можно в каталоге мобильных устройств . И вот как мы это сделали...

Услуга: Разработаем фильтр для Вашего сайта

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

от 4 900 рублей

Узнать точную стоимость

Принцип поиска и фильтра записей в WordPress

Дан был сайт, где товары (в данном случае мотоциклы) добавлялись в виде стандартных WordPress записей c произвольными полями. Для работы с произвольными полями был установлен плагин Types . Произвольные поля отвечали за дополнительные параметры товара, по которым в дальнейшем подразумевался фильтр и поиск.

Сustom fields - создаем поиск по произвольным полям

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

Форма поиска и фильтра WordPress товаров

Далее была доработана HTML форма поиска и фильтра WordPress записей. А именно, был создан файл moto_filtr_form.php и наполнен следующим кодом:

AJAX ФИЛЬТР НА WORDPRESS ПО ТЕРМИНАМ РАЗЛИЧНЫХ ТАКСОНОМИЙ

<form name="search" role="search" action="/" method="get"> <ul> <li><label>Цена</label><div class="input"><input placeholder="От:" class="price_input" type="text" name="price1" value="" /> <input placeholder="До:" class="price_input" type="text" name="price2" value="" /></div></li> <li><label>Модель</label><div class="input"><input type="text" name="s" value="" /></div></li> <li><label>Марка</label><div class="input"><select name="mark"> <option selected value="">Все марки</option> <?php $categories = get_categories(); if ($categories) { foreach ($categories as $category) { $option = '<option value="'.$category->category_nicename.'">'; $option .= $category->cat_name; $option .= ' ('.$category->category_count.')'; $option .= '</option>'; echo $option; } } ?> </select></div> </li> <li><label>Тип</label><div class="input"><select name="type_moto"> <option selected value="">Все</option> <?php $type_moto_key = 'wpcf-type_moto'; $type_moto_counties = $wpdb->get_col($wpdb->prepare("SELECT DISTINCT meta_value FROM $wpdb->postmeta WHERE meta_key = %s ORDER BY meta_value ASC", $type_moto_key) ); if ($type_moto_counties) { foreach ($type_moto_counties as $type_moto) { echo "<option value=\"" . $type_moto . "\">" . $type_moto . "</option>"; } } ?> </select></div> </li> <li><label>Год выпуска</label><div class="input"> <select class="price_input" name="year_moto_ot"> <option selected value="">От:</option> <OPTION value="2012" >2012</OPTION> <OPTION value="2011" >2011</OPTION> <OPTION value="2010" >2010</OPTION> <OPTION value="2009" >2009</OPTION> <OPTION value="2008" >2008</OPTION> <OPTION value="2007" >2007</OPTION> <OPTION value="2006" >2006</OPTION> <OPTION value="2005" >2005</OPTION> <OPTION value="2004" >2004</OPTION> <OPTION value="2003" >2003</OPTION> <OPTION value="2002" >2002</OPTION> <OPTION value="2001" >2001</OPTION> <OPTION value="2000" >2000</OPTION> <OPTION value="1999" >1999</OPTION> <OPTION value="1998" >1998</OPTION> <OPTION value="1997" >1997</OPTION> <OPTION value="1996" >1996</OPTION> <OPTION value="1995" >1995</OPTION> <OPTION value="1994" >1994</OPTION> <OPTION value="1993" >1993</OPTION> <OPTION value="1992" >1992</OPTION> <OPTION value="1991" >1991</OPTION> <OPTION value="1990" >1990</OPTION> <OPTION value="1989" >1989</OPTION> <OPTION value="1988" >1988</OPTION> <OPTION value="1987" >1987</OPTION> <OPTION value="1986" >1986</OPTION> <OPTION value="1985" >1985</OPTION> <OPTION value="1984" >1984</OPTION> <OPTION value="1983" >1983</OPTION> <OPTION value="1982" >1982</OPTION> <OPTION value="1981" >1981</OPTION> <OPTION value="1980" >1980</OPTION> <OPTION value="1979" >1979</OPTION> <OPTION value="1978" >1978</OPTION> <OPTION value="1977" >1977</OPTION> <OPTION value="1976" >1976</OPTION> <OPTION value="1975" >1975</OPTION> <OPTION value="1974" >1974</OPTION> <OPTION value="1973" >1973</OPTION> <OPTION value="1972" >1972</OPTION> <OPTION value="1971" >1971</OPTION> <OPTION value="1970" >1970</OPTION> </select> <select class="price_input" name="year_moto_do"> <option selected value="">До:</option> <OPTION value="2012" >2012</OPTION> <OPTION value="2011" >2011</OPTION> <OPTION value="2010" >2010</OPTION> <OPTION value="2009" >2009</OPTION> <OPTION value="2008" >2008</OPTION> <OPTION value="2007" >2007</OPTION> <OPTION value="2006" >2006</OPTION> <OPTION value="2005" >2005</OPTION> <OPTION value="2004" >2004</OPTION> <OPTION value="2003" >2003</OPTION> <OPTION value="2002" >2002</OPTION> <OPTION value="2001" >2001</OPTION> <OPTION value="2000" >2000</OPTION> <OPTION value="1999" >1999</OPTION> <OPTION value="1998" >1998</OPTION> <OPTION value="1997" >1997</OPTION> <OPTION value="1996" >1996</OPTION> <OPTION value="1995" >1995</OPTION> <OPTION value="1994" >1994</OPTION> <OPTION value="1993" >1993</OPTION> <OPTION value="1992" >1992</OPTION> <OPTION value="1991" >1991</OPTION> <OPTION value="1990" >1990</OPTION> <OPTION value="1989" >1989</OPTION> <OPTION value="1988" >1988</OPTION> <OPTION value="1987" >1987</OPTION> <OPTION value="1986" >1986</OPTION> <OPTION value="1985" >1985</OPTION> <OPTION value="1984" >1984</OPTION> <OPTION value="1983" >1983</OPTION> <OPTION value="1982" >1982</OPTION> <OPTION value="1981" >1981</OPTION> <OPTION value="1980" >1980</OPTION> <OPTION value="1979" >1979</OPTION> <OPTION value="1978" >1978</OPTION> <OPTION value="1977" >1977</OPTION> <OPTION value="1976" >1976</OPTION> <OPTION value="1975" >1975</OPTION> <OPTION value="1974" >1974</OPTION> <OPTION value="1973" >1973</OPTION> <OPTION value="1972" >1972</OPTION> <OPTION value="1971" >1971</OPTION> <OPTION value="1970" >1970</OPTION> </select> </div></li> <li><label>Пробег</label><div class="input"><select name="km_moto"> <option selected value="">До:</option> <option value="5000">5000 км</option> <option value="10000">10000 км</option> <option value="15000">15000 км</option> <option value="20000">20000 км</option> <option value="25000">25000 км</option> <option value="30000">30000 км</option> <option value="50000">50000 км</option> <option value="75000">75000 км</option> <option value="100000">100000 км</option> <option value="150000">150000 км</option> </select></div> </li> <li><label>Объем</label><div class="input"><select class="price_input" name="v_moto_ot"> <option selected value="">От:</option> <option value="50">50</option> <option value="80">80</option> <option value="150">150</option> <option value="250">250</option> <option value="500">500</option> <option value="600">600</option> <option value="750">750</option> <option value="1000">1000</option> <option value="1250">1250</option> <option value="1500">1500</option> </select> <select class="price_input" name="v_moto_do"> <option selected value="">До:</option> <option value="50">50</option> <option value="80">80</option> <option value="150">150</option> <option value="250">250</option> <option value="500">500</option> <option value="600">600</option> <option value="750">750</option> <option value="1000">1000</option> <option value="1250">1250</option> <option value="1500">1500</option> </select></div> </li> <li style="text-align: right; margin: 15px 0;"><input class="red button" type="submit" value="Найти" /></li> </ul> </form>

Эта форма вызывалась в сайдбаре (sidebar.php) с помощью php кода:

<?php get_template_part( 'moto_filtr_form' ); ?>

Вот что получилось

HTML форма позволяет выставить необходимые параметры поиска товаров на WordPress сайте и отправляет запрос методом GET (запрос формируется путем изменения URL страницы) .

Фильтр WordPress записей по произвольным полям

После этого, мы добавили фильтр товаров по параметрам, которые формировались запросом HTML формы. Фильтр представляет из себя следующий код, которые мы добавили в файл filtr.php, и затем вызвали этот файл в шаблоне index.php. Содержимое файла filtr.php:

<?php if (!empty($_GET["mark"])) { $mark = $_GET['mark']; } ?> <?php if (!empty($_GET["price1"])) { $price1 = $_GET['price1']; } else { $price1 = '0';} ?> <?php if (!empty($_GET["price2"])) { $price2 = $_GET['price2']; } else { $price2 = '999999999';} ?> <?php if (!empty($_GET["model"])) { $model = $_GET['model']; } ?> <?php if (!empty($_GET["type_moto"])) { $type_moto = $_GET['type_moto']; } ?> <?php if (!empty($_GET["year_moto"])) { $year_moto = $_GET['year_moto']; } ?> <?php if (!empty($_GET["km_moto"])) { $km_moto = $_GET['km_moto']; } ?> <?php if (!empty($_GET["v3_moto"])) { $v3_moto = $_GET['v3_moto']; } ?> <?php if (!empty($_GET["v_moto_ot"])) { $v_moto_ot = $_GET['v_moto_ot']; } else { $v_moto_ot = '0';} ?> <?php if (!empty($_GET["v_moto_do"])) { $v_moto_do = $_GET['v_moto_do']; } else { $v_moto_do = '999999999';} ?> <?php if (!empty($_GET["year_moto_ot"])) { $year_moto_ot = $_GET['year_moto_ot']; } else { $year_moto_ot = '0';} ?> <?php if (!empty($_GET["year_moto_do"])) { $year_moto_do = $_GET['year_moto_do']; } else { $year_moto_do = '999999999';} ?> <?php if (!empty($_GET["km_moto"])) { $km_moto = $_GET['km_moto']; } else { $km_moto = '999999999';} ?> <?php if ($price1 or $price2 or $mark or $model or $type_moto or $year_moto or $km_moto or $v3_moto or $v_moto_ot or $v_moto_do or $year_moto_ot or $year_moto_do or $s) { $paged = (get_query_var('paged')) ? get_query_var('paged') : 1; $args=array( 'category_name' => $mark, 'paged'=>$paged, 's'=>$s, 'meta_query' => array( array( 'key' => 'product-price', 'value' => array( $price1, $price2 ), 'type' => 'numeric', 'compare' => 'BETWEEN' ), array( 'key' => 'wpcf-type_moto', 'value' => $type_moto ), array( 'key' => 'wpcf-year_moto', 'value' => array( $year_moto_ot, $year_moto_do ), 'type' => 'numeric', 'compare' => 'BETWEEN' ), array( 'key' => 'wpcf-km_moto', 'value' => array( 0, $km_moto ), 'type' => 'numeric', 'compare' => 'BETWEEN' ), array( 'key' => 'wpcf-v3_moto', 'value' => array( $v_moto_ot, $v_moto_do ), 'type' => 'numeric', 'compare' => 'BETWEEN' ), ) ); query_posts($args); } else { echo ''; } ?>

Содержимое файла index.php:

<?php get_header(); ?> <?php get_template_part( 'filtr'); ?> <div class="content box"> <h1 class="center-title">Мотоциклы</h1> <?php get_template_part( 'loop', 'table' ); ?> </div> <? wp_reset_query(); ?> <?php get_sidebar(); ?> <?php get_footer(); ?>

Не забудьте в файл index.php добавить <? wp_reset_query(); ?> после вызова петли (loop) - это крайне необходимо.

Код в файле filtr.php работает следующим образом. Он получает значения параметров, которые были переданы HTML формой в URL, и на основе полученных данных формирует выдачу записей. Пояснять код более подробно нет смысла, т.к. тот кто решил реализовать подобный поиск WordPress записей по произвольным полям , должен понимать с чем имеет дело, и должен обладать необходимыми знаниями. Подобный фильтр работает на основе функции <? query_posts($args); ?>. Вот так был создан поиск и фильтр WordPress записей по произвольным полям.

Подписывайтесь и получайте полезные статьи на почту!