國家健康運動師資協會

NHE 國家健康運動協會官方網站｜課程報名、考試與會員系統（WordPress + WooCommerce） 網址：https://www.nhe2022.com.tw 案件背景 NHE 是一個在台北、台中、高雄三地開設運動按摩、筋膜刀、拔罐、肌筋膜伸展、肌貼、壺鈴、懸吊、C 級健身教練與銀髮族體適能等九堂專業認證課程的協會。接案前，報名靠 Google 表單收件，身份核對、合購計價、團報驗證、名額控管、出席紀錄、退費改期、考卷批改全部人工處理，每個月吃掉大量行政工時。本案目標是把整個流程搬上官網，讓協會從「收表單＋手動處理」變成「全自動行政流程」。 從需求訪談、資料模型設計、前後台開發、金流串接、測試站驗收到正式站上線與後續維護，全程由我司完成。所有客製邏輯寫成獨立的 WordPress 外掛模組，與佈景主題和第三方外掛分離，業主日後更新 WordPress 或 WooCommerce 不會被牽連。 核心功能 1. 多場地課程銷售：每堂課一個可變商品，變體對應「場地 × 報名人數」，上課日期、天數、早鳥截止日、名額都在後台自助維護。場次過期自動下架，歷史訂單與出席資料不受影響。 2. 多階層自動定價：一般、早鳥、舊生、學生、團報、合購六種價格並存，結帳時依會員身份與當下日期自動取最優惠，業主不用手動切換早鳥。早鳥截止後未付款的訂單由排程自動調回正常價並通知。 3. 團報與合購：N 人團報需填同行者已註冊的 Email 才能成單；兩堂課合購由系統依後台設定自動配對加入購物車並依比例攤分金額。下單當下把價格、配對、同行者全部凍結進訂單，日後改商品不影響舊單。 4. 名額共用池：同一場次單人與團報共用名額，購物車階段就用資料庫鎖阻擋超賣，取消與退費自動釋放。 5. 會員身份：舊生在開課日過後自動取得資格；學生上傳學生證由後台審核，效期一年自動到期。全站強制登入購買，並自寫 LINE 登入與 Google 登入模組。 6. 出席名單：後台依課程、場地、日期三層篩選，現場平板即時點名，可匯出 CSV；確認信與開課前提醒自動寄出並附場地資訊。 7. 退費與改期：學員在會員中心自助申請，系統依政策試算金額，後台審核後自動釋放名額、清除出席、處理退款。 8. 線上考試系統：講師用 CSV 上傳考卷，考卷綁定課程，只有上過該課的學員能考；伺服器端計時、自動計分、作答紀錄與成績查詢。 9. 金流：串接統一金流信用卡、Apple Pay 與 ATM 虛擬帳號，含入帳通知、金額核對、錯帳保護與逾期失效處理。 技術重點 以 WooCommerce 高效訂單儲存（HPOS）為基礎，出席、認證、退費等資料各自建表。重要操作使用資料庫層級鎖避免同時下單造成超賣或重複退款，所有金額與配對在成立訂單時快照。主機架設在 GCP，Varnish 快取、nginx、Apache 與 PHP-FPM 分層，並加入入侵掃描防護、上傳目錄禁止執行程式等硬化設定。每個功能都有可重複執行的自動化測試腳本，上線前在測試站跑完整回歸後才部署正式站，並經多輪獨立程式碼審查。 成果 上線後協會不再需要人工對帳與核對身份，九堂課、五個場地、數十個場次的報名、收費、名單、考試全部在官網完成，行政人員的工作從「處理每一張報名表」變成「在後台審核例外狀況」。系統仍持續擴充，後續的講師分成、推薦分潤與證照管理模組也在同一套架構上延伸。

日系生活選物電商網站改版

本專案為日系生活選物電商網站的第一階段改版與架構整理。客戶原本以日本代購與選物商品為主要經營方向，商品包含日本雜貨、文具、廚房用品、生活用品與角色商品，並且每週固定上新品。不過，隨著商品數量增加，原本網站逐漸出現幾個問題：首頁看起來變化不明顯、新品不容易被客人注意到、商品分類不夠直覺，手機版瀏覽也缺少更清楚的導購節奏。 這次合作的重點，不是單純把網站做得更漂亮，而是協助客戶把官網從「商品陳列型網站」整理成更適合長期經營的「日系選物店網站」。客戶希望未來能逐步發展食品系列、原創商品、品牌文章、影音內容與活動企劃，因此第一階段必須先把首頁導購、分類架構、新品曝光與手機版體驗打好基礎。 首先，我協助客戶重新規劃首頁結構。原本首頁商品區塊較平均，客人進入網站後不容易立即知道最近有哪些新品，也不容易理解目前主要商品分類。因此新版首頁將「本週新品」提前，並搭配上架日期、商品名稱、價格與新品標籤，讓客人一進站就能感受到網站持續有新商品更新。這個調整主要是回應客戶提出的痛點：雖然每週都有上新品，但客人覺得首頁看起來都差不多。 其次，我協助整理商品分類邏輯。原本網站分類容易混合商品類型與出貨方式，對前台客人來說不夠直覺。因此這次將網站方向整理為三大入口：日本雜貨／文具／生活選物、食品／海味乾貨、黑田媽原創商品。這樣的分類方式更接近消費者實際逛網站的習慣，也讓未來新增商品線時，可以有清楚的位置承接。 食品系列是本次專案中較急迫需要處理的部分，因此我另外規劃食品主分類頁與食品子分類頁。食品頁不只是一般商品列表，而是加入分類介紹、子分類入口、食品新品、回購商品與完整商品列表，讓食品系列看起來是一個可以獨立經營的商品線，而不是臨時新增的分類。未來客戶若要新增海味乾貨、茶飲沖泡、調味料理、甜點小食等子分類，也能延續相同版型，不需要每一頁重新設計。 這次也處理了新品曝光的維護問題。客戶每週固定上架新品，如果每次都要人工調整首頁與商品標籤，長期會增加維護成本。因此本案規劃依照商品上架時間自動呈現新品狀態，並讓商品卡能清楚顯示上架日期與商品資訊，讓網站自然產生「有更新」的感覺。這能降低客戶後台維護負擔，也讓回訪客更容易發現新商品。 手機版體驗也是本次重點之一。由於多數電商瀏覽行為都發生在手機上，因此新版設計特別調整首頁區塊順序、商品卡大小、分類入口、字級與留白。新品區在手機版採用清楚的雙欄呈現，分類入口則改成較容易點選與閱讀的卡片形式，讓客人在手機上也能快速找到新品、食品分類與主要商品線。 整體來說，本專案協助客戶完成的不只是首頁與分類頁製作，而是重新整理官網的第一階段營運基礎。網站完成後，客戶能更清楚地呈現新品、食品系列與品牌選物方向，也能為後續品牌文章、影音內容、原創商品頁與活動企劃頁保留擴充空間。 這個案例的核心價值，在於將客戶原本偏代購型的網站，逐步整理成更有品牌感、分類更清楚、手機版更好逛、也更適合長期經營的日系選物電商網站。

高級旅遊網站

本案為高端深度旅遊網站之內容管理架構重構案，目標不是單純製作形象網站或靜態頁面，而是建立一套可長期擴充、可維護、具備品牌一致性的旅遊內容平台。網站以深度旅遊、慢旅體驗、客製化行程、自然探索與旅遊文章為核心，因此特別重視行程系統、內容分類、版型一致性、手機版體驗與後續搜尋優化。 專案初期先分析既有網站架構，發現主要問題不只是視覺設計，而是行程頁、文章、分類邏輯與頁面版型缺乏系統化。原網站雖然已有一定內容與品牌方向，但若繼續以單頁方式新增行程與文章，未來容易造成版型不一致、內容難管理、分類混亂、搜尋架構不易累積，也會讓後台維護成本越來越高。因此本案的核心任務，是將網站從傳統頁面型網站，升級為結構化內容平台。 技術上以 WordPress 為核心，搭配 Astra 輕量化主題，並使用自訂 PHP 版型、CSS 與 JavaScript 建立前端架構。資料結構則使用原生自訂文章類型與 ACF Pro 建立「行程」內容系統，將行程拆分為固定欄位與可重複區塊，例如主視覺、行程介紹、旅程亮點、圖庫、每日行程、行程細節、常見問答、相關文章、相關行程與詢問按鈕。未來新增行程時，管理者只需在後台填入內容，不需要重新拉版或調整樣式，前端即可自動套用一致的版型、文字樣式、間距與品牌視覺規則。 分類方面，建立旅行風格、目的地、體驗類型等分類系統，讓每個行程可以標記不同主題。例如同一個行程可以同時屬於慢旅、健走、半自助、自然探索，也可以標記對應目的地與體驗內容。第一階段先讓目的地與體驗作為行程頁面的分類與資訊呈現；後續則可擴充為獨立內容頁、列表頁、相關內容區塊與搜尋優化入口。這樣能讓網站一開始保持簡潔，同時保留未來發展成大型內容平台的彈性。 前端設計採高端旅遊品牌常見的留白、大圖、沉浸式視覺與雜誌式閱讀節奏。行程版型包含大型主視覺、品牌敘事、旅程亮點、視覺故事、每日行程、旅程細節、相關文章、相關行程、問答與最終詢問區。整體頁面避免傳統旅行社常見的促銷式堆疊，而是讓使用者能透過清楚的內容層級，理解旅程特色、適合對象與詢問方式。所有字級、行高、字重、標題層級與手機版文字比例，皆由自訂 CSS 統一控管，避免後續每頁手動調整造成風格不一致。 動態內容部分，透過自訂查詢、ACF 關聯欄位、分類查詢與手動指定優先的方式，建立相關內容架構。前期可手動指定相關文章與相關行程，確保內容精準；後續內容量增加後，可依目的地、體驗與旅行風格自動抓取相關內容，形成完整的內容關聯系統。如此一來，行程頁不再只是孤立頁面，而能與文章、目的地、體驗主題互相串聯，提升使用者瀏覽深度與搜尋曝光基礎。 本案同時規劃三階段擴充。第一階段建立行程系統、首頁、文章系統、列表頁、手機版與基本搜尋架構；第二階段擴充目的地、體驗、健走主題頁與相關內容系統；第三階段延伸為完整旅遊內容平台，包含主題集合、進階篩選、內容中心、外部客戶管理工具串接與多語系準備。客戶管理功能不直接內建於網站，而是以表單收集需求，再串接外部工具，以維持網站乾淨、快速且易維護。 整體而言，本案重點不是完成幾個頁面，而是建立可長期成長的旅遊內容平台基礎。透過 WordPress、自訂文章類型、ACF Pro、分類系統、自訂版型、動態查詢、關聯欄位與手機優先設計，將原本容易失控的行程與內容管理流程，轉換成標準化、可擴充、可維護的網站架構，讓網站未來能持續新增行程、文章與分類，同時維持一致品牌形象與良好使用者體驗。

網站