8個(gè)步驟快速構(gòu)建WooCommerce B2C商城網(wǎng)站

時(shí)間：2023-03-25 11:26:01 | 來(lái)源：電子商務(wù)

時(shí)間：2023-03-25 11:26:01 來(lái)源：電子商務(wù)

建立一個(gè)完全自主可控的外貿(mào)B2C獨(dú)立商城網(wǎng)站，有多種技術(shù)方案路徑，其中wordpress + woocommerce插件是目前最成熟，也是最易入手的方案，全球有超過(guò)20%的網(wǎng)上商城采用以上技術(shù)方案來(lái)構(gòu)建。

如果我們已經(jīng)熟練使用wordpress了，那么只需在此基礎(chǔ)上學(xué)習(xí)下WooCommerce插件的使用，即可快速實(shí)現(xiàn)如下效果的B2C網(wǎng)上商城網(wǎng)站。

wordpress基礎(chǔ)和主題請(qǐng)參考

一、B2C商城網(wǎng)站主機(jī)

外貿(mào)B2C網(wǎng)站需要全年7x24小時(shí)穩(wěn)定運(yùn)行，對(duì)主機(jī)的要求很高，對(duì)于大部分外貿(mào)人員來(lái)說(shuō)，往往不具備維護(hù)網(wǎng)站底層技術(shù)的能力，選擇一家靠譜的外貿(mào)主機(jī)空間就變得很重要。

Siteground是目前外貿(mào)界評(píng)價(jià)最高的一家專業(yè)wordpress主機(jī)提供商，很多國(guó)內(nèi)的專業(yè)外貿(mào)人員都在使用。針對(duì)woocommerce 外貿(mào)商城網(wǎng)站，SiteGround提供了如下的功能：

• 訪問速度優(yōu)化：Siteground針對(duì)訪問速度提供了自己開發(fā)的cache緩存插件和Cloudflare CDN功能，無(wú)需額外付費(fèi)。
• 安全支持：PayPal，stripe等支付功能都需要網(wǎng)站為HTTPS安全訪問，Siteground提供了免費(fèi)的SSL證書，一鍵安裝。
• 自動(dòng)備份，每日自動(dòng)備份數(shù)據(jù)，免除數(shù)據(jù)丟失風(fēng)險(xiǎn)。
• 郵箱服務(wù)，無(wú)需額外安裝任何郵箱插件，支持woocommerce相關(guān)的郵件通知服務(wù)。

關(guān)于Siteground的購(gòu)買和wordpress安裝，可以參考文章： SiteGround專業(yè)外貿(mào)主機(jī)最新使用教程。

二、商城主題選擇

適合商城的主題非常多，woocommerce公司也推出了他們自己的主題，但我還是建議你使用免費(fèi)的 astra主題，簡(jiǎn)單易學(xué)，容易入手，功能足夠。

Astra主題的具體設(shè)置步驟請(qǐng)參考文章： Astra主題快速搞定B2B,B2C網(wǎng)站。

三、woocommerce商城插件基礎(chǔ)

1. 插件安裝

wordpress插件市場(chǎng)中直接搜索woocommerce，安裝，并激活，免費(fèi)插件。

插件安裝完成后，wordpress后臺(tái)管理菜單欄中會(huì)多出2個(gè)菜單：

1. woocommerce： 店鋪相關(guān)的設(shè)置選項(xiàng)
2. Products：產(chǎn)品相關(guān)的選項(xiàng)

功能設(shè)置選項(xiàng)請(qǐng)參考后續(xù)章節(jié)，此處可先簡(jiǎn)單熟悉下即可。

2. 初始化設(shè)置

激活WooCommerce后，會(huì)自動(dòng)跳出初始化設(shè)置選項(xiàng)，按照提示一步一步設(shè)置即可。

如不確定怎么選，可快速跳過(guò)，后續(xù)在WooCommerce的setting設(shè)置菜單中重新進(jìn)行修改即可。

推薦安裝額外的插件，這一步可先不要安裝，后續(xù)根據(jù)需要再單獨(dú)安裝。

是否需要更換主題，不建議更換，直接使用astra主題即可。

四、Product產(chǎn)品和demo數(shù)據(jù)

對(duì)woocommerce進(jìn)行初始化設(shè)置后，就可以添加產(chǎn)品了。

在wordpress后臺(tái)，選擇Products中的add new，即可添加一個(gè)新產(chǎn)品，添加的產(chǎn)品會(huì)以獨(dú)立的頁(yè)面出現(xiàn)，產(chǎn)品頁(yè)面主要有以下8個(gè)部分需要填寫。

信息填寫完成后，點(diǎn)擊右上角的publish發(fā)布產(chǎn)品，即可看到產(chǎn)品發(fā)布后的頁(yè)面樣式。

如需快速導(dǎo)入一些demo產(chǎn)品數(shù)據(jù)進(jìn)行學(xué)習(xí)和測(cè)試，可下載woocommerce官網(wǎng)的demo數(shù)據(jù)，然后將其導(dǎo)入到店鋪中即可快速生成產(chǎn)品頁(yè)面。https://docs.woocommerce.com/document/importing-woocommerce-sample-data/

五、購(gòu)物流程

在對(duì)woocommerce進(jìn)行進(jìn)一設(shè)置前，我們有必要先熟悉用戶在我們網(wǎng)站上的購(gòu)物流程。

購(gòu)物流程是指用戶從打開網(wǎng)站選擇中意商品至付款結(jié)束的整個(gè)過(guò)程，在woocommerce中一般會(huì)有如下四個(gè)步驟：

1. 瀏覽商品展示頁(yè)
2. 查看產(chǎn)品詳情頁(yè)，詳細(xì)了解產(chǎn)品
3. 加入購(gòu)物車
4. 確認(rèn)付款

通過(guò)前一個(gè)步驟，我們已經(jīng)添加了產(chǎn)品頁(yè)面，剩余的其他三個(gè)頁(yè)面從哪里來(lái)呢？

答案是woocommerce插件已經(jīng)幫我們自動(dòng)添加好了，查看wordpress后臺(tái)的Pages頁(yè)面菜單，我們會(huì)看到多出來(lái)幾個(gè)頁(yè)面。

• shop產(chǎn)品列表展示頁(yè)面
• Cart為購(gòu)物車頁(yè)面
• Checkout為付款頁(yè)面
• My account頁(yè)面為用戶賬號(hào)頁(yè)面

除了購(gòu)物流程中的三個(gè)頁(yè)面外，另外還有一個(gè)“my account"賬號(hào)頁(yè)面，為方便用戶下次登錄網(wǎng)站時(shí)查閱到自己的訂單信息。

這四個(gè)頁(yè)面千萬(wàn)不要?jiǎng)h除或者隨意改動(dòng)，這是整個(gè)woocommerce購(gòu)物商城最核心的部分。

根據(jù)需要，可以將shop頁(yè)面設(shè)置為整個(gè)網(wǎng)站的“homepage”，當(dāng)用戶打開網(wǎng)站主頁(yè)后就可以直接看到產(chǎn)品列表頁(yè)面。

六、用戶付款方式

1. 收款的基本要求

經(jīng)過(guò)以上幾個(gè)簡(jiǎn)單步驟后，我們的B2C商城網(wǎng)站已初具雛形，但還差最重要的一個(gè)環(huán)節(jié)“用戶付款”。

付款和收款涉及到資金的安全問題，也是所有購(gòu)物商城設(shè)置中最復(fù)雜，也是最關(guān)鍵的部分。

woocommerce支持的主要付款方式有以下三類：

1. Paypal支付
2. Stripe等信用卡通道支付
3. Amazon Pay，Apple Pay等快捷支付

其中第三類快捷支付，僅對(duì)美國(guó)和部分地區(qū)居民開放，中國(guó)大陸地區(qū)沒法注冊(cè)，暫不討論。

剩下的就是paypal和信用卡支付兩種了。這兩個(gè)支付方式都涉及到一個(gè)問題，必須具備境外銀行卡。

Paypal收款要求賬戶升級(jí)為商業(yè)賬戶，商業(yè)賬戶需綁定境外銀行卡。

不管是stripe信用卡支付還是paypal支付，要讓資金最終流轉(zhuǎn)到國(guó)內(nèi)的銀行卡，整個(gè)資金流程如下：

對(duì)于大陸地區(qū)商戶來(lái)說(shuō)，我們可以申請(qǐng)payoneer之類的境外銀行收款賬戶，或者注冊(cè)香港離岸公司，開通香港的公司銀行賬戶，然后再綁定paypal賬戶。

關(guān)于境外賬戶開通可參考博客其他文章，本章主要探討woocommerce中的Paypal付款設(shè)置。

2、Paypal標(biāo)準(zhǔn)支付

paypal有兩種支付方式：

• Paypal standard
• Paypal checkout（快捷支付）

woocommerce中已經(jīng)默認(rèn)集成了“paypal標(biāo)準(zhǔn)支付”接口，其他的付款需安裝額外的插件，具體可參考 woocommerce官網(wǎng)。

以Paypal standard標(biāo)準(zhǔn)支付為例，我們看下用戶在購(gòu)物過(guò)程的整個(gè)流程：

1. 用戶在我們網(wǎng)站的付款頁(yè)面上點(diǎn)擊paypal支付，跳轉(zhuǎn)到paypal官網(wǎng)
2. 用戶在paypal官網(wǎng)輸入賬號(hào)密碼，并確認(rèn)付款信息
3. 付款完成后頁(yè)面跳轉(zhuǎn)回我們的網(wǎng)站，完成整個(gè)付款過(guò)程

Paypal標(biāo)準(zhǔn)支付的設(shè)置過(guò)程如下：

1. 在woocommerce中啟用paypal支付
2. 從paypal官網(wǎng)獲取paypal相關(guān)的API授權(quán)信息
3. 將獲取到的API授權(quán)信息設(shè)置到paypal選項(xiàng)中

登錄paypal官網(wǎng)，依次找到“商家設(shè)置” >>“API設(shè)置”，然后復(fù)制以下信息：

• API用戶名
• API密碼
• 簽名

回到woocommerce的paypal設(shè)置菜單中。

至此，paypal的收款設(shè)置已經(jīng)完成。

回到網(wǎng)站的付款頁(yè)面，我們可以點(diǎn)擊使用paypal方式完成整個(gè)購(gòu)物流程了。

七、最后設(shè)置

要完成整個(gè)購(gòu)物商城的設(shè)置，還需要一些相關(guān)的設(shè)置，包括：

• shipping發(fā)貨設(shè)置
• tax稅收設(shè)置

這些設(shè)置不難，可以直接進(jìn)入相應(yīng)菜單設(shè)置即可。此處不做詳細(xì)介紹。

八、用戶體驗(yàn)優(yōu)化

完成了以上七個(gè)步驟后，網(wǎng)站已經(jīng)具備了開張售賣商品的基本功能。但要想讓網(wǎng)站產(chǎn)生更多的訂單，則需要做的工作還很多，包括產(chǎn)品添加，網(wǎng)站整體優(yōu)化等。

關(guān)于網(wǎng)站的優(yōu)化，有一個(gè)專業(yè)術(shù)語(yǔ)“用戶體驗(yàn)”。用戶體驗(yàn)更多的已經(jīng)不是技術(shù)層面的問題了，而考驗(yàn)的我們對(duì)用戶的了解深度。具體可參考博客其他文章。

更多文章可關(guān)注公眾號(hào)TTVPS, 或者博客 https://ttvps.com

碼字不易，如文章對(duì)你有用，請(qǐng)幫忙點(diǎn)個(gè)贊，感謝支持！