用博客日志的主循環(huán)(The Loop)是 WordPress 中最重要的 PHP 代碼集,幾乎所有的頁面都會用到它。
下面就讓我們來開始學(xué)習(xí)wordpress主循環(huán)(The Loop)在模板中的應(yīng)用。
打開 Xampp,“tutorial”主題文件夾,瀏覽器,并且在瀏覽器中轉(zhuǎn)到
http://localhost/wordpress,最后打開 index.php 文件。
下面應(yīng)該是這時候 index.php 文件中的內(nèi)容:
記住,為了學(xué)習(xí)這些代碼,請盡量手工輸入而不是拷貝和粘貼。
第1步:創(chuàng)建 container Div
在 header DIV 標(biāo)簽下添加一個 DIV 標(biāo)簽,并給它的 ID 賦值為 “container”,如下:
<div id=”container”>
</div>
“container” 這個 DIV 標(biāo)簽是把博客的主要內(nèi)容和其他東西都區(qū)分開,比如 sidebar 和 footer 等。
第2步:輸入主循環(huán)代碼
在 Container 的 DIV 標(biāo)簽中添加如下代碼:
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
<?php endwhile; ?>
<?php endif; ?>
這段代碼就是 WordPress 中的主循環(huán)(The Loop)。在詳細(xì)解釋這些代碼的作用之前,我們來看下現(xiàn)在 index.php 所包含的代碼:
你可能已經(jīng)注意到Container DIV 中的每一行都被縮進(jìn)了,這是為了更好的組織代碼,更加利于閱讀(使用 tab 健而不是空格鍵進(jìn)行代碼縮進(jìn),)。
剛才發(fā)生了什么?
- if(have_posts()) – 檢查博客是否有日志。
- while(have_posts()) – 如果有日志,那么當(dāng)博客有日志的時候,執(zhí)行下面 the_post() 這個函數(shù)。
- the_post() – 調(diào)用具體的日志來顯示。
- endwhile; – 遵照規(guī)則 #1,這里用于關(guān)閉 while()
- endif; – 關(guān)閉 if()
- 注釋:并不是所有的代碼都需要兩部分用來打開和關(guān)閉。有些代碼能夠自我關(guān)閉,這就解釋了 have_posts() 和 the_post(); 這兩個函數(shù)。因為 the_post(); 在 if() 和while() 的外面,只需要分號去結(jié)束或者關(guān)閉。
第3步:調(diào)用日志標(biāo)題
在前面的課程中,我們學(xué)習(xí)了使用 bloginfo(‘name’) 去調(diào)用博客的標(biāo)題?,F(xiàn)在我們將學(xué)習(xí)在主循環(huán)(The Loop)中如何調(diào)用日志標(biāo)題。
在 the_post(); ?> 的后面和 <?php endwhile; ?> 的前面輸入 <?php the_title(); ?>
保存 index.php 文件并未刷新瀏覽器,這時候應(yīng)該看到在博客描述的下方出現(xiàn) Hello World ,默認(rèn)安裝 WordPress 之后,博客只有一篇日志。而我的測試的博客有多篇日志,所以這里有多個日志標(biāo)題,而且因為我所用的日志標(biāo)題是一樣的,我也沒有進(jìn)行組織整理他們,所以它們看起來像很長的一行 Hello World。
第4步:給日志標(biāo)題加上鏈接
把日志標(biāo)題轉(zhuǎn)變成日志標(biāo)題鏈接。還記得怎樣把博客的標(biāo)題轉(zhuǎn)變成一個鏈接的?
在<?php the_title(); ?> 兩邊增加 <a href=”#”> 和 </a>。
保存并刷新你的瀏覽器?,F(xiàn)在日志的標(biāo)題都變成了鏈接了,但是它們并沒有指向哪里。為了使得每個標(biāo)題都能指向正確的日志,我們需要把 # 替換為the_permalink()。
<a href=”<?php the_permalink(); ?>“><?php the_title(); ?></a>
the_permalink() 是用來調(diào)用每篇日志地址的 PHP 函數(shù)。保存并刷新瀏覽器。
如果只有一個 Hello World 標(biāo)題,把鼠標(biāo)移到鏈接上面,觀察你的瀏覽器底部的狀態(tài)欄,他不再是
http://localhost/wordpress/#。
如果有不止一個的標(biāo)題鏈接,我們將看到每個鏈接會鏈到不同的日志或者網(wǎng)頁。但是我們的日志標(biāo)題依然在同一行上面。為了分開它們,在日志標(biāo)題鏈接代碼的兩邊添加<h2> 和 </h2> 標(biāo)簽。
<h2><a href=”<?php the_permalink(); ?>”><?php the_title(); ?></a></h2>
記住 H1 用作你的博客的標(biāo)題,那是網(wǎng)頁的標(biāo)題。H2 被用作子標(biāo)題?,F(xiàn)在你的日志標(biāo)題鏈接是子標(biāo)題了,每一個都是一行字。保存 index.php 文件并刷新瀏覽器,結(jié)果如下:
WordPress 主循環(huán)就介紹到這里,現(xiàn)在 index.php 文件內(nèi)容應(yīng)該是:
未經(jīng)允許不得轉(zhuǎn)載:445IT之家 » WordPress主題開發(fā)教程六:主循環(huán)(The Loop)