Загружайте сообщения WordPress, используя jQuery

Question

У меня есть настройки страницы со следующим кодом:

    <?PHP

        get_header();

    ?>

    <div class="wrapper clearfix">

        <div class="clearfix">

        <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

            <div class="page-header">

                <h2 class="section_title"><?php the_title(); ?></h2>

            </div>

            <?php endwhile; endif; ?>

            <div class="filter">
                <p>Filter :</p>
                <?php 
                //list terms in a given taxonomy using wp_list_categories (also useful as a widget if using a PHP Code plugin)

                $taxonomy     = 'portfolio_tag';
                $orderby      = 'name'; 
                $show_count   = 0;      // 1 for yes, 0 for no
                $pad_counts   = 0;      // 1 for yes, 0 for no
                $hierarchical = 1;      // 1 for yes, 0 for no
                $title        = '';
                $hide_empty   = 0;

                $args = array(
                  'taxonomy'     => $taxonomy,
                  'orderby'      => $orderby,
                  'show_count'   => $show_count,
                  'pad_counts'   => $pad_counts,
                  'hierarchical' => $hierarchical,
                  'title_li'     => $title,
                  'hide_empty'   => $hide_empty
                );
                ?>

                <ul>
                <li class="current-cat"><a title="View all posts" href="<?php bloginfo('url'); ?>/portfolio/">All</a></li>
                <?php wp_list_categories( $args ); ?>
                </ul>

            </div>              

        </div>

        <div class="description">

        <?php the_content(); ?>

        </div>

        <div class="portfolio-archives">

            <ul class="portfolio-list clearfix">

            <?php $temp = $wp_query; $wp_query= null; ?>        

            <?php $wp_query = new WP_Query(array('post_type' => 'portfolio', 'posts_per_page' => 999, 'paged' => $paged)); while ($wp_query->have_posts()) : $wp_query->the_post(); ?>

            <?php //$portfolio_query = new WP_Query(array( 'post_type' => 'portfolio' )); while ($portfolio_query->have_posts()) : $portfolio_query->the_post();

            ?>      

                <?PHP

                    if (!($nr++ % 4))
                    {
                        echo '<li class="first">';  
                    }
                    else 
                    {
                        echo '<li>';
                    }
                ?>

                <?php
                if ( has_post_thumbnail() ) { ?>

                    <a title="<?php the_title(); ?>" rel="bookmark" href="<?php the_permalink() ?>"><?php the_post_thumbnail(); ?></a>
                    <h3><a title="<?php the_title(); ?>" href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a></h3>
                    <?php echo get_the_term_list( $post->ID, 'portfolio_tag', '<p class="taxonomy">', ', ', '</p>' ); ?>

                <?php

                } else {

                ?>

                    <a title="<?php the_title(); ?>" rel="bookmark" href="<?php the_permalink() ?>"><img src="http://dummyimage.com/600x400/ccc/fff&text=x" /></a>
                    <h3><a title="<?php the_title(); ?>" href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a></h3>
                    <?php echo get_the_term_list( $post->ID, 'portfolio_tag', '<p class="taxonomy">', ', ', '</p>' ); ?>

                <?php } ?>

                </li>

            <?php endwhile; ?>

            </ul>

        </div>
        <!-- END div.portfolio-archives -->


        <?php if(function_exists('wp_pagenavi'))
        {
            wp_pagenavi();
        }
        ?>

        <div class="navigation">
            <div class="alignleft"><?php next_posts_link('&laquo; Older Entries') ?></div>
            <div class="alignright"><?php previous_posts_link('Newer Entries &raquo;') ?></div>
        </div>

        <?php $wp_query = null; $wp_query = $temp; ?>


    </div>
    <!-- END div.clearfix -->

    <?PHP

        get_footer();

    ?>

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

Я хотел бы сделать так, чтобы с помощью jQuery он загружался в эти посты, а не выводил пользователя на страницу (а если у него нет javascript, он просто загружал страницу как обычно).

Это пример того, что я хочу работать: http://adamfoster.me.uk (ЭТО НЕ МОЙ ВЕБ-САЙТ), если вы щелкаете ссылки (которые являются пользовательскими таксономиями) справа, это меняет посты выше.

Может кто-нибудь помочь?

Answer 1

Можно использовать код из WordPress ›AJAX Page Loader 1.5« Плагины WordPress

Answer 2

Довольно просто. Вам нужно будет сделать несколько вещей.

1) Разделитель для места, где вы хотите обновить материал. Для этого примера давайте назовем это "placeHolder" 2) метод jQuery post для отключения при каждом нажатии фильтра. Так что, если вы применили свои фильтры к определенному стилю, скажем, «classFilter», то пример будет выглядеть так: 3) PHP для обработки ваших сообщений. Просто измените запрос на фильтрацию по почте (например, query_posts ('tag = tag1 + tag2 + tag3');) и верните полученный набор. Если вы решили опубликовать как json, то после зацикливания ваших сообщений в переменную (например, $ posts ['posts']) можно привести пример: return json_encode ($ posts) 4) Вернемся к методу публикации jQuery ... в части функции (данные) убедитесь, что для html placeHolder установлено значение data.posts