Header 模板是從零開端創立 WordPress 主題系列教程的第四篇。前面我向你解説瞭如何裝置和啓動 XAMPP,裝置 WordPress 主題以及引見了 PHP 言語的最根本言語,這篇我們將繼續 PHP 並學習如何調用博客的標題和鏈接。
儘量輸入一切代碼而不是直接拷貝我給你的代碼,這樣能夠讓你儘量記住你所學到的的。
第 1 步:翻開 XAMPP 和主題文件夾。
翻開 Xampp,然後翻開上次創立的主題文件夾,xampp/htdocs/WordPress/wp-content/themes/tutorial 。我們應該看到上次創立的兩個文件:index.php 和 style.css 。
index.php 和 style.css 文件的內容應該和 index.txt 和 style.txt 分歧。
第 2 步:翻開 index.php
翻開閲讀器,轉到 http://localhost/WordPress 。由於上次裝置了一個空白的主題,這時我們應該看到一個空白的頁面。
返回主題文件夾並翻開 index.php 文件。
到目前為止,我們曾經翻開了主題文件夾,閲讀器和 index.php 文件。
第 3 步:調用博客標題
編輯 index.php 文件。在 和 這兩個標籤之間輸入 <?php bloginfo(『name』); ?>,然後保管它。
返回到閲讀器並刷新。這時分我們應該可以看到博客的標題。博客的標題是 Demo Theme Development 。
我們在網頁的主體 (body) 之間參加了一行 PHP 代碼到 index.php 。 bloginfo() 是調用博客的信息的函數。其中參數 name 代表了它調用的是博客的標題。這個名字是在 option 頁面中設置的 Weblog Title 。
<?php – 開端 PHP 代碼
bloginfo(『name』) – 調用博客信息,詳細是博客的標題。
; – 完畢調用博客信息
?> – 完畢 PHP 代碼
每次我們在 index.php 文件中增加或者更改任何東西之後,都能夠保管,然後刷新頁面去查看結果。
第 4 步:調用博客鏈接
調用了博客的標題之後,接下來就要把博客的標題放入超鏈接中,這時分需求一個 XHTML 標籤。
返回 index.php 文件。
在同一行增加 和 。此時新行的代碼應該是:
<?php bloginfo(『name』); ?>
返回到閲讀器,刷新,然後就能夠看到博客的標題變成了鏈接。
如今它是一個鏈接,但是它沒有鏈接到哪裏。由於這個是博客的標題,我們應該讓它鏈接到首頁。為此,在 href=後的雙引號中輸入 <?php bloginfo(『url』); ?>
保管,如今的代碼應該是:
<a href=」<?php bloginfo(『url』); ?>」><?php bloginfo(『name』); ?>
返回到閲讀器,刷新,當鼠標在鏈接上面的時分,閲讀器的狀態欄應該顯現 http://localhost/WordPress
如今點擊這個鏈接,它就會讓我們返回首頁。可能如今看到還是是相同的頁面,但是用 # 或者 http://localhost/WordPress 作為鏈接地址是完整不一樣的。在接下來的課程我們會學到到他們之間的不同。
方才發作什麼了?
我們把網站名字變成了鏈接,並使它鏈接到博客的主頁。
bloginfo(『url』) – 調用博客根本信息,詳細是首頁的的地址或者 URL
– 是一個用於添加鏈接的 XHTML 標籤
– 鏈接的完畢標籤。否則網頁將不曉得哪裏完畢鏈接,這樣會使得頁面接下來的內容全部都變成鏈接。還記得規則 #1 嗎?正確關閉翻開的一切標籤。
href=」」 – 超文本的簡寫。在引號之間就是它的值。
最終代碼為:
<a href=」<?php bloginfo(『url』); ?>」><?php bloginfo(『name』); ?>
意義為:開端一個鏈接,鏈接的地址是博客的 URL,用 PHP 函數 bloginfo(『url』) 去調用這個地址或者 URL 。這個鏈接的文本是博客的標題並運用 PHP 函數 bloginfo(『name』) 去調用博客的標題。最後完畢鏈接。
這篇主要引見了 WordPress 主題的 XHTML 代碼,下一篇我們將繼續 Header 模板。