如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示

什么是 WordPress 循環(huán)?

WordPress 循環(huán)(The Loop)是 WordPress 中用于顯示帖子和頁面內容的主要 PHP 代碼結構。它是一個 PHP 代碼塊,用于從數據庫中檢索帖子、頁面和其他類型的內容并將其顯示在 WordPress 網站上。

圖片[1]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

WordPress 循環(huán)的工作原理

WordPress 循環(huán)是一個核心功能,它使得當訪問者瀏覽你的網站時,可以看到文章和頁面的內容。這個循環(huán)會自動從網站的數據庫中提取文章信息,比如標題、發(fā)布日期、正文內容和其他相關數據。

下面是一個的 WordPress 循環(huán)的例子,幫你更好地理解它是如何工作的:

<?php get_header(); ?>
<?php
if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php the_title() ;?>
<?php the_author(); ?>
<?php the_post_thumbnail(); ?>
<?php endwhile; ?>
<?php endif; ?>
<?php get_footer(); ?>

當你訪問一個WordPress網站時,網站上顯示的文章和頁面內容都是通過一系列函數工作來展現的。這些函數每一個都有自己的特定任務,看看它們各自負責什么:

  • get_header()get_footer():這兩個函數分別負責在網頁上添加頁眉和頁腳。頁眉通常包含了網站的導航菜單和徽標,而頁腳則可能包含聯(lián)系信息、版權聲明等。
  • if (have_posts()):這個判斷用來檢查是否有文章可顯示。如果有,它返回真(true),這樣循環(huán)就可以開始顯示文章;如果沒有,返回假(false),網頁上就不會顯示文章內容。
  • while (have_posts()):這是一個循環(huán),它會一直運行,直到所有的文章都被顯示完畢。它讓網站可以一個接一個地展示每篇文章。
  • the_post():這個函數準備當前要顯示的文章數據,使得其他函數如the_title()the_post_thumbnail()可以正確地取得并展示這些信息。
  • the_title(), the_author(), the_post_thumbnail():這些函數用來顯示文章的標題、作者和縮略圖。在網頁上,這些內容通常被包裹在HTML代碼中,以便進行美觀的格式化顯示。
  • 結束語句 endwhileendif:這些用于結束前面的循環(huán)和判斷,確保代碼的邏輯正確閉合。

注意:默認情況下,循環(huán)會為每個帖子顯示the_title()the_time()the_category() WordPress 模板標簽。
或者,為你的 WordPress 循環(huán)使用以下PHP 代碼語法。雖然其功能和元素相同,但語法格式不同。下面是使用替代語法編寫的WordPress循環(huán)的一個示例:

<?php
get_header();
if ( have_posts() ) :
	while ( have_posts() ) : the_post();
	the_title();
	the_author();
	the_post_thumbnail();
	endwhile;
endif;
get_footer();
?>

如何在 WordPress 中使用循環(huán)

圖片[2]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

如何使用循環(huán)在帖子標題上建立超鏈接

在WordPress中,如果你想在帖子標題上添加超鏈接,點擊標題可以直接跳轉到帖子的詳細頁面,你可以使用the_permalink()函數。這個函數獲取并輸出當前帖子的永久鏈接(URL)。

<?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
           <h2><a href="<?php the_permalink(); ?>"><?php the_title() ;?></a></h2> 
            <?php the_post_thumbnail(); ?> 
<?php endwhile; ?> 
<?php endif; ?>

如何使用 WordPress 循環(huán)顯示內容、作者、日期和類別

如果你希望帖子包含作者、日期、類別和內容,應用以下 WordPress 代碼:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
           <h2><?php the_title() ;?></h2> 
           <?php the_author(); ?> <?php the_time('F j, Y'); ?> <?php the_category(); ?> 
           <?php the_post_thumbnail(); ?> 
           <?php the_content(); ?> 
<?php endwhile; ?> 
<?php endif; ?>

條件標簽是WordPress中的一系列特殊功能,它們幫助主題開發(fā)者根據不同的頁面類型或情況決定如何顯示網站內容。這些功能可以非常靈活地控制網站的顯示邏輯,讓不同頁面顯示不同的內容。

例如,如果你想讓某些內容只在首頁顯示,可以使用 is_home() 函數。這個函數檢查當前是否為博客的主頁;如果是,就執(zhí)行相應的代碼顯示特定內容。如果你想在文章的單獨頁面上顯示某些內容,就可以使用 is_single() 函數。這個函數用來判斷當前是否是單個帖子的頁面。

以下是 WordPress 中最常見的條件標簽:

  • is_front_page() – 用于網站的首頁。
  • is_page() – 用于 WordPress 頁面。
  • is_category() – 用于類別存檔。
  • is_tag() – 用于標簽存檔。
  • is_archive() – 用于存檔頁面。
  • is_search() – 用于搜索結果頁面。
  • is_author() – 用于作者檔案。
  • is_404() – for is 404 ff 頁面。

對于你想要在其上使用它們的任何頁面,將它們設置為“true 。

我們使用帶有if語句的is_front_page()標記,看示例:

<?php if (is_front_page()) : ?>   
        <?php if (have_posts() ) : while (have_posts() ) : the_post(); ?> 
         <h2><?php the_title() ;?></h2> 
           <?php the_post_thumbnail(); ?> 
           <?php the_excerpt(); ?> 

<?php endwhile; ?> 
<?php endif; ?> 
<?php endif; ?>

WordPress 用戶可以使用上面的代碼在首頁顯示帖子。

如何使用模板文件自定義 WordPress 循環(huán)

要自定義WordPress網站上的帖子顯示方式,你可以編輯主題文件夾中的幾個關鍵模板文件。這些文件包括archive.php(用于顯示歸檔頁面)、index.php(主頁)、category.php(分類頁面)和tag.php(標簽頁面)。

對于非塊 WordPress 主題,需要使用 WordPress 循環(huán)。

WordPress 循環(huán)示例

如何在WordPress的Twenty Twenty主題的index.php文件中添加代碼,使得不同類別的帖子有不同的顯示樣式。這種方式可以幫助讀者更容易區(qū)分各種類別的帖子。

參考以下的WordPress循環(huán)代碼,這段代碼根據官方文檔進行了注釋,以幫助你理解每個部分的作用:

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    <div <?php post_class(); ?>>
        <h2>
            <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
        </h2>
        <p class="post-category">Category: <?php the_category(', '); ?></p>
        <?php if ( in_category(3) ) : ?>
            <div style="color: red;"> <!-- 這里設置特別樣式 -->
                <?php the_content(); ?>
            </div>
        <?php else : ?>
            <?php the_content(); ?>
        <?php endif; ?>
    </div>
<?php endwhile; else : ?>
    <p>No posts found.</p>
<?php endif; ?>

插入廣告

使用 WordPress Loop,你可以將廣告插入到帖子中,記住將廣告代碼部分替換為實際代碼。:

<?php if (have_posts()) : ?> 
<?php $count = 0; ?> 
<?php while (have_posts()) : the_post(); ?> 
<?php $count++; ?> 
  <?php if ($count == 2) : ?> 
          //廣告代碼
          <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2> 
          <?php the_author(); ?> 
   <?php else : ?> 
          <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2> 
          <?php the_author(); ?> 
  <?php endif; ?> 
<?php endwhile; ?> 
<?php endif; ?>

獲取兩個日期之間的帖子

為了更輕松地管理站點,可以使用 WordPress 循環(huán)輕松過濾掉兩個日期之間的帖子。

<?php function filter_where($where = ’) {
        $where .= " AND post_date >= '2024-01-01' AND post_date <= '2024-05-01'";
    return $where;
  }
add_filter('posts_where', 'filter_where');
query_posts($query_string);
while (have_posts()) :
      the_post();
      the_content();
endwhile;
?>

注意調整調整 2024-01-01 和 2024-05-01。

顯示一年前發(fā)布的帖子

如果你想顯示一年前發(fā)布的帖子,使用以下代碼:

<?php
$current_day = date('j');
$last_year = date('Y')-1;
query_posts('day='.$current_day.'&year='.$last_year);
if (have_posts()):
    while (have_posts()) : the_post();
       the_title();
       the_excerpt();
    endwhile;
endif;
?>

列出即將發(fā)布的帖子

列出即將發(fā)布的帖子,以鼓勵用戶將來訪問你的博客。

<?php query_posts('showposts=10&post_status=future'); ?> 
<?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
    <h2><?php the_title(); ?></h2> 
    <span class="datetime"><?php the_time('j.F Y'); ?></span></p> 
<?php endwhile; 
else: ?><p>沒有安排未來的帖子。</p> 
<?php endif; ?>

顯示最新置頂帖子

如果你想只顯示最新的置頂帖,可以參考下面的代碼:

<?php
$sticky = get_option('sticky_posts');
rsort( $sticky );
$sticky = array_slice( $sticky, 0, 5);
query_posts( array( 'post__in' => $sticky, 'caller_get_posts' => 1 ) );

if (have_posts()) :
    while (have_posts()) : the_post();
        the_title();
        the_excerpt();
    endwhile;
endif;
?>

制作存檔頁面

存檔頁面是你之前發(fā)布的帖子的集合。為你的網頁訪問者輕松顯示過去的熱門帖子。要創(chuàng)建它,參考下面的代碼:

<?php
/*
Template Name: MyArchives
*/
?>
<?php get_header(); ?>
  <h2><?php $numposts = $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->posts WHERE post_status = 'publish'");
if (0 < $numposts) $numposts = number_format($numposts); ?>
<h2><?php echo $numposts.' recipes published since January 01, 2024'; ?>
  </h2>
  <ul id="archive-list">
    <?php
    $myposts = get_posts('numberposts=-1&');
    foreach($myposts as $post) : ?>
      <li><?php the_time('m/d/y') ?>: <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
    <?php endforeach; ?>
  </ul>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

了解 WordPress 查詢循環(huán)塊

WordPress 循環(huán)最重要的更新之一是引入了查詢循環(huán)塊。讓我們了解它是什么以及如何使用它。

圖片[3]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

什么是查詢循環(huán)塊

WordPress 查詢循環(huán)塊在 WordPress 5.8 中引入,是對基本循環(huán)功能的強大補充。古騰堡編輯器使用它來在你的網站上顯示帖子。

使用 WordPress 查詢循環(huán)塊,你可以創(chuàng)建復雜且具有視覺吸引力的WordPress 帖子格式,以特定順序顯示內容。可以應用各種過濾器,例如類別、標簽或日期。

如何在 WordPress 中使用查詢循環(huán)塊

要添加查詢循環(huán)塊,在塊編輯器中打開或添加新的 WordPress 帖子:

圖片[4]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

進入編輯器后,選擇塊插入器“+”圖標:

圖片[5]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

搜索查詢query并單擊它

圖片[6]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

一個新的查詢循環(huán)塊將添加到你的帖子中?,F在,檢查以下部分以進行自定義。

自定義查詢循環(huán)塊

每當添加新的查詢循環(huán)塊時,你都會看到兩個選項:

圖片[7]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

“選擇”選項允許你在各種不同的模式之間進行選擇。只需選擇一個喜歡的即可

圖片[8]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

每個查詢循環(huán)塊都由各種嵌套塊組成,例如帖子標題或摘錄。如果你想知道查詢循環(huán)塊中使用了哪些塊,請打開文檔概述工具。在這里你將看到所有嵌套塊并能夠在它們之間導航:

圖片[9]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應
  • 開始空白

開始空白選項中,您將看到各種模板。選擇你喜歡的一個。在此示例中,我們將添加帶有帖子標題和摘錄的模板:

圖片[10]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

添加查詢循環(huán)塊后,你可以使用塊工具欄或塊設置部分對其進行自定義。

  • 塊工具欄

塊工具欄是自定義 WordPress 上任何塊(包括查詢塊)的主要工具。

圖片[11]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

在這里,你可以將查詢循環(huán)轉換為列或組塊、在編輯器中移動它、調整對齊方式或更改默認視圖。最值得注意的選項是顯示設置替換

圖片[12]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

顯示設置允許你選擇要顯示的 WordPress 帖子數量,以及設置在顯示首選內容之前應跳過其中的數量。

圖片[13]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

如果你沒有看到顯示設置,請確保在“塊設置”部分中禁用從模板繼承查詢選項。

另一個有用的 WordPress 功能是Replace。有了它,你可以輕松地將當前模式替換為任何其他模式:

圖片[14]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應
  • 區(qū)塊設置

其他重要的塊設置可以通過單擊編輯器右上角的“設置”按鈕找到:

圖片[15]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

查詢循環(huán)塊不僅允許你定制帖子的顯示布局、應用過濾器或添加自定義CSS類,還支持分頁功能,這在管理內容豐富的網站時尤其有用。

當你的網站包含大量帖子時,通過分頁,查詢循環(huán)塊能在多個頁面上展示這些帖子。這樣的設置幫助訪問者通過頁碼輕松導航你的博客:

圖片[16]-如何高效使用wordpress循環(huán)與查詢循環(huán)塊優(yōu)化網站內容展示-光子波動網 | 專業(yè)WordPress修復服務,全球范圍,快速響應

結論

WordPress 循環(huán)是一個強大的工具,它允許開發(fā)者在網站上有效地展示帖子和頁面內容。通過使用基本的循環(huán)結構和各種條件標簽,開發(fā)者可以根據頁面類型或特定條件來定制內容的顯示。WordPress 循環(huán)可以使任何網站受益,因為它安排了顯示帖子的方式,提高了訪問者的瀏覽體驗。。


聯(lián)系我們
教程看不懂?聯(lián)系我們?yōu)槟赓M解答!免費助力個人,小企站點!
客服微信
客服微信
電話:020-2206-9892
QQ咨詢:1025174874
郵件:info@361sale.com
工作時間:周一至周五,9:30-18:30,節(jié)假日休息
? 轉載聲明
本文作者:xiesong
THE END
喜歡就支持一下吧
點贊0 分享
評論 搶沙發(fā)

請登錄后發(fā)表評論

    暫無評論內容