我的 WordPress Blog 系統第一次改版是在約 7年多前，詳見 - 重新設計本站 WordPress Theme 版面。
當年是從無到有自行 "硬刻" CSS Layout，也不懂得如何運用如 Bootstrap UI 框架，讓版面可以隨不同裝置而能更具有彈性的調整。不過即使這樣，最多透過一些挺好用的 Plugin 工具，倒是只單純撰寫 Blog，卻是足足有餘了。
不過今年初 (其實去年底就有這打算)，我就決定採基於以 Bootstrap 4 框架來重新設計整個網站的版面。我並不打算採買一些花炫的佈景主題 (Theme)，而是採以較基本的 Starter Theme，再整合包括 Bootstrap + Fontawesome 等具UI框架與豐富的圖示等當為網站建置的基礎建設。可參考先前寫的這篇：關於建構 WordPress Starter Them－整合 Underscore 與 Bootstrap/FontAwesome。
我把這自行所已整合的 Starter Theme，命名為「SimplicityZen」專案，並放置於 Github，而後可以持續更新上述的套件版本，透過 Git 版本管控維護。
這算是基底佈景主題的基礎建設。我把它當成「parent theme」，然後再從其 extend child theme，這是 WordPress 官方建議的作法，好處就是客製化全在 child theme 這邊修改，而 parent theme 則可以另行維護。
因為我打算把 WordPress 首頁 (frontpage) 設計為聚合性資訊的首頁。包括個人擔任軟體顧問、講師相關的課程、產品與輔導等資訊，再整合原來 Blog 日常的內容文章，以及軟體專欄文章等，所以我必須自行利用 PHP 撰寫這個首頁的 Layout，完全是重頭開始刻寫的，著實花了不少時間。
我現在是把軟體課程與產品資訊等內容，設計為客製化的文章類型 (custom post type)，並各為其再新增客製化的欄位 (custom field)，這些都有賴於 WordPress 提供了非常豐富實用的 Plugin，擇選普遍評價較高，且有持續更新的來使用即可，這節省了太多功夫了。
所以現在首頁是聚合型 (aggregation)的整合資訊。至於「部落格」內容，則是點選選單列 (或單選首頁最新文章)進入；「軟體課程內容」也是透過選單列進入，可以查看年度所有課程列表，或者單一課程詳細內容資訊等。後續包括「產品資訊」、「顧問輔導」等，也都是個別獨立於選單列 (Menu, NavBar)。
總之，斷斷續續邊修改、邊瀏覽、邊調整，幾乎 CSS 與 主要的 PHP Template 都重新寫過，好容易才勉強於昨日上線 (2018/04/11)。當然還有許多內容尚未補充進來，而延宕有四個月之久沒有更新部落格文章，就預定從此篇開始再持續寫作，包括日常生活日誌、學習心得，以及軟體專欄文章等，並且讓版面可以將之界定隔離更為清楚。
我根本就是把原來的 WordPress 系統完全刪掉 (當然有保留多年所撰寫的文章與相關的迴響/留言)，先在本機端開發測試告一段落後，才整個搬移到 Host 虛擬主機端。整個新系統上線初期，還需要作一番調校、除錯才可，甚至部份版面也會再重新設計，這也算是我從過程中學習逐漸熟悉 CSS3 以及對 Bootstrap 4 框架的應用。
嗯嗯，原來的部落格版面我使用 SnagIt 捕捉整張 Screenshot 圖片，以茲作為紀念。 🙂
