網站再造案例介紹：Blackmamajp × 黑田媽 (海外代購業)

前言

本網站使用 Blocksy 主題建置，收到客戶的委託時，網站本身的樣貌處於「佈景主題安裝完成」，已經完成初步的外觀設定；但因時間上的關係，客戶無法繼續深究下去，故處於一個未完成的狀態。

Before : 改造前

首頁以及側邊欄等元素處在初始值的狀態，雖然使用了市面上廣受歡迎的 Elementror 頁面編輯器，但仍不得其門而入，大致上如下圖的樣子；其實網站本身都能正常運作，但距離客戶心目中的理想樣貌還很遠。

After : 改造後

徵得客戶同意之後，把慣用的網頁編輯器從 Elementror 改回 WordPress 預設的區塊編輯器，這樣另一方面可以卸載 Elementror 外掛，爭取更多的系統資源。再搭配區塊編輯器的延伸套件「Spectra」，可以更快速地完成許多常見的版面區塊、視覺元件。

優秀的 Blocksy 佈景主題

這是第一次接觸「Blocksy」佈景主題，這裡使用的是社群免費版，各方面功能上非常的完整，前後台執行速度上也非常地流暢，操作體驗上完全不輸給我熟稔的「Astra」佈景主題，令人眼睛為之一亮。

回到這個案子，我們從 Blocksy 的「Starter Sites」中，挑選了一個範例網站「Garderobe」(線上DEMO)，以這個範例網站為基本原型，透過內建的設定跟自訂 CSS 的方式，逐步修改成預計的視覺呈現方式。

成果

本案充分利用「Blocksy」佈景主題的優勢，並使用原生的範例網站修改成客戶喜好的外觀；編輯器的部分改用 WordPress 預設的區塊編輯器，減少系統上的負擔，避免網頁語法相容性的問題。

電商功能使用 WooCommerce 來架設，我們協助客戶完成藍新、LINE Pay的金流申請與介接。