從 WordPress 的角色、安裝方式與目錄結構開始,建立後續主題與外掛開發所需的共同語言。
學習重點
- 理解 WordPress.org、WordPress.com 與 CMS 的差異
- 完成本機開發環境與 WordPress 安裝
- 辨識 wp-admin、wp-includes、wp-content 與 wp-config.php 的用途
實作任務
建立一個本機 WordPress 站台,完成基本設定並記錄主要目錄結構。
完成後你會
能獨立建立練習環境,並說明 WordPress 網站由哪些核心資料夾組成。
3 節觀念 + 實作
快速整理前端三大支柱,讓後續修改佈景主題與撰寫互動效果時有足夠基礎。
學習重點
- 使用語意化 HTML 組織頁面內容
- 用 CSS 控制排版、間距、色彩與響應式版面
- 以 JavaScript 監聽事件並操作 DOM
實作任務
製作一個單頁課程介紹區塊,包含標題、按鈕、卡片與簡單互動效果。
完成後你會
能讀懂佈景主題中的 HTML、CSS、JavaScript,並進行小幅修改。
3 節觀念
理解 jQuery 在 WordPress 生態中的常見用途,並學會用 AJAX 交換資料。
學習重點
- 使用 jQuery 選取元素、綁定事件與修改內容
- 理解 AJAX 請求、回應與非同步流程
- 認識 WordPress 前台互動常見寫法
實作任務
做出一個不用重新整理頁面的資料載入按鈕,觀察成功與錯誤狀態。
完成後你會
能維護舊有 jQuery 程式,並理解 WordPress 外掛常見的 AJAX 互動模式。
2 節觀念 + 實作
從佈景主題的安裝、啟用、客製化與區塊編輯器切入,建立主題操作能力。
學習重點
- 安裝與切換 WordPress 佈景主題
- 使用自訂器與站台編輯器調整版面
- 了解模板、樣式與內容之間的分工
實作任務
挑選一個佈景主題並完成首頁、選單、頁尾與基本視覺設定。
完成後你會
能用後台工具完成基礎網站外觀設定,並判斷何時需要進入程式層修改。
3 節操作
補齊 WordPress 開發所需 PHP 語法,涵蓋變數、流程控制、函式與 AI 輔助開發。
學習重點
- 掌握 PHP 變數、陣列、條件、迴圈與函式
- 讀懂 WordPress 主題與外掛中的 PHP 片段
- 使用 GitHub Copilot 輔助理解與產生程式碼
實作任務
撰寫一組 PHP 函式,輸出課程資料並用條件判斷控制顯示內容。
完成後你會
能閱讀 WordPress PHP 檔案,並撰寫小型功能片段。
6 節觀念 + 實作
從零建立自訂佈景主題,理解必要檔案、模板載入與子佈景主題的實務價值。
學習重點
- 建立 style.css、index.php、functions.php 等主題必要檔案
- 理解模板檔案如何組成前台頁面
- 使用 Child Theme 保留客製化修改
實作任務
建立一個最小可啟用佈景主題,加入文章列表與基本樣式。
完成後你會
能從空資料夾建立可運作的 WordPress 佈景主題骨架。
2 節實作
把 PHP 語法放回 WordPress 場景,理解 Loop、模板標籤與內容輸出流程。
學習重點
- 理解 WordPress Loop 與查詢結果輸出
- 使用常見模板標籤顯示文章資訊
- 認識物件導向在 WordPress 開發中的用途
實作任務
修改主題文章列表,加入分類、日期、摘要與條件式顯示。
完成後你會
能追蹤主題如何取得與顯示文章內容,並安全修改輸出邏輯。
3 節觀念 + 實作
進入完整主題製作流程,先處理版面拆分、樣式組織與基本模板。
學習重點
- 規劃主題版型與檔案結構
- 拆分 header、footer、sidebar 等共用模板
- 建立首頁與文章列表的主要版面
實作任務
將靜態 HTML 版面轉換成 WordPress 主題模板。
完成後你會
能把既有網頁切成 WordPress 主題可使用的模板結構。
2 節實作
延伸主題實作,加入 WP_Query、自訂頁面模板與更完整的內容呈現。
學習重點
- 使用 WP_Query 建立自訂文章列表
- 製作分類、單篇文章與頁面模板
- 處理分頁、查無資料與條件式版面
實作任務
建立一個課程文章列表頁,支援指定分類與分頁顯示。
完成後你會
能完成更接近真實專案需求的 WordPress 主題頁面。
3 節實作
認識 Underscores 與 Sage 等開發工具,理解現代主題開發流程。
學習重點
- 使用 Underscores 快速產生主題起始架構
- 理解 Sage 的現代化建置與模板概念
- 比較傳統主題與現代化工具鏈的取捨
實作任務
產生一份 starter theme,檢視其檔案分工並調整基本樣式。
完成後你會
能依專案規模選擇合適的主題開發起點。
2 節工具
從外掛檔頭、啟用流程、Hooks 機制開始,建立外掛開發的核心模型。
學習重點
- 建立可啟用的 WordPress 外掛
- 理解 Action 與 Filter 的差異
- 使用 Hook 修改文章內容或加入自訂行為
實作任務
製作一個在文章結尾自動加入提示文字的外掛。
完成後你會
能撰寫小型外掛,並知道如何把功能掛到 WordPress 執行流程。
3 節實作
學習在後台建立設定頁、保存選項,並用 Shortcode 將外掛功能放到前台。
學習重點
- 建立管理後台選單與設定頁
- 使用 Options API 儲存外掛設定
- 撰寫 Shortcode 輸出前台內容
實作任務
製作一個可在後台設定文字、再用短代碼輸出的提示區塊外掛。
完成後你會
能做出具備後台設定介面的 WordPress 外掛。
2 節實作
把外掛功能延伸到 Widget 與實用元件,練習較完整的功能封裝。
學習重點
- 規劃計數器外掛的資料與流程
- 建立可重複使用的小工具 Widget
- 處理前台顯示與後台設定欄位
實作任務
完成一個可放在側邊欄的統計或提示小工具。
完成後你會
能設計可安裝、可設定、可嵌入版面的功能型外掛。
3 節實作
學會建立自訂內容類型,讓 WordPress 不只管理文章,也能管理作品、商品或課程。
學習重點
- 理解 Custom Post Type 適用情境
- 用 register_post_type 建立自訂內容類型
- 設定後台欄位、網址與前台顯示
實作任務
建立一個「課程」或「作品」CPT,並在前台列出資料。
完成後你會
能把 WordPress 擴充為符合專案需求的內容管理系統。
2 節實作
以商品列表作為整合專案,串起 CPT、後台欄位、資料儲存與前台輸出。
學習重點
- 規劃商品資料欄位與管理流程
- 儲存與讀取自訂欄位資料
- 建立商品列表與單一商品顯示
實作任務
完成一個可新增商品、填寫價格與描述、並在前台列表呈現的外掛。
完成後你會
能完成一個具備實務雛形的 WordPress 外掛專案。
3 節專案
收束課程,補充 WordPress 趨勢、備份搬站、安全維護與 ChatGPT 輔助開發方法。
學習重點
- 理解 WordPress 最新發展與區塊化趨勢
- 掌握網站備份、搬家與維護注意事項
- 使用 ChatGPT 協助除錯、產生範例與撰寫文件
實作任務
整理一份網站交付檢查表,並用 AI 協助產生維護說明。
完成後你會
能把開發技能轉化為可維護、可交付的 WordPress 專案流程。
3 節觀念
整理常見熱門外掛的用途、適用情境、選用準則與維運注意事項。
學習重點
- 認識頁面建構、SEO、安全、備份、快取、表單、電商等外掛類型
- 理解熱門外掛的優點與可能成本
- 建立外掛選用與更新前檢查流程
實作任務
選擇一個測試站,評估目前安裝外掛是否必要、是否重複、是否仍有維護。
完成後你會
能更有系統地選擇 WordPress 外掛,而不是只依安裝數決定。
5 節選用指南
深入說明 WooCommerce 的商品、購物車、結帳、金流、物流、訂單與開發模型。
學習重點
- 理解 WooCommerce 如何把 WordPress 擴充為線上商店
- 掌握商品類型、訂單狀態、金流物流與稅務設定
- 認識 WooCommerce hooks、商品物件與維運注意事項
實作任務
在測試站建立一個簡單商品,完成購物車與結帳流程測試。
完成後你會
能判斷網站是否適合使用 WooCommerce,並規劃基本電商建置流程。
8 節電商實務