Как это работает прямо сейчас:
- Показывает последние 6 проектов по умолчанию
- При нажатии конкретных списков отображается последняя запись в этой категории, которые являются последними 6 проектами. Например: он показывает 4 последних в Фото, потому что 4 из 6 категорий, как Фото. Это означает, что если 6 последних проектов находятся в категории Foto, ни одна из должностей в других категориях не будет показана. Пожалуйста, смотрите ниже, если вы не понимаете.
Как это работает:
- Показывать последние 6 проектов по умолчанию (это работает)
- При нажатии одной категории он должен отображать последние 6 сообщений в этой категории
Примечание. Если вы используете Chrome с Windows 10, эффект зависания по какой-то причине перестает работать. Сообщается об ошибке в Chrome и Windows
<ul id="filters" class="whitetext whitelink myeluft">
<li class="smoothtrans"><a href="#" data-filter="*" class="selected smoothtrans">Alle</a></li>
<li class="smoothtrans"><a href='#' data-filter='.foto' class="smoothtrans">Foto</a></li>
<li class="smoothtrans"><a href='#' data-filter='.video' class="smoothtrans">Video</a></li>
<li class="smoothtrans"><a href='#' data-filter='.web' class="smoothtrans">Web</a></li>
</ul>
PHP
<?php
$args = array(
'post_type' => (array( 'foto', 'video', 'web' )),
'posts_per_page' => '6',
'post_taxonomy' => 'any',
);
$the_query = new WP_Query($args);
// Loop post_type
?>
<?php if ( $the_query->have_posts() ) : ?>
<div id="isotope-list">
<?php while ( $the_query->have_posts() ) : $the_query->the_post();
$termsArray = get_the_terms( $post->ID, "category"); //Get the terms for this particular item
$termsString = ""; //initialize the string that will contain the terms
foreach ( $termsArray as $term ) { // for each term
$termsString .= $term->slug.' '; //create a string that has all the slugs
}
?>
<div class="<?php echo $termsString; ?> item col-md-4">
<ul class="grid cs-style-3">
<li>
<figure>
<?php if ( has_post_thumbnail() ) {
the_post_thumbnail('frontpage_thumb');
} ?>
<figcaption class="lefttext">
<h3><?php the_title(); ?></h3>
<span class="offgrey"><?php echo(types_render_field( "produkt", array( 'raw' => true) )); ?> / <?php echo(types_render_field( "produsert", array( 'raw' => true) )); ?></span>
<a href="<?php the_permalink() ?>" title="Se prosjekt" rel="bookmark" class="smoothtrans">Se prosjekt</a>
</figcaption>
</figure>
</li>
</ul>
</div> <!-- end item -->
<?php endwhile; ?>
</div> <!-- end isotope-list -->
<script src="<?php bloginfo('stylesheet_directory'); ?>/js/toucheffects.js"></script>
<?php endif; ?>
JS
jQuery(function ($) {
var $container = $('#isotope-list'); //The ID for the list with all the blog posts
$container.isotope({ //Isotope options, 'item' matches the class in the PHP
itemSelector : '.item',
layoutMode : 'masonry'
});
//Add the class selected to the item that is clicked, and remove from the others
var $optionSets = $('#filters'),
$optionLinks = $optionSets.find('a');
$optionLinks.click(function(){
var $this = $(this);
// don't proceed if already selected
if ( $this.hasClass('selected') ) {
return false;
}
var $optionSet = $this.parents('#filters');
$optionSets.find('.selected').removeClass('selected');
$this.addClass('selected');
//When an item is clicked, sort the items.
var selector = $(this).attr('data-filter');
$container.isotope({ filter: selector });
return false;
});
});
My buts (обновлено 13/07/15)
Я больше посмотрел на него, и, отключив 'posts_per_page' и просто используя пользовательские настройки wp, проблема такая же. Поэтому я предполагаю, что проблема заключается в том, что при нажатии каждой категории она не обновляется и не получает никаких других сообщений, чем показано первым.
Поэтому я считаю, что аргументы должны быть установлены в другом месте, или js необходимо изменить для получения новых сообщений. Но это не мой опыт, и поэтому я спрашиваю вас, есть ли у вас какие-либо решения. Я искал и поисковые системы, и SO для этого вопроса, но я не мог найти его. Тем не менее, я вижу, что похожие страницы имеют одинаковую проблему. С этим я считаю, что решение этой проблемы также поможет другим пользователям.
