WordPress 主題製作學習筆記：幫你的主題加上「文章導航」的功能

相信有許多使用 WordPress 的朋友們對於這個文章導航的功能都不陌生，而過去我們通常是安裝 Breadcrumb Navigation XT 這款插件來達成這個功能，但近年來有許多 WordPress 使用者們都逐漸減少了插件的使用。因為安裝啟用的插件越多，對於主機造成的負擔就越大，嚴重地甚至會大大拖慢部落格開啟的速度（當然，過度使用加載 js 也是會造成這樣的後果）。

所以這回要跟大家分享的是幫你的主題加上自帶文章導航的功能，實現這個功能後，你就可以完全脫離 Breadcrumb Navigation XT 插件，少裝一個插件，讓你的 WordPress 速度加快飛起來！

我先將我的文章導航代碼貼出來，再跟各位解釋其中的原理。

<div class="breadcrumb-nav">
	<a title="返回首頁" href="<?php echo get_settings('home'); ?>/">首頁</a> > <?php the_category(', '); ?> > <?php the_title(); ?>
</div>

<?php echo get_settings('home'); ?> // 這裡代表的是，我們要呼叫首頁的鍊結網址
<?php the_category(', '); ?> // 這裡代表我們要調用文章的分類鍊結
<?php the_title(); ?> // 這裡代表我們要調用該篇文章的標題鍊結

那為何我又用了 breadcrumb-nav 這樣的 div class 包住呢？那是因為我們必須在主題的 CSS 裡面定義這個區塊（DIV）的樣式，給文章導航一個特定的 class 方便你日後修改樣式表。以下是 SO Personal 的文章導航樣式，如果要運用在你的主題裏，請自行更改樣式，這裡的樣式僅提供參考：

.breadcrumb-nav{
	background: #EFF8FF;
	border: 2px solid #21BEDE;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: #4f4f4f;
	margin: 10px;
	padding: 10px;
}

文ｂｙ覺非／WordPress 主題製作學習筆記系列文章．之三

<========簽名檔分隔線開始=========>

　飛翔於文字國裏的蝴蝶，我是愛寫文的女子，不要看我的人，請你看看我的文，那裡面全是我的心．和我想對你說的話……

　StartOver．回。到。原。點 http://blogs.carrielis.com

<========簽名檔分隔線結束=========>