WordPress 主題開發教程六：主迴圈（The Loop）

用部落格日誌的主迴圈（The Loop）是 WordPress 中最重要的 PHP 程式碼集，幾乎所有的頁面都會用到它。
下面就讓我們來開始學習 WordPress 主迴圈（The Loop）在模板中的應用。

開啟 Xampp，「tutorial」主題資料夾，瀏覽器，並且在瀏覽器中轉到 http://localhost/WordPress，最後開啟 index.php 檔案。

下面應該是這時候 index.php 檔案中的內容：

記住，為了學習這些程式碼，請儘量手工輸入而不是複製和貼上。

第 1 步：建立 container Div

在 header DIV 標籤下新增一個 DIV 標籤，並給它的 ID 賦值為「container」，如下：

<div id=」container」>

</div>

「container」這個 DIV 標籤是用把部落格的主要內容和其他東西都區分開，比如 sidebar 和 footer 等。

第 2 步：輸入主迴圈程式碼

在 Container 的 DIV 標籤中新增如下程式碼：

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

<?php endwhile; ?>

<?php endif; ?>

這段程式碼就是 WordPress 中的主迴圈（The Loop）。在詳細解釋這些程式碼作用之前，我們來看下現在 index.php 所包含的程式碼：

你可能已經注意到 Container DIV 中的每一行都被縮排了，這是為了更好的組織程式碼，更加利於閱讀 (使用 tab 健而不是空格鍵進行程式碼縮排，) 。

剛才發生了什麼？

if(have_posts()) – 檢查部落格是否有日誌。
while(have_posts()) – 如果有日誌，那麼當部落格有日誌的時候，執行下面 the_post() 這個函式。
the_post() – 呼叫具體的日誌來顯示。
endwhile; – 遵照規則 #1，這裡用於關閉 while()
endif; – 關閉 if()
註釋：並不是所有的程式碼都需要兩部分用來開啟和關閉。有些程式碼能夠自我關閉，這就解釋了 have_posts() 和 the_post(); 這兩個函式。因為 the_post(); 在 if() 和 while() 的外面，只需要分號去結束或者關閉。

第 3 步：呼叫日誌標題

在前面的課程中，我們學習了使用 bloginfo('name') 去呼叫部落格的標題。現在我們將學習在主迴圈（The Loop）中如何呼叫日誌標題。

在 the_post(); ?> 的後面和 <?php endwhile; ?> 的前面輸入 <?php the_title(); ?>

儲存 index.php 檔案並重新整理瀏覽器，這時候應該看到在部落格描述的下方出現 Hello World ，預設安裝 WordPress 之後，部落格只有一篇日誌。而我的測試的部落格有多篇日誌，所以這裡有多個日誌標題，而且因為我所用的日誌標題是一樣的，我也沒有進行組織整理他們，所以它們看起來像很長的一行 Hello World 。

第 4 步：給日誌標題加上鍊接

把日誌標題轉變成日誌標題連結。還記得怎樣吧部落格的標題轉變成一個連結的？

在<?php the_title(); ?> 兩邊增加 <a href=」#」> 和 </a> 。

儲存並重新整理你的瀏覽器。現在日誌的標題都變成了連結了，但是它們並沒有指向哪裡。為了使得每個標題都能指向正確的日誌，我們需要把 # 替換為 the_permalink()。

the_permalink() 是用來呼叫每篇日誌地址的 PHP 函式。儲存並重新整理瀏覽器。

如果只有一個 Hello World 標題，把滑鼠移到連結上面，觀察你的瀏覽器底部的狀態列，他不再是 http://localhost/WordPress/#。

如果有不止一個的標題連結，我們將看到每個連結會鏈到不同的日誌或者網頁。但是我們的日誌標題依然在同一行上面。為了分開它們，在日誌標題連結程式碼的兩邊新增<h2> 和 </h2> 標籤。

<h2><a href=」<?php the_permalink(); ?>」><?php the_title(); ?></a></h2>

記住 H1 用作你的部落格的標題，那是網頁的標題。 H2 被用作子標題。現在你的日誌標題連結是子標題了，每一個都是一行。儲存 index.php 檔案並重新整理瀏覽器，結果如下：

WordPress 主迴圈就介紹到這裡，現在 index.php 檔案內容應該是：

WordPress 主題開發教程六：主迴圈（The Loop）