Wordpress購物車網站設計
價格、金流、推薦、範例一把罩
（瀏覽：4219  更新日期： 2024-05-05）

Wordpress購物車費用

架設購物網站的費用與Wordpress形象網頁設計 差異最大的部份在於購物車網站的功能，例如商品上下架管理、訂單管理、銷售報表、折價券之類的。 但上一章節有提到這些功能已包括在WooCommerce的外掛內，無需額外付費。
但需額外費用會在於"WooCommerce安裝與設定、API串接、商品頁調整、購物狀態Email通知、商品類別與標籤、WooCommerce基本教學、藍新金流申請溝通與協調"

1. Wordpress網頁設計(49,800)：如WooCommerce安裝與設定、API串接、商品頁調整、購物狀態Email通知、商品類別與標籤
2. WooCommerce外掛與設定(18,000)：透過線上信用卡支付減少使用者付費障礙、加快支付流程。藍新金流是目前最推薦的線上支付方式。透過藍新金流讓購物平台的使用者付款超方便、結帳超快速。 此外還提供超商店到店寄／取件，涵蓋全台5,000＋ 便利商店，免簽約、免設定費、立即啟用。
3. 藍新金流串接(5,000)：透過線上信用卡支付減少使用者付費障礙、加快支付流程。藍新金流是目前最推薦的線上支付方式。透過藍新金流讓購物平台的使用者付款超方便、結帳超快速。 此外還提供超商店到店寄／取件，涵蓋全台5,000＋ 便利商店，免簽約、免設定費、立即啟用。
4. 線上刷卡費用(單筆2.8%手續費)：申請藍新金流的會員是不需付費，只有在客戶線上刷卡購買完成會收2.8%的手續費(ATM轉帳1%、超商代碼繳費28元)，及在提款時會收取提領手續費(提領手續費每個月4次免手續費、第5次起每次10元手續費)。 貴設計的客戶只需最低只要2.4%線上刷卡手續費，快點找貴設計做購物車吧！)

購物車網站系統推薦

台灣要做電商有三種管道，分別是"電商平台"、"開店平台"、"購物車套裝工具"，差異如下

➤電商平台

這類平台，如台灣Shopee，及台灣2個最大的電商平台24小時 PChome、Momo購物網，提供一站式的電商解決方案，對新手非常友好，內建所有需要的工具，不需要商家自行管理網站的技術問題。

• 適合的商家：個人賣家、小規模業務或希望迅速上手的商家。
• 優點：平台帶流量，省去自行引流的難題；操作簡單，上手容易。
• 缺點：抽成較高，成本隨銷量增加，平台規則多限制商家的自主權。

➤開店平台

如 Shopify、 Shopline 這類平台，讓商家在付訂閱費後獲得更多自主權，能夠打造個人品牌，但平台仍會提供一些模組化的商店架設和行銷工具。

• 適合的商家：中小企業、希望打造品牌的商家。
• 優點：操作簡便，自主性適中；月費制抽成較低；大部分系統內建行銷工具。
• 缺點：受平台制約，不能完全自訂功能；隨品牌需求增加，月費可能逐漸上升。

➤購物車套裝工具

這類工具（如 WordPress+WooCommerce）是完全自主的購物車系統解決方案。商家可以自行購買域名和主機，設計專屬網站並整合各種插件。

• 適合的商家：中大型企業、擁有IT資源的商家、需要高度自定義和品牌化的商家。
• 優點：彈性高，商家完全掌控網站設計、行銷插件、自定義功能；低抽成或無抽成，較長期成本低。
• 缺點：需具備技術背景或聘請專業開發人員；前期架設過程較複雜，花費時間長。

文本是聚焦在使用套裝工具Wordpress架設網站，因此在網站彈性、擴充、自主權將會有更大的彈性，同時網站架設費用會較便宜，但相對的在網站架設上的專業要求就會較高。 了解更多請參考文章【網路商店架設工具？購物型網站模組大公開，你適合那個？】

Wordpress形象網站設計

Step1： 買網址＋DNS設定＋HTTPS加密

貴設計都在Godaddy買網址，優點如下。

1. 網站介面簡單乾淨：相對中華電信很OLD FASHION的介面，Godaddy你定會覺的非常好用。
2. 購買程序簡單快速：中華電信買個網址需要輸入多個欄位，Godaddy直接刷卡帶走。
3. 網址買錯退費好人性：上次買錯一個網址，當下找客服處理，10分後就馬上退費。
4. 線上售後服務好：中華電信的客服電話告訴你，非常難找，一直在電話中。
5. DNS生效好快速：DNS，（用過中華電信你就知道慢）

6. 多樣化網址選擇好方便：直接參考下圖吧。.com是台灣最愛的，但隨著網址也跟著進步，不用再死守.com的網址囉。

   

那如何購買網址？請參考上圖，只要在搜尋框輸入你喜歡的網址名稱，再點下右側放大鏡，就會自動跳出一堆不同結尾的網址。 如何選擇網址呢？

1. 美國網址、國際性、網址大氣的請選擇your-domain.com。但網址會被google歸類為美國網址，會不利於台灣的SEO排名。
2. 台灣本土、台灣品牌的可選擇 your-domain.com.tw，但需注意網址有無商標問題。例如你的網址your-domain，是不是有被別的企業註冊商標。
3. your-domain.cc or your-domain.shop就看個人所好
4. 千萬不要中文網址，中文網址是弊大於利。

點下右側放大鏡後，上方紅框的部份，你看到的費用部份只有首年，在價錢的下面有一排灰色字＂適用於第一年＂，你下次購買網址使用權就會恢復成原價。 創業第一年失敗的機率極高，可以先買第一年，若企業經營穩定可以一次購買多年。
購買網址需註冊Godaddy（需綁定信用卡），購買網址後去＂帳戶 ==＞ 我的產品＂，就會看見剛購買的網址。 若網址買錯可以5天內申請退款（參考Godaddy退款策略）。

DNS設定(如下圖) ，何謂DNS設定呢？ 簡單講，你買了一個網址，你要將網址指去某個主機的IP。

進入畫面之後，你會看見類似如下的畫面，尋找一個叫做類型為A，再將值輸入你的主機IP即可（我知道還沒有租主機，所以沒有IP，後續會說明），這個動作稱之為DNS設定。

HTTPS加密，貴設計為了能夠使用免費HTTPS的服務，我們會選擇將DNS交給Cloudflare代管 ，因為Cloudflare有免費的https服務，這樣子我們就不用額外一年花個好幾千買https。 如何將Godaddy的DNS交給Cloudflare代管呢？方式如下

1. 註冊Cloudflare：https：//www.cloudflare.com/zh-tw/，並新增網站將網址填入
   
2. 完成後，你就會看見你的網址，接著點擊進去（貴設計是網頁設計公司就有很多網址要設定）
   
3. 將畫面拉到下方Cloudflare名稱伺服器（在Cloudflare的網站），接著將紅色部份回填到Godaddy名稱伺服器（在Godaddy的網站）即可。
   
4. 再回到Cloudflare DNS設定，將IP填入以下紅色區塊就大功能告成。
   

Step2：買網站主機＋安裝Wordpress

買網站主機 ，貴設計推薦SiteGround，SiteGround成立於2004年主機商公司，擁有400多名員工。SiteGround提供虛擬主機、雲託管主機、網域等等。 SiteGround運作時間保證是99.99%，所以他們的伺服器不會有當機或連不上的問題。（但很遺憾，Sitegound於2022年已不再出售給台灣）

為何選擇SiteGround？

1. 免費SSL加密憑證
2. 每天自動備份，自動備份前30天資料
3. 免費 CDN
4. 24/7客服服務，線上即時聊天，回覆速度快
5. SG介面乾淨，好上手
6. 主機穩定性優
7. Wordpress一鍵安裝，5分鐘搞定
8. Wordpress自動更新
9. Wordpress免費輕鬆搬家，SG提供免費外掛

如何在SiteGround建立Wordpress？

1. 註冊登入後，到Home 就會看到 Set Up Site，點進去。
   
   
2. 選擇Start a New Website。 ps.如果你現有Wordpress網站才選擇Migrate Website。
   
   
3. 選擇Wordpress。 ps.如有需要WooCommerce可以點選Wordpress＋WooCommerce。
   
   
4. 設定登入資訊，之後登入都以這帳密登入。
   
   
5. SiteGround有提供加購網站掃毒的工具，看需不需要加購，不需要直接按Finish，Wordpress網站就完成了！
   
   
6. 直接登入網站。
   
   

在完成Siteground主機之後，將Siteground取得的IP至Cloudflare DNS設定即可(如下)。

了解更多關於Siteground主機，請參考Siteground主機13大完整教學主題

Step3：Wordpress佈景安裝與內頁設計

➤ 3.1 登錄網站後台

再輸入帳密就可以登入，完整登入流程請參考影片

登入之後，就會看見如下的後台。就代表你已經成功至少50%了。

➤ 3.2 安裝Wordpress網站佈景

• 📌 使用網站模板，網站架設費用現省10萬
• 📌 官方網站精緻又漂亮
• 📌 千種、萬種佈景主題任君挑選
• 📌 不用擔心跨瀏覽器、RWD設計問題

Wordpress佈景安裝的步驟：

1. 至外觀->佈景主題
   
2. 選擇想要的佈景主題：
   
   • 如已購買佈景主題：請先下載主題後，至安裝佈景主題進行安裝。
   • 也可以使用Wordpress提供免費版型，付費版請至Themeforest購買。
   
3. 選好後只需要在下方按「啟用」，即可蓋掉現有的佈景主題。
   
4. 一個wordpress電商主題的佈景就安裝好了！

➤ 3.3 Wordpress網頁設計：

更多Wordpress網頁設計文章，請參考

1. 【Wordpress是什麼？】Wordpress形像網站有什麼優勢？。
2. 【Wordpress網站前後台】教學
3. 【Wordpress版型推薦】佈景主題下載秘技
4. 【WordPress 媒體庫】教學
5. 【Wordpress 選單教學 (Menu)】教學
6. 【Wordpress頁面新增、刪除、修改 】教學
7. 【Wordpress文章新增、刪除、修改、列表、分類】教學
8. 【Wordpress外掛】教學及推薦
9. 【All in one Migration 】Wordpress網站備份外掛
10. Wordpress網頁設計教學

到這個步驟結束之後，其實已經完成了一個 Wordpress形象網站。若要為購物車網站剩的就是安裝購物車模組－WooCommerce。 但這邊有一個重點WordPressk形象網站要加入購物車的功能，若Wordpress版型在一開始選擇時沒有購物車功能的版型， 那WooCommercen安裝後，購物車排版、設計將會相對的簡陋，會需要再設計。因此若有長期考慮將來要轉電商，在初期就要選擇有Wordpress電商主題的佈景、模板。

Wordpress購物車金流－WooCommerce

你想網路銷售嗎？ 選擇Wordpress建置購物網站最推崇的購物車模組 WooComerce就對了，市面有一些其他的電商開源架構 (如Opencart)，都不如WooComerce值得被推薦。最大的好處莫過於WooComerce 在Wordpress的廣泛應用，使得任何疑難雜症、功能開始相較於其他套件都容易google到方案。而無需再花上萬元，找外包工程師開發。所以想要建置購物網站， WooCommerce是一個正確的選擇。
WooCommerce購物車模組的功能涵蓋了以下幾個重要功能

1. 商品管理：對商品圖文影介紹、商品上下架、定價、折扣、庫存管理、運送方式....。
   
   
   
2. 顧客管理：過去購買過的顧客網址、Email、註冊日、國籍。
   
   
3. 訂單管理：訂單清單、訂單資訊、訂單狀態調整
   
4. 銷售報表：依年、月、過去七日統計銷售總額、曲線報表
   
5. 折價券：折價券類型、折扣種類、金額、描述、到期日、使用限制等。
   其他還有分析各式資料。上述功能對於一個需要電商購物網站的客戶是已經非常足夠的，而部份的網站會特別安裝一些組合優惠的外掛。 這也只需要網站搜尋Wordpress外掛即可。EX：Advanced Dynamic Pricing for WooCommerce、WPC Product Bundles for WooCommerce、YITH WooCommerce Product Add-Ons。
   
   如何安裝WooCommerce，請參考以下影片。安裝完成後在你的左選單會看見WooCommerce的項目，就代表安裝成功了，接著就要開始串金流囉！

線上刷卡-以藍新金流串接為例

申請藍新金流的會員是不需付費，只有在客戶線上刷卡購買完成會收2.8%的藍新金流手續費（100元收2.8元），及在提款時會收取提領手續費（提領手續費每個月4次免手續費、第5次起每次10元手續費）。 此外請先準備銀行帳號及個人or企業的基本資訊（身份證、統編、地址），申請時均需要輸入。
藍新金流個人會員可自行開立商店使用信用卡支付、Web ATM、ATM轉帳、超商代碼繳費、條碼繳費等完整金流機制，並享有簡易快速收款功能，輕鬆整合處理收付帳款，即時掌握交易紀錄。 點擊註冊個人會員。
企業會員則可自行開立商店使用信用卡支付、Web ATM、ATM轉帳、超商代碼繳費、條碼繳費等完整金流機制，並享有簡易快速收款功能，輕鬆整合處理收付帳款，即時掌握交易紀錄。 註冊企業會員
了解更多藍新金流可參考企業會員常見問題。 接著回到主題，要能夠申請線上刷卡會分為三個步驟

1. 註冊藍新金流：註冊後需輸入銀行帳號（需要等1~2個星期驗證銀行帳號），提款時錢才能夠轉進你的戶頭內，另外要記的開通信用卡刷卡、ATM轉帳、到貨付款等功能（如上所述）。
2. 安裝藍新金流Wordpress外掛：記得先下載WooCommerce線上刷卡外掛。下載後解壓縮，內有一個zip檔，再使用手動上傳外掛即可安裝（可參考以下影片）。
3. 設定藍新金流外掛：請務必設定三個值
   1）藍新金流商店 Merchant ID（即商店代號）
   2）藍新金流商店 Hash Key 。
   3）藍新金流商店 Hash IV
   如何設定請參考影片。 設定完成請把啟動測試模組取消，接著在商品新增一個1元的商品，再拿自已的信用卡刷卡試用即可。若刷卡有誤請檢查剛設定的3個值。若仍是不行請洽藍新金流的客服部門。他們回話速度還滿快的。

電商必備功能－電子發票

購物車網站設計，電子發票絕對推薦你一定要安裝的功能，你還常在手開發票嗎？那當你使用電子發票，你一定會深深的愛上他，因為電子發票真的是省錢、快速又超省力。 怎麼說？

1. 節省掛號費：一般信件為確保客人有收到，我們都會以掛號出送，但一個掛號就要28元。但現在電子發票呢？只要1.5元的，沒有錯，就是1.5元，你沒有看錯，是不是超便宜。
2. 發票到達時間：發票若以掛號寄出，大概需要２天的時間，客戶端才會收到發票。但電子發票，送達時間從2天變成2秒，是不是超快速。
3. 作業時間：寫一張發票若不熟的話，大概會需要5分鐘時間，但電子發票只要1分鐘。
4. 錯誤字：手寫錯誤重開發票的機率變成0。
5. 發票註銷：有時後難免手拙寫錯字並寄出，但你知道這超麻煩的。這還要請尊貴的客戶掛號寄回來，接著註銷發票，然後寫一張正確的發票，接著再花28元的限掛寄出，從頭到尾快則要耗費4天時間。。只要5分鐘就搞定。
6. 郵局交通時間：發票寄出無需跑郵局，Email只要3秒鐘直接送出即可。
7. 請錢很快速：很多的企業都需要發票收到後才能請錢，過往發票寄出需1~2天，現在只能3分鐘，廠商馬上就收到，請錢流程馬上執行。

電子發票是不是超給力的，但不說你不知道，其實很多傳統的會計事務所都不會辦理電子發票，這種專業的事情，只要我們的電商客戶再加4999，貴設計幫您處理到好。

免費購物網站架設

購物網站一個都不少錢，不管你是走任何的平台、方案。要嘛是網站架設費用高、不然就是成交抽成高15~25%、再不然就是年費高，總之不會是便宜的。但貴設計的新平台熱搜情報網，跟你講做電商真的。很。便。宜。 以下是在熱搜情報網刊登的商家及產品。

1. 商家：專一茶鋪
2. 商品：笠間焼 | 古谷萌仁香 古典蕾絲飯碗、美濃燒｜ROKURO富士山茶碗、五月人型 | 日本兒童節和紙鯉魚掛飾

Wordpress購物網站範例

要架設一個得體的中小企業電商網站，從買網址、寫文案、到最難的網頁設計，再到最關鍵的金流串接，實則需要不少的技術與專業，這沒有個10幾年的經驗累積還真的有些難度。
好在貴設計有豐富的網站架設經驗，從內部網站再到形象網站、電商網站、API串接全都涉獵過。 這邊有幾個我們手中的wordpress購物車推薦，請您參考 專一茶鋪、 解惑急診室、 梵心生活科技、 NewHope益生菌。
參考更多 Wordpress網站範例

Wordpress購物車網站設計-進階

Wordpress金流串接 （RY WooCommerce Tools）

RY WooCommerce Tools是一款專為 WordPress平台上的 WooCommerce電商外掛的金流串接工具 透過這款工具可串接如藍新、綠界的金流、物流服務。

滿額免運（Advanced Free Shipping）

滿額免運是90%電商都會安裝的功能，這邊就推薦Advanced Free Shipping的外掛， 這外掛已超過5萬人安裝，所以外掛穩定是不用太擔心。

商品進階搜尋（Advanced Woo Search）

會用到商品進階搜尋功能一般都是商品較多的網站，透過商品進階搜尋，使用者下的搜尋關鍵字，可以涉及到商品名稱、內容、SKU、短介紹、類別、標籤...等等。 請參考Advanced Woo Search。