WordPress 模板文件極簡(jiǎn)教程

安裝完了WordPress，發(fā)現(xiàn)一個(gè)很不錯(cuò)的主題，接著又安裝了一些必需的插件，可是最后，你還想個(gè)性化一下自己的博客外觀。 你想更改版權(quán)文字，想添加自定義header圖片，還想改下文章的標(biāo)題字體，總之，你總覺(jué)得還有很多地方有待改進(jìn)。

要實(shí)現(xiàn)這些效果，最好的方法當(dāng)然是快速更改模板文件里的一些變量。WordPress管理后臺(tái)的外觀>編輯菜單下就是一個(gè)主題編輯器。可是對(duì)不懂代碼的人來(lái)說(shuō)， 編輯器下的那些文件就像天書一樣。

不過(guò)請(qǐng)別灰心。只要你肯多花點(diǎn)時(shí)間來(lái)研究，即使不懂編程，你也可以對(duì)自己的主題做些小小的修改。

主題編輯器的右邊是一條模板文件列表。 列表被分為兩部分： 模板文件和樣式表。 大多數(shù)情況下，樣式表版塊里只有一個(gè)文件，這個(gè)文件里包含了主題的所有視覺(jué)元素屬性。 在這里你可以對(duì)標(biāo)題字號(hào)大小、段落間距、背景顏色以及幾乎其它所有博客版面進(jìn)行修改。

修改博客版面上的設(shè)計(jì)元素

看著面前的CSS代碼，作為新手的你需要從哪里入手呢？ 乍一眼看去，這些代碼的確很復(fù)雜，但是你可以利用Firefox插件Firebug更直觀地進(jìn)行查看。 安裝Firebug只需要幾分鐘，但之后它可以幫你減少很多麻煩。

首先打開(kāi)Firefox瀏覽器，進(jìn)入firebug主頁(yè)，點(diǎn)擊“Download”安裝Firebug插件。 重啟Firefox瀏覽器，然后打開(kāi)博客頁(yè)面。 我們先從標(biāo)題開(kāi)始。 右擊標(biāo)題并選擇“查看元素”，你會(huì)看到瀏覽器下方出現(xiàn)了一個(gè)工具條。

你可以看見(jiàn)，工具條里有一行被高亮顯示的代碼。 工具條分左右兩部分，左側(cè)是標(biāo)題標(biāo)簽的HTML代碼，我們暫且跳過(guò)。 右側(cè)就是定義標(biāo)題標(biāo)簽樣式的CSS代碼了。 首先來(lái)觀察一下右側(cè)的代碼：

怎樣？ 這段代碼看起來(lái)還算容易理解吧？ Font size和font weight意思相近，都是對(duì)字體屬性的描述。 。 這里的標(biāo)題字體大小為18，稍后你可以更改這個(gè)數(shù)值。注意這里的標(biāo)題： “h2.postTitle a”。 這是CSS文件對(duì)你的標(biāo)題的定義。

接下來(lái)回到博客后臺(tái)的主題編輯器，在style.css文件中查找“h2.postTitle a”。

生活不易，碼農(nóng)辛苦
如果您覺(jué)得本網(wǎng)站對(duì)您的學(xué)習(xí)有所幫助,可以手機(jī)掃描二維碼進(jìn)行捐贈(zèng)