/ Плагины / Фильтр по меткам (изменение основного запроса)

Фильтр по меткам (изменение основного запроса)

HIT

29.09.2016

3836

2

Реализуем фильтрацию записей по меткам путем изменения основного запроса на лету (ajax).

Находим все теги записей входящих в категорию

Данный код можно вставить в боковую колонку в виде виджета.

<?php

$getcat = get_the_category();
if($getcat[0]){
$cat_id=$getcat[0]->term_id;
}
query_posts('cat='.$cat_id.'&posts_per_page=-1'); //брать метки из всей категории или с первой страницы

if(have_posts()): while (have_posts()) : the_post();

$all_tag_objects = get_the_tags();
if($all_tag_objects){
foreach($all_tag_objects as $tag) {
if($tag->count > 0) {$all_tag_ids[] = $tag -> term_id;}
}
}

endwhile;endif; wp_reset_query();
if ( $tag->count > 0 ): ?>

<?php $tag_ids_unique = array_unique($all_tag_ids); ?>

<div id="all" class="activ podcat-line">All</div>

<?php foreach($tag_ids_unique as $tag_id): ?>


<?php
$post_tag = get_term( $tag_id, 'post_tag' );
$imgcat1 = get_field("mini-thumb",$post_tag);
?>

<div class="podcat-line">
<div class="cat-image-min"><img alt="<?php echo $post_tag->name; ?>" src="<?php echo $imgcat1['sizes']['square-xs']; ?>"></div>
<div title="<?php echo $post_tag->term_id; ?>" id="<?php echo $post_tag->slug; ?>" class="taguniq"><?php echo $post_tag->name; ?></div>
</div>

<?php endforeach; ?>

<?php endif; ?>

Находим все теги записей входящих в категорию

Подключаем скрипт и прописываем функцию фильтра

function ajax_filter_posts_scripts() {

wp_register_script( 'afp_script', plugins_url('/ajax-filter-posts.js', __FILE__), array('jquery'), null, false );
wp_enqueue_script( 'afp_script' );

wp_localize_script( 'afp_script', 'afp_vars', array(
'afp_nonce' => wp_create_nonce( 'afp_nonce' ), // Create nonce which we later will use to verify AJAX request
'afp_ajax_url' => admin_url( 'admin-ajax.php' ),
)
);
}
add_action('wp_enqueue_scripts', 'ajax_filter_posts_scripts', 100);

function ajax_filter_get_posts( $taxonomy ) {
$args = array(
'cat' => $_POST['category']
);


if( isset( $_POST['taxonomy'] ) ):
$args['tag__in'] = ($_POST['taxonomy']);
endif;


$theme_post_query = new WP_Query( $args );
$i = 1;
while( $theme_post_query->have_posts() ) :

if ($i === 1) {$new_class = "first-post";}
elseif ($i % 3 == 0) {$new_class = "last-post"; $i = 0;}
else {$new_class = "";}

$theme_post_query->the_post();

include(TEMPLATEPATH."/solus.php");

$i++;
endwhile;

exit;
}

add_action('wp_ajax_filter_posts', 'ajax_filter_get_posts');
add_action('wp_ajax_nopriv_filter_posts', 'ajax_filter_get_posts');

Скрипт

jQuery(document).ready(function($) {
	$('.taguniq').click( function(event) {

		// Prevent defualt action - opening tag page
		if (event.preventDefault) {
			event.preventDefault();
		} else {
			event.returnValue = false;
		}

		// Get tag slug from title attirbute
		var selecetd_taxonomy = $(this).attr('title');
	    var selecetd_cat = $('#curcat').attr('title');

		$('.tagged-posts').fadeOut();

		data = {
			action: 'filter_posts',
			afp_nonce: afp_vars.afp_nonce,
			taxonomy: selecetd_taxonomy,
		    category: selecetd_cat,
		};
	  

		$.ajax({
			type: 'post',
			dataType: 'html',
			url: afp_vars.afp_ajax_url,
			data: data,
			success: function( data, textStatus, XMLHttpRequest ) {
				$('.tagged-posts').html( data );
				$('.tagged-posts').fadeIn();
			    $(".hentry").css("height", "auto");
                $(".hentry").setEqualHeight();
				console.log( textStatus );
				console.log( XMLHttpRequest );
			},
			error: function( MLHttpRequest, textStatus, errorThrown ) {
				console.log( MLHttpRequest );
				console.log( textStatus );
				console.log( errorThrown );
				$('.tagged-posts').html( 'No posts found' );
				$('.tagged-posts').fadeIn();
			}
		})

	});
  
  
  	$('#all').click( function(event) {
	  

		// Получаем данные из различных атрибутов
	    var selecetd_cat = $('#curcat').attr('title');
 

		$('.tagged-posts').fadeOut();

		data = {
			action: 'filter_posts',
			afp_nonce: afp_vars.afp_nonce,
		    category: selecetd_cat,
		};
	  

		$.ajax({
			type: 'post',
			dataType: 'html',
			url: afp_vars.afp_ajax_url,
			data: data,
			success: function( data, textStatus, XMLHttpRequest ) {
				$('.tagged-posts').html( data );
				$('.tagged-posts').fadeIn();
			    $(".hentry").css("height", "auto");
                $(".hentry").setEqualHeight();
				console.log( textStatus );
				console.log( XMLHttpRequest );
			},
			error: function( MLHttpRequest, textStatus, errorThrown ) {
				console.log( MLHttpRequest );
				console.log( textStatus );
				console.log( errorThrown );
				$('.tagged-posts').html( 'No posts found' );
				$('.tagged-posts').fadeIn();
			}
		})
	  
	  
    });
  
});

Поделиться в соц. сетях:

  • Похожие записи
  • Комментарии
  • Вложения
Json Начало

Json Начало

JSON (JavaScript Object Notation) — это текстовый протокол обмена данными, чем-то похожий на более привычный XML, но данные записываются в нем более компактно. Изначально он был разработан для нужд JavaScript Читать далее »

Загрузка контента без перезагрузки

Загрузка контента без перезагрузки

Подгрузка контента средствами Ajax Создаем тестовую верстку <p>Какую страницу желаете открыть?</p> <form> <input onclick="showContent('https://opttour.ru/main-rublik/sites/fotofit/')" type="button" value="Страница 1"> <input onclick="showContent('https://opttour.ru/main-rublik/sites/dtex/')" type="button" value="Страница 2"> </form> <div id="contentBody"></div> <div id="loading" style="display: none"> Идет Читать далее »

Практикум по функциям

Практикум по функциям

В процессе штудирования книги «Изучаем PHP 7» (Дэвид Скляр) появилась мысль помечать некоторые моменты, касающиеся как функций, так и php в целом. Краткий обзор функций Если задать простую функцию function Читать далее »

Добавить комментарий

2 комментария

  1. nickSon

    есть такой же для woocommerce?

    1. Alexandr

      Нет для WC еще такой не делал. Для WC мне хватает штатного фильтра.

Фильтр по меткам (изменение основного запроса)
Появляющееся окно-подсказка
Рекомендации для васПоявляющееся окно-подсказкаOpttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.