掌握 WP_Query：教你使用Loop循環(huán)

正如我們在入門指引里面提到的， WP_Query類包括四個部分：

• 需要查詢的參數(shù)，或者參數(shù)集合。
• 開始查詢。
• 循環(huán)輸出——這將輸出文章內(nèi)容、標(biāo)題或任何你想顯示的內(nèi)容。
• 查詢結(jié)束——通過標(biāo)簽判斷、重置請求數(shù)據(jù)。

在這篇博文里面，我們將要學(xué)習(xí)如何使用Loop循環(huán)，包括：兩種主要的方式來構(gòu)建Loop循環(huán)以及如何使用多重Loop循環(huán)。

哪里適合使用Loop循環(huán)

如果沒有Loop循環(huán)，頁面上不會顯示任何東西。當(dāng)Wordpress運(yùn)行了查詢機(jī)制之后（當(dāng)然啦，在這之前，需要設(shè)定好參數(shù)），接著需要告訴查詢程序哪些數(shù)據(jù)是需要展現(xiàn)的。這里就是需要Loop循環(huán)的地方。

所以，在查詢之后，循環(huán)就來了，Loop循環(huán)會使用如下三個標(biāo)簽：

• if( $query->have_posts() ) 檢查是否有文章。
• while( $query->have_posts() ) 循環(huán)往復(fù)的執(zhí)行Loop循環(huán)，去檢索是否有文章。
• $query->the_post() 獲取到特定的文章。

以下是Loop循環(huán)在WP_Query類中的位置：

<?php
 
$args = array(
    // 給予Query查詢定義的參數(shù));// 定義一個新的查詢

$query = new WP_Query( $args );
 
// 判斷我們所查詢到的結(jié)果.

if ( $query->have_posts() ) {
 
    // 開始循環(huán)往復(fù)的查詢結(jié)果
while ( $query->have_posts() ) {
 
        $query->the_post();
 
        // 查詢到的文章內(nèi)容 
    }
 
}

// 重置請求數(shù)據(jù).

wp_reset_postdata();
 
?>

小伙伴們別忘記了，當(dāng)循環(huán)結(jié)束后，要使用wp_reset_postdata()清理程序

Loop 循環(huán)結(jié)構(gòu)

你想要顯示文章的哪些數(shù)據(jù)決定了你的Loop循環(huán)的結(jié)構(gòu)。以下是一個Loop循環(huán)示例，輸出文章標(biāo)題、特色圖像和摘要。你應(yīng)該在一個歸檔頁面中像這樣使用循環(huán)：

<?php
 
$args = array(
    // Arguments for your query.
);
 
// Custom query.
$query = new WP_Query( $args );
 
// Check that we have query results.
if ( $query->have_posts() ) {
 
    // Start looping over the query results.
    while ( $query->have_posts() ) {
 
        $query->the_post();
 
        ?>
 
        <article id="post-<?php the_ID(); ?>" <?php post_class( 'left' ); ?>>
            <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
                <?php post_thumbnail( 'thumbnail' );?>
            </a>
            <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
                <?php the_title(); ?>
            </a>
            <?php the_excerpt(); ?>
        </article>
 
        <?php
 
    }
 
}
 
// Restore original post data.
wp_reset_postdata();
 
?>

這個循環(huán)像我上面所說的一樣顯示：特色圖像、標(biāo)題和摘要。

Loop循環(huán)進(jìn)階教程：檢查文章內(nèi)容

有的時候，可能需要給文章列表添加一個標(biāo)題，或者是把它們都附到一個容器元素里面。如果只是簡單的使用上面的Loop循環(huán)代碼，它可能不管查詢是否返回數(shù)據(jù)都會輸出標(biāo)題——意味著在標(biāo)題的后面看不到任何數(shù)據(jù)，或者是一些不必要的東西。

簡單來做是：把需要附到Loop循環(huán)里的閉合元素和標(biāo)題放到if 標(biāo)簽里面去。

<?php
 
$args = array(
    // 給予Query查詢定義的參數(shù)
);
 
// 定義一個新的查詢
$query = new WP_Query( $args );
 
// 判斷我們所查詢到的結(jié)果
if ( $query->have_posts() ) {
 
     
    echo '<section class="clear">';
        echo '<h2>' . __( 'Heading', 'tutsplus' ) . '</h2>';
     
        // 開始循環(huán)往復(fù)的查詢結(jié)果
        while ( $query->have_posts() ) {
     
            $query->the_post();
     
            ?>
     
            <article id="post-<?php the_ID(); ?>" <?php post_class( 'left' ); ?>>
                <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
                    <?php post_thumbnail( 'thumbnail' );?>
                </a>
                <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
                    <?php the_title(); ?>
                </a>
                <?php the_excerpt(); ?>
            </article>
     
            <?php
     
        }
     
    echo '</section>';
 
}
 
// 重置請求數(shù)據(jù)
wp_reset_postdata();
 
?>

由上可以看出，在每次查詢到新的文章的時候，會添加一個開放標(biāo)簽的容器（<section class=”clear”>）和一個標(biāo)題（<h2>’ . __( ‘Heading’, ‘tutsplus’ ) . ‘</h2>）。

這種方法同樣適用，通過查詢展示文章列表。如果某同學(xué)說，我想在一個分類中創(chuàng)建所有文章的列表。 ul 元素不在Loop循環(huán)中，也不在文章中，但是需要在有文章的地方去輸出 ul 。那么可以如下做：

<?php
 
$args = array(
    'category_name' => 'category-slug',
    'post_type' => 'post'
);
 
// 定義一個新的查詢
$query = new WP_Query( $args );
 
// 判斷我們所查詢到的結(jié)果
if ( $query->have_posts() ) {
 
    echo '<ul class="category posts">';
 
        // 開始循環(huán)往復(fù)的查詢結(jié)果
        while ( $query->have_posts() ) {
 
            $query->the_post();
 
            ?>
 
            <li <?php post_class( 'left' ); ?>>
                <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
                    <?php the_title(); ?>
                </a>
            </li>
 
            <?php
     
        }
 
    echo '</ul>';
 
}
 
// 重置請求數(shù)據(jù)
wp_reset_postdata();
 
?>

當(dāng)查詢檢索到任何文章的時候，它會添加開始 ul 元素，然后運(yùn)行Loop循環(huán)。

運(yùn)行附加的Loop循環(huán)

可以很清楚的看到使用 WP_Query 可以創(chuàng)建多個Loop循環(huán)，必須每次重置請求數(shù)據(jù)，并重新創(chuàng)建一個新的 WP_Query 實(shí)例。這是因為每個Loop循環(huán)都會由不同的參數(shù)來輸出數(shù)據(jù)。

以下的例子展示了首篇文章使用摘要和特色圖片，但后面的文章只展示標(biāo)題：

<?php
 
// 定義查詢1的參數(shù)
$args1 = array(
    'post_type' => 'post',
    'posts_per_page' => '1'
);
 
// 自定義查詢1
$query1 = new WP_Query( $args1 );
 
// 判斷是否有文章.
if ( $query1->have_posts() ) {
 
    // 開始循環(huán)往復(fù)的查詢結(jié)果.
    while ( $query1->have_posts() ) {
 
        $query1->the_post();
 
        ?>
 
        <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
            <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
                <?php post_thumbnail( 'thumbnail' );?>
            </a>
            <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
                <?php the_title(); ?>
            </a>
            <?php the_excerpt(); ?>
        </article>
 
        <?php
 
    }
 
}
 
// 重置請求數(shù)據(jù).
wp_reset_postdata();
 
// 定義查詢2的參數(shù).
$args2 = array(
    'offset' => '1',
    'post_type' => 'post'
);
 
// 自定義查詢2.
$query2 = new WP_Query( $args2 );
 
// 判斷是否有文章.
if ( $query2->have_posts() ) {
 
    echo '<ul class="more-posts">';
     
        // 開始循環(huán)往復(fù)的查詢結(jié)果.
        while ( $query2->have_posts() ) {
 
            $query2->the_post();
     
            ?>
 
            <li <?php post_class(); ?>>
                <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
                    <?php the_title(); ?>
                </a>
            </li>
     
            <?php
     
        }
     
    echo '</ul>';
 
}
 
// 重置請求數(shù)據(jù).
wp_reset_postdata();
 
?>

這里使用到的兩個參數(shù)：

• ‘posts_per_page’ => ‘1’,第一個查詢所用的是為了輸出最新的一篇文章。
• ‘offset’ = ‘1’,第二查詢中，是為了跳過第一篇文章，確保在列表中不會重復(fù)。

上面的代碼中，loop循環(huán)之間有細(xì)微的差別。第一個循環(huán)輸出特色圖片，標(biāo)題和摘要，而第二個循環(huán)會判斷是否有文章，并在有文章的時候，添加一個ul元素，在每個篇文章使用li元素閉合以及添加鏈接到文章頁面。

注意到第一個循環(huán)后使用的wp_reset_postdata()，那是為了避免第二個循環(huán)輸出重復(fù)的數(shù)據(jù)（與第一個循環(huán)重復(fù)）。

小結(jié)

在循環(huán)中，wp_query做的事情不多。Loop循環(huán)是用來展示數(shù)據(jù)的——你來定義需要查詢的參數(shù)，并由Wordpress查詢數(shù)據(jù)庫，最后Loop循環(huán)展示。

正如例子代碼，可以有很多種變化的Loop循環(huán)。一個簡單的Loop循環(huán)只是按序輸出了文章，如果分離 if( $query->have_posts() ) 和 while( $query->have_posts() ),那可以插入附加的標(biāo)簽到Loop循環(huán)（當(dāng)然啦，前題是Query查詢到數(shù)據(jù)了）。最后需要注意的是，Loop循環(huán)傳遞不同的參數(shù)的時候使用wp_reset_postdata()，這樣就可以在同一個頁面上新建多個Loop循環(huán)（多重循環(huán)）。

原文出自：http://code.tutsplus.com/tutorials/mastering-wp_query-using-the-loop–cms-23031

由 癡空見觀@WordPress大學(xué) 原創(chuàng)翻譯，未經(jīng)允許，禁止轉(zhuǎn)載和采用本譯文。