使用jQuery和WP_Query實作選項卡內容

Wordpress 提供了大量有關您的部落格及其內容的資訊。顯示大量此類資訊可能會佔用空間。一個很棒的解決方案是選項卡式內容！

在本教程中，我們將採用先前使用的 WordPress 報紙佈局並使用選項卡對其進行擴展。

#前言

對！我們將使用 jQuery 動畫和 .bind 函數的良好且強大的組合，與 Wordpress 的多功能 WP_Query() 和 Wordpress 獨有的條件標記完美混合。如果您像我一樣，您喜歡在做任何事情之前先看到成品：

#如果您只想僅學習本教程，則本教程需要最新版本的 jQuery。在這裡下載。否則，它應該已經包含在我準備好的主題中，您可以在這裡下載：myTheme。

我們假設您已經安裝了即時 WordPress，無論是本機安裝還是託管安裝。這裡有關於在 Windows 上本地運行 Wordpress 的教程，這裡有關於 OS X 的教程。啟動我之前準備的主題 - myTheme - 將會有很大幫助。我們將對此進行擴展，因此打開 index.php 並開始編輯！

第 1 步 - 新的結構 HTML。

顯然，我們需要一些新的 HTML。這很簡單。我們只需要一些額外的 div 來包裝我們正在使用的所有內容。將以下程式碼僅放在

上方：

<div id="container">
	<div id="header">
		<h1>iBlog - Wordpress and jQuery together in <em>Harmony.</em></h1>
	</div>
		

並且我們需要在結束

以上是使用jQuery和WP_Query實作選項卡內容的詳細內容。更多資訊請關注PHP中文網其他相關文章！