佈景主題theme的檔案結構

Andy 0

WordPress擁有大量的佈景主題,成為許多人喜歡WordPress的原因之一,結構上看,佈景主題可以說是WordPress前端的命脈,大多數有關版型跟前端呈現的設定,都在佈景主題的程式檔案之中。

這是官方佈景主題2021解壓縮之後的檔案結構

一個佈景主題的檔案包裡面,有分為幾個部分,第一個部分是主程式的部分,串接了後台系統,自訂的介面等等功能,還有後臺所需要的基礎CSS跟一些基礎的設定,這在一般狀況下是不需要去更動的。

而另外一個部分就是控制前端呈現的部分,分為php跟css,php檔案的部分主要決定了框架,基礎還是HTML架構,但是會利用php傳遞與抓取資訊,建立整體的資料結構,而結構之外的設定就是CSS決定,而最基礎的CSS設定檔案就是在style.css。

關於前端的結構,大致上大家都差不多,這也是WordPress的預設網頁區塊結構,相關檔案依序是。

  • page.php 通常是決定一般頁面的「內容」區塊,這個檔案可以打開看看,沒有什麼內容,因為程式只是設定去抓取對應的資料。
  • header.php 網站的header都會在這裡定義,但是根目錄的檔案決定了最基礎的header結構,詳細還是要到別的地方設定。
  • single.php 單篇文章的結構。
  • footer.php 頁尾的結構。
  • archive.php 文章分類頁面的結構設定。

而除了根目錄的檔案,很多會把真正的設定寫在template-parts這個資料夾內

這邊的資料夾內就分別定義了內容、摘要、頁尾、頁首、文章的呈現架構。

function.php

佈景主題內有一個檔案很重要,就是function.php這個檔案,裡面定義了非常多的功能結構,而這個檔案也是我們有時候會動到的檔案。

在學習wordpress的路途上,可能看到類似的教學程式碼,結構長成這樣

function name()
{
  程式內容
}
addfilter(指令,name);

這樣程式碼就是透過佈景主題,去更改網站的一些功能,預設的function檔案內容寫什麼不是太過重要,除非自己想開發佈景主題或是想多深入了解可以去研究,我們在找網路上的解決方案時,看到類似的程式碼,就直接加入到這個檔案的最後面,就可以完成需求了。

當然也有一些外掛可以協助插入這些程式碼,這樣可以避開直接修改佈景主題檔案的部分,這是一個解決方案,但是當在製作網站到一個程度的時候,「減法思考架站」就變得很重要,能夠用程式碼解決的事情,就不要用外掛來解決,那麼要如何不更動到佈景主題主要內容程式又加上自己的程式碼呢?

下一篇,來介紹子主題!

Andy

現職橡實網頁設計工程師,經歷了近十年的CMS開發經驗,走向減法思考的WordPress玩家,期望用最乾淨的程式,最少的外掛,解決最多的問題!

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *