Wordpress 網上商店- 基礎設定教學

但是 WooCommerce 卻不是那種只要安裝之後, 人人就都能馬上賣東西的傻瓜外掛, 想要使用它來開自己的網路商店之前, 還是必需花些時間來研究它的操作邏輯, 但不可避免的, 自己本身也要有些 CSS 和 PHP 的基礎, 這樣才能順利地將 WooCommerce 改造成完全符合自己理想的網路商店.

因為接案的關系, 所以我經常會幫客戶規劃使用 WooCommerce 來製作網路商店. 關於一些設定的部分, 例如金流外掛一定是不能缺少的, 其它還有中文化、運費算法的設定、更改通知郵件的版型和一些應該注意的小地方, 這些我都會在本篇文章裡作些簡短的介紹, 若你有其它不懂的地方, 請多多用 Google 搜尋答案吧.

安裝 WooCommerce

進入安裝外掛頁面中, 搜尋 woocommerce 之後安裝並啟用.

安裝 WooCommerce 頁面

系統會自動安裝展示商品的商店 (Shop) 頁面, 可以依照需求添加不同的元素及商品顯示方式, 稍後也還能在 WooCommerce 後台改變對應的頁面.

安裝翻譯檔

安裝完 WooCommerce 之後, 系統就會自動偵測當前網站用的是什麼語言, 然後提示下載相同的翻譯. 在中譯這部分上, 就能幫商店增添獨特性, 並且與他人做出區隔的的地方. 如果有從事過服務業, 或者常在網路上購物的人, 大概都很清礎 WooCommerce 的中文翻譯, 大多是英文直翻成中文的, 唸起來的感覺和現實生活還是有點距離, 所以在商店正式上架前, 務必要全部檢視一次, 把生硬的翻譯用詞, 轉為較柔和的服務用語.

關於自訂翻譯, 我個人常用的工具是 Codestyling Localization 和 Poedit, 前者是 WordPress 的外掛, 後者是一般的 App, 翻譯檔在伺服器裡的存放路徑如下:

/wp-content/languages/plugins/woocommerce-zh_TW.po #前台

/wp-content/languages/plugins/woocommerce-admin-zh_TW.po #後台

特別提醒各位, 目前繁中的翻譯檔有幾個已知的問題, 例如在個人帳號底下的登出鈕錯誤、無法自訂收件欄位等, 所以比較建議不熟 WooCommerce 的使用者, 先在別的地方安裝全英文版來對照中文版使用, 比較能夠容易抓出翻譯導致錯誤的問題點.

設定 > 一般選項

商店所在位置選擇台灣當地, 要不要改變銷售地點則因人而異, 如果在購物說明中已有註明出貨方式, 就算消費者看得懂中文, 我想應該也不會有人在國外還下單購買商品.

更改貨幣的部分不僅會改變商品售價的貨幣符號, 若有使用 PayPal 收款時, 還會影響到收款的幣別. 另外若想自訂貨幣符號, 則可以使用下方的語法來把 NT$ 改為 $.

add_filter( 'woocommerce_currencies', 'add_my_currency' );
 
function add_my_currency( $currencies ) {
$currencies['NTD'] = __( 'NTD', 'woocommerce' );
return $currencies;
}
 
add_filter('woocommerce_currency_symbol', 'add_my_currency_symbol', 10, 2);
 
function add_my_currency_symbol( $currency_symbol, $currency ) {
switch( $currency ) {
case 'NTD': $currency_symbol = '$'; break;
}
return $currency_symbol;
}

加入語法之後, 選單中就會如下圖中出現自訂的貨幣符號.

設定 > 商品選項 > 商品圖片大小

商品圖片尺寸的設定是比較常出現問題的地方, 因為當改變了圖片的尺寸之後, 在之前已匯入的媒體庫中的圖片並不會馬上隨即套用, 必須要在使用 Regenerate Thumbnails 這類的縮圖外掛來重新設定圖片的大小.

設定 > 商品 > 庫存選項

設定保留庫存時間, 可以防止商品被遲遲未付款的訂單綁住, 導致影響了新的銷售機會. 這個部分可以設為保留訂單三天, 也就是 4320 分鐘, 超過時間後訂單就會自動失效.

設定 > 稅金選項

稅金設定這部分一般不太會啟用, 因為一般台灣的商品售價都以內含稅額, 除非有其它目地性才必須啟用.

設定 > 結帳選項

結帳設定是網路商店最重要的部分之一, 在 WooCommerce 預設收款方式中, 銀行轉帳、貨到付款和 PayPal 都能用在台灣當地收款, 但是若想讓消費者利用網路刷卡、虛擬 ATM 轉帳、超商條碼等其它方式結帳時, 則另需要再安裝串接金流外掛, 而現有的金流外掛可參考 WooCommerce 金流串接介紹及 Allpay 歐付寶的官方金流串接外掛這兩篇介紹.

另外補充說明一下, 什麼是強制使用安全連線結帳, 也就是所謂的 SSL (安全加密連線), 這個機制是用來確保消費者在結帳的時候, 他們所提供給商店的結帳資料是經過加密的. 一般像是 PChome 或 Yahoo 等大型網路購物平台也都一定會具備. 而且 SSL 是需要向核發機構申請購買, 待憑證核發後, 在安裝到伺服器上, 網站才能使用合格的 HTTPS 安全連線.

設定 > 運送選項 > 一般費率

當商店有提供不同的的運送方式時, 運費也有可能不同, 所以在一般費運的設定中, 有提供設定變化型的運送選項.
假設如上圖所示, 每筆訂單收取的郵寄運費為 60 元, 還有其它的出貨方式及價差的話, 就可在額外的費率欄位中設定.

設定好運費資料後, 當消費者在結帳時, 在購物車結算中頁面中, 就能看到上圖的選項, 選擇他想要的出貨方式, 運費方面同時也會自動計算.

在額外的費率設定格式如下, 運費也可以設成負數 (例如:-20) 來遞減運費.

黑貓宅配 | 20 | order
7-11門市取貨 | 40 | order

設定 > 電子郵件傳送選項

訂單通知也是商店很重要的部分, WooCommerce 的寄件方式和 WordPress 一樣, 都是使用 PHP Mail 來發信, 相信有大部分的使用者和我初期一樣, 會把發信功能轉到 Gmail 上, 但若對應用在 WooCommere 的情況時, 發出的信件極有可能會被 Gmail 判定為垃圾信的, 而且 Gmail 寄信上限也不高, 說真的不推薦把 Gmail 或者是 Google App 用在電子商務.

要解決寄信的最好辦法, 是使用類似 Mandrill 的寄件服務, 詳情參考這篇 WordPress 的寄信外掛 Mandrill & Mailgun, 而且自從採用 Mandrill 至今, 使用已超過一年多都還沒出現過問題.

設定 > 電子郵件範本

到目前為止, WooCommerce 裡的 Email 版型還是需要手動更改, 方法不難, 自訂步驟如下:

首先預覽電子郵件範本
接著開啟瀏覽器的檢測元素功能
在瀏覽器中修改並記下自訂的 CSS
最後再將 CSS 寫入 email-header.php 即可, 這樣信件就能一次全改為自訂的版型.
(3/12) v2.3版的更新增加了 email-styles.php, 現在以它為修改外觀的主檔案,
email-header.php 和 email-footer.php 則分別是通知信的頁首和頁尾的部分.

email-header.php 存放路徑如下:

/woocommerce/templates/emails/email-header.php #WooCommerce 中
/your_theme/woocommerce/emails/email-header.php #主題中

系統狀態 > 記憶體限制

單純運行 WordPress 的網站, 若沒意外的話, 記憶體大概設 32MB 就足夠了, 但 WooCommerce 的需求比較高一些, 如果外掛又裝很多的話, 建議設在 64MB 以上.

防止自訂的翻譯檔因為更新被覆蓋

有時候改了些自訂的中文翻譯, 但又擔心怕更新時被還原成官方的翻譯檔, 要解決這個問題時, 只要把自訂翻譯存放於下列路徑中, 就能防止更新時被覆蓋.

WordPress 網上商店- 基礎設定教學