Я делаю собственный сайт WordPress для клиента, на котором я хотел бы внедрить Infinite Scrolling в мой архив и шаблоны категорий.
Для этого я использую следующее:
Я прочитал несколько постов и учебных пособий по Интернету, объясняющих, как реализовать эту функциональность, все кажется очень простым, но по какой-то причине я не могу заставить его работать.
Плагин активируется, а также активируется модуль Infinite Scroll.
Я следую инструкциям, написанным здесь: http://ottopress.com/2012/jetpack-and-the-infinite-scroll/
У меня есть следующий кусок кода в моем category.php (где я делаю все свои тесты), пожалуйста, обратите внимание, что все заключено в div с идентификатором «content»:
<div id="content">
<?php if ( have_posts() ) : ?>
<?php
// Start the Loop.
while ( have_posts() ) : the_post();
get_template_part( 'content', 'category' );
// End the loop.
endwhile;
// If no content, include the "No posts found" template.
else :
get_template_part( 'content', 'none' );
endif;
?>
</div>
Затем я создал Содержание-category.php файл, где у меня есть фактическая разметка постов (ничего из этого мира здесь):
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<!-- row -->
<div class="row">
<div class="col-xs-12 col-sm-6">
<!-- post thumbnail -->
<?php if ( has_post_thumbnail()) : // Check if thumbnail exists ?>
<div class="thumb">
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<div class="icono-redondo-negro">
<?php
$format = get_post_format();
if ( false === $format ) :
?>
<i class="fa fa-file-text"></i>
<?php endif; ?>
<?php if ( has_post_format( 'gallery' )) : ?>
<i class="fa fa-picture-o"></i>
<?php elseif ( has_post_format( 'video' )) : ?>
<i class="fa fa-video-camera"></i>
<?php elseif ( has_post_format( 'audio' )) : ?>
<i class="fa fa-headphones"></i>
<?php endif; ?>
</div>
<?php the_post_thumbnail('categoria-thumb'); ?>
<span class="plus">+</span>
</a>
</div>
<?php endif; ?>
<!-- /post thumbnail -->
</div>
<div class="col-xs-12 col-sm-6">
<p class="fecha"><?php the_time('j \d\e\ F, Y'); ?> | <?php the_time('g:i a'); ?></p>
<!-- post title -->
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<h1 class="titulo"><?php the_title(); ?></h1>
</a>
<!-- /post title -->
<!-- post excerpt -->
<p><?php html5wp_excerpt('html5wp_index'); // Build your custom callback length in functions.php ?></p>
<!-- /post excerpt -->
<?php edit_post_link(); ?>
</div>
</div>
<!-- /row -->
</article>
В веб-интерфейсе все выглядит хорошо, начинается сложная часть, когда я на самом деле добавляю поддержку бесконечной прокрутки в свою тему через functions.php:
function raramuri_infinite_scroll_init() {
add_theme_support( 'infinite-scroll', array(
'container' => 'content',
'type' => 'click',
'footer' => false,
));
}
add_action('init', 'raramuri_infinite_scroll_init');
Я пробовал несколько вещей, таких как:
К этому моменту ничего не получалось, я не вижу «значок загрузки gif» при прокрутке вниз и кнопку «Показать больше сообщений» при использовании версии с кликом.
Я думаю, что это может быть некоторая несовместимость с HTML5Blank, или я не реализую поддержку бесконечной прокрутки правильным способом.
Я хотел бы иметь кнопку «Показать больше сообщений», чтобы пользователи могли загружать больше, как они хотят.
Я что-то пропустил? Заранее спасибо за помощь!
Задача ещё не решена.
Других решений пока нет …