Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
柏拉圖廳_6WordPress初學者世界-佈景主題結構概念談_林大中 / Barry Lin
Search
WordCamp Taipei
December 28, 2019
Technology
0
190
柏拉圖廳_6WordPress初學者世界-佈景主題結構概念談_林大中 / Barry Lin
使用 WordPress 架設網站,無論您是套用版型或是客製化佈景,都要先瞭解佈景主題的結構,在開發或是維護網站上才能快速查詢問題的來源,進而深入佈景相關問題的方向與處理方式
WordCamp Taipei
December 28, 2019
Tweet
Share
More Decks by WordCamp Taipei
See All by WordCamp Taipei
如何運用 WordPress 網站經營讓你的關鍵字在網路搜尋無所不在 / Utilizing Keywords to Improving WordPress SEO_蔡沛君 / PG Tsai
wctaipei
0
160
WordPress 基本安全性檢測與防範方式 / WordPress Security Check and How to Prevent Them_呂明璋 / John Lu
wctaipei
0
600
Troubleshooting WooCommerce Subscriptions Renewal_Siew Kam Onn / 蕭錦安
wctaipei
0
120
網路爬蟲與 WordPress 防禦機制 / Anti-scraping and WordPress Security Defence_Terry Lin
wctaipei
0
560
404 Not found 遇得多;402 有見過麼?探討現有的網上內容流通性和網頁的收入模式。 / “404 Not Found” is Common, But Have You Seen “402 Payment Required”?_高重建 / Kin Ko
wctaipei
0
200
新手也能透過 WooCommerce 架出百萬電商(實際案例分享)/ Real World Building WooCommerce Site for Beginners_廖震宇 / Andy Liao
wctaipei
0
510
我的 WordPress 全端優化經驗 / Complete Guide of Optimizing WordPress_蕭宗仁 / Josh Hsiao
wctaipei
0
150
攝影師的子彈 – 圖片 SEO 戰爭 / Photographer’s Bullet – Image SEO War_Edwin Lin
wctaipei
0
490
國際電商都在用的心理行銷,你還不知道嗎? / The Psychology Behind eCommerce_林文攀 / Peter Lin
wctaipei
0
290
Other Decks in Technology
See All in Technology
UDDのススメ - 拡張版 -
maguroalternative
1
620
信頼できる開発プラットフォームをどう作るか?-Governance as Codeと継続的監視/フィードバックが導くPlatform Engineeringの進め方
yuriemori
1
200
薬屋のひとりごとにみるトラブルシューティング
tomokusaba
0
390
Agent Development Kitで始める生成 AI エージェント実践開発
danishi
0
160
[OCI Technical Deep Dive] OCIで生成AIを活用するためのソリューション解説(2025年8月5日開催)
oracle4engineer
PRO
0
120
LLM 機能を支える Langfuse / ClickHouse のサーバレス化
yuu26
9
2.7k
Amazon Bedrock AgentCore でプロモーション用動画生成エージェントを開発する
nasuvitz
2
130
Amazon GuardDuty での脅威検出:脅威検出の実例から学ぶ
kintotechdev
0
130
マルチプロダクト×マルチテナントを支えるモジュラモノリスを中心としたアソビューのアーキテクチャ
disc99
1
660
Mackerel in さくらのクラウド
cubicdaiya
1
310
datadog-distribution-of-opentelemetry-collector-intro
tetsuya28
0
120
AIは変更差分からユニットテスト_結合テスト_システムテストでテストすべきことが出せるのか?
mineo_matsuya
5
2.6k
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1031
460k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
Practical Orchestrator
shlominoach
190
11k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.4k
Intergalactic Javascript Robots from Outer Space
tanoku
272
27k
Docker and Python
trallard
45
3.5k
Raft: Consensus for Rubyists
vanstee
140
7.1k
Balancing Empowerment & Direction
lara
2
570
Testing 201, or: Great Expectations
jmmastey
45
7.6k
Facilitating Awesome Meetings
lara
55
6.5k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Transcript
WordPress 初學者世界 佈景結構概念談! Theme Hierarchy for Beginners WordCamp Taipei 2019
林林⼤大中 / Barry Lin 阿腸股份有限公司 - ⼯工程師 Facebook: fb.me/riceooks Blog:
barryblogs.com Company: achang.tw
⽬目錄錄⼤大綱 WordPress 佈景佈局檔案結構 佈景⽬目錄錄資料料夾 佈景資料料夾檔案 佈景主題資訊 Template Hierarchy (佈景層次) 佈景結構層次介紹
- 以⾸首⾴頁為例例 佈景結構視覺圖 佈景結構層次介紹 - 常⾒見見的變化類類型 佈景佈局檔案概念 佈景檔案結構 - 簡易易範例例 分類類、⽂文章、⾴頁⾯面
WordPress 佈景佈局檔案結構 佈景⽬目錄錄資料料夾 佈景資料料夾佈局檔案 佈景主題資訊 4
佈景⽬目錄錄資料料夾 佈景佈局檔案結構
佈景資料料夾檔案 佈景佈局檔案結構 style.css (必要) • 佈景主題的樣式 index.php (必要) • 佈景主題層次結構的最終載⼊佈局檔案
functions.php • 佈景主題的⾃訂功能佈局檔案 • 在所有外掛之後才會執⾏ • ⼦佈景的此佈局檔案,會在主佈景之前 執⾏ screenshot.png • 佈景主題的視覺圖案 • 尺⼨最⼤為 1200x900
佈景主題資訊 佈景佈局檔案結構 Theme Name: 佈景名稱 Theme URI: 佈景資訊網址 Author: 作者
Author URI: 作者網址 Description: 佈景描述 Version: 版本號,例如 1.2.1 License: 授權條款 License URI: 授權條款網址 Text Domain: 本地化使⽤的字串載⼊分類 Tags: 佈景相關的標籤,可查詢 Theme Review Handbook 參考使⽤標籤 Domain Path: 佈景主題未啟⽤時,本地 化的載⼊路徑,預設為 /languages Main Stylesheet https://pse.is/WP-main-stylesheet Theme Review Handbook https://pse.is/WP-theme-tags
None
Template Hierarchy (佈景層次) 佈景結構層次介紹 - 以⾸首⾴頁為例例 佈景結構層次介紹 - 常⾒見見的變化類類型 9
佈景結構層次介紹 Template Hierarchy Template Hierarchy https://pse.is/WP-template-hierarchy Template Hierarchy Diagram https://pse.is/WP-hierarchy
佈景結構層次介紹 - 以⾸首⾴頁為例例 Template Hierarchy 主⾴頁 / ⾸首⾴頁 網站⾸首⾴頁顯示內容 *最新⽂文章
front-page.php > home.php > index.php *靜態⾸首⾴頁(已有選定⾴頁⾯面) front-page.php > page.php > index.php
None
佈景結構層次介紹 - 常⾒見見的變化類類型 Template Hierarchy 分類類 category-{slug}.php > category-{id}.php >
category.php > archive.php > index.php 代稱 > 編號 > 分類類佈局檔案 > 彙整佈局檔案 > 索引佈局檔案 單篇⽂文章 single-{post-type}-{slug}.php > single-{post-type}.php > single.php > singular.php > index.php ⽂文章類類型+代稱 > ⽂文章類類型 > 單篇⽂文章佈局檔案 > 單獨佈局檔案 > 索引佈局檔案 ⾴頁⾯面 custom template file > page-{slug}.php > page-{id}.php > page.php > singular.php > index.php ⾃自訂⾴頁⾯面模板 > 代稱 > 編號 > ⾴頁⾯面佈局檔案 > 單獨佈局檔案 > 索引佈局檔案 標籤 tag-{slug}.php > tag-{id}.php > tag.php > singular.php > index.php 代稱 > 編號 > 標籤佈局檔案 > 彙整佈局檔案 > 索引佈局檔案
佈景結構層次介紹 - 常⾒見見的變化類類型 Template Hierarchy 作者 author-{nicename}.php > author-{id}.php >
author.php > archive.php > index.php Nicename > 編號 > 作者佈局檔案 > 彙整佈局檔案 > 索引佈局檔案 ⽇日期 date.php > archive.php > index.php ⽇日期佈局檔案 > 彙整佈局檔案 > 索引佈局檔案 404 404.php > index.php 404佈局檔案 > 索引佈局檔案 附件 {MIME-type}.php > attachment.php > single-attachment-{slug}.php > single-attachment.php > single.php > singular.php > index.php 附件類類型 > 附件佈局檔案 > 代稱 > 單篇附件佈局檔案 > 單篇⽂文章佈局檔案 > 單獨佈局檔案 > 索 引佈局檔案
佈景佈局檔案概念 佈景檔案結構 - 簡易易範例例 分類類 ⽂文章 ⾴頁⾯面 15
佈景檔案結構 - 簡易易範例例 佈景佈局檔案概念 *⼀一開始建⽴立的檔案 funcitons.php index.php screenshot.png style.css *增加的檔案
front-page.php footer.php header.php languages/ *後續補上的主要模板檔案 404.php archive.php search.php singular.php
分類類 / 結構說明 佈景佈局檔案概念 分類類層次結構 category-{slug}.php > category-{id}.php > category.php
> archive.php > index.php
分類類 / 建⽴立分類類 佈景佈局檔案概念
分類類 / 建⽴立⽂文章並歸類類該分類類 佈景佈局檔案概念
分類類 / 分類類代稱 為名稱的佈局 category-{slug}.php 佈景佈局檔案概念
分類類 / 議程分類類呈現結果 佈景佈局檔案概念
分類類 / 講者分類類呈現結果 佈景佈局檔案概念
⽂文章 / 結構說明 佈景佈局檔案概念 單篇⽂文章 single-{post-type}-{slug}.php > single-{post-type}.php > single.php
> singular.php > index.php
⾴頁⾯面 / 結構說明 佈景佈局檔案概念 ⾴頁⾯面 custom template file > page-{slug}.php
> page-{id}.php > page.php > singular.php > index.php
⾴頁⾯面 / ⾃自訂⾴頁⾯面佈局 {$custom}.php 佈景佈局檔案概念 *⾃自訂⾴頁⾯面佈局檔案,可放置於「佈景根⽬目錄錄」或「佈景下⼀一層資料料夾內」,最多⼀一層 *⾴頁⾯面佈局放置之資料料夾名稱可⾃自訂,資料料夾名稱不不影響結構
⾴頁⾯面 / ⾃自訂⾴頁⾯面佈局 檔案內容 佈景佈局檔案概念 ⾃自訂⾴頁⾯面的檔案中,必須要含有「Template Name: {佈局名稱}」的 PHP 註解,才會是系統可辨識的佈局
⾴頁⾯面 / 套⽤用⾃自訂⾴頁⾯面佈局 佈景佈局檔案概念
⾴頁⾯面 / ⾃自訂⾴頁⾯面佈局結果 佈景佈局檔案概念
- Thank You - 29