用WordPress建置電子商務網站 - 2022

本篇課程要教您如何建立一個專業、漂亮、免費的電商網站，我將使用最好的和免費的資源建置，免費主題、免費的頁面編輯器、免費的外掛就可以建置一個像Amazon、Walmart、Flipkart和aliexpress，這樣的電子商務網站。雖然它使用免費的工具建立，但提供功能一樣讓您可以上架任何商品，經營自己的電子商務網站。這裡提供可變商品的上架工具、靈活運費設定，可依送貨地址、重量、尺寸、運費等等條件的判斷組合進行結帳。支援第三方支付設定，可以註冊如綠界科技、藍新金流等已通過申請金流支付工具，安裝在網站上使用。

電商網站支援電腦、平板及手機多介面的顯示，當我們將網站頁面編輯完成後，可以即時切換平板及手機的畫面，快速方便的優化我們要的畫頁效果。還有SEO工具，讓你在Google搜尋上，獲得更好的排名順序，你不需要任何技術或程式編程知識來自己建立這個網站，只需簡單的拖放，就可以完成專業、漂亮、免費的電商網站建置。

內容目錄

網站託管、WordPress及SSL安裝設定

WordPress是任何類型的網站建置的首選。無論是眾籌網站、電子商務網站、簡單的Blog網站或是商業網站等。任何類型的網站建置都需要兩個基本的東西，域名及網站伺服器主機。

域名是網域名稱，或您網站的網址，例如：godaddy.com、blogger.com、youtube.com、google.com，所有這些東西都是不同的領域名稱，所以我們須要購買互聯網上的域名。這樣每當有人想訪問時，他們可以簡單地輸入您的網站名稱，就是在瀏覽器的URL欄位中輸入您網站的域名，這樣他們就可以登錄到您的網站。

第二個與您的網站有關的重要事項是您網站的託管主機，基本上就是網站所在的計算機。所以如果你看到整個網站包括所有不同的媒體文件、所有不同的活動、不同的頁面等，網站的數據庫實際上這個完整的網站是保存在託管的計算機上。而這台計算機是24小時運行的，每當有來自何任何不特定國家的人想訪問您的網站時，他們是隨時可以瀏覽到您的網站的。所以您的網站始終是在執行中的。

這時您託管的計算機的速度就很重要，您的網站安全、甚至您的網站在Google中搜尋的排名結果，完全取決於您的託管，所以如果你選擇了一個好的且可靠的託管主機，您的網站速度和性能將是驚人的，你將有更好的安全性網站，你的網站在Google搜尋上的排名也會更好。相對地，若你選擇一個便宜且不太OK的託管主機，您的網站速度且性能可能會較差，並且您網站的安全性也將沒那麼OK，你也不會得到更好的Google搜尋排名結果。

在市場上有數以千計的不同託管產品，這裏有一些不錯的託管主機推薦。

這些託管雲端主機，都有很方便使用的架站工具可以運用。CPanel和Softaculous應用程式安裝工具等。

這些工具將提供非常有用的安裝WordPress網站工具及設定域名工具。他們也提供免費的備份工具，所以你的網站會自動每天備份，即使你的網站發生了什麼事，您也可以很方便的恢復你的網站內容。另外，他們提供免費的Cloudflare的CDN服務，讓網址有SSL加密服務。這非常重要，因為現在新的網址，google都要SSL加密認證。還有線上支付，也一定要求網站必需是支持SSL加密證書，如果您沒有SSL安裝在您的網域上的證書，您將無法接受線上支付的功能。

當然若您不想用雲端的託管主機，想自行架構網站主機的話。我之後也會寫一篇如何自行架設網站主機的文章給各位參考。要自行架設主機建議有一個固定IP會比較方便。基本上就是一台計算機中先安裝Linux作業系統，或是安裝NAS(FreeBSD)系統，然後再該系統上建置Docker及Nginx，之後再利用Docker建置WordPress網站及用Nginx設定SSL網址加密證書。

不過，無論如何，我們都需要先到GoDaddy或是Namecheap先購買註冊一個網域名稱。有了域名，接著再設定DNS的指定，之後才是架設安裝WordPress網站的步驟。

GoDaddy的DNS設定畫面如下

Namecheap的DNS設定畫面如下

SSL的設定，基本上只要將網址的DNS設定IP完成後，在HOSTINGER、A2 HOSTING、FASTCOMET或是BLUEHOST上設定SSL，只要將網域的網址填入Let’s Encrypt SSL的工具上就會自動產生網址的SSL加密證書。若是自建主機的話，在Nginx上，一樣也是使用Let’s Encrypt SSL設定網址的加密證書。

BLUEHOST SSL設定

FASTCOMET SSL設定

Nginx Proxy Manage SSL設定

WordPress 的安裝，這幾個託管主機在安裝WordPress網站時，只要按照步驟，填入網域名稱及帳密後，系統就會自動安裝之。而利用Docker的Portainer中的Stack建置WordPress網站一樣也是修改一些參數，之後系統也會自動安裝並建置好WordPress網站，如下圖示。

Cpanel上選擇WordPress安裝建置工具

Portainer上用Stack安裝工具

基本WordPress設定

在執行完WordPress網站建置安裝後，我們直接登入WordPress後台，這裏來說明基本的WordPress設定。

首先，我們要登入WordPress網站的後台網址，就是在網站網址的後面加上/wp-admin。這樣它就會導到WordPress網站的後台登入頁面。接著我們填入當初建置WordPress網站的帳號密碼，即可登入網站的後台儀表板畫面。

在我們登入到後台管理介面後，我們可以看到左邊有一排管理功能的介面，登入後我們首先會看到控制台儀表板的畫面，不過第一次登入後控制台的儀表板上的資訊都不是太重要的訊息，您可以從”顯示項目設定”中，篩選掉你不想顯示的項目。

你也可以先將目前全部的項目先篩選掉，等之後安裝較重要新的主題及外掛，再讓這些項目顯示。

接下來左邊比較重要的選項是文章的選項，我們將使用這個選項來建立新的文章。如果你看過我們其他網站建置的文章，你大概就知道我這裏講的這類Blog文章是從這個地方這個文章選項中建立。

接著，我們有媒體選項，無論什麼媒體文件、圖片。媒體文件存在於您的網站上，你可以從這裡看到所有這些。如果你願意，可以從這裡管理它們，你可以新增一些新的媒體文件。

然後是頁面選項，顯然頁面選項是用在建立並管理不同頁面。然後，還有評論選項，它是用來管理評論，如果你想准許或不回複，請從這裡的核准。如果你要過濾垃圾郵件或刪除郵件，你也可以從這裡執行。

接下來的選項是最重要的選項之一，就是網站的外觀選項。這個外觀選項是更改網站的佈局樣式。在安裝好WordPress網站後，會有三個預設的主機，2020、2021及2022這三個主題。我們只要啟用每一個主題，網站的外觀佈局風格樣式就會跟著即時變化。下面我們依序啟用這三個主題，並分別重新整理網頁，來看看網站的即時變化。

2020主題

2021主題

2022主題

不同的主題讓你網站設計的風格是完全改變，所以基本上網站的外觀主題，它會改變風格和網站佈局樣式。所以，你要記住一件事，若你的網站已經確認好外觀主題並啟用之，其他這些額外不相關的主題，請刪除它們。

接下來是另一個重要選項之一，就是外掛選項。外掛是一種軟體或是新增一些額外功能的附加模組或WordPress網站的功能。例如，現在我們剛剛建立的這個網站，它基本上只是一個電商平台網站，實際上沒有可用的功能。沒有可以新增活動相關或可用的購物車功能、沒有可以製作廣告系列、沒有可以知道目前訂單進度的功能、沒有任何支付功能的整合功能。所以我們要新增這些功能的外掛來組成電商平台主題的網站。

另外，還有設定的選項，這裡可以設定網站標題、網站說明，你可以從這裡改變它。你可以從這裡確保你的電子郵件是否正確，如果不是，你可以在這裡更換它。然後勾選任何人都可以註冊成會員資格的選項，如果你不勾選，就沒有人可以在你的網站上註冊。若不讓其他人可以註冊成為會員，這樣我們建置的電商平台網站就沒辦法讓人們下單購物、追踨客戶的購物行為或是建置會員聯盟行銷來擴大我們的電商業績。只有在他們能夠在你的網站上註冊，我們建置電商網站才有意義，所以請確保勾選任何人都可註冊的選項有被勾選。

然後是網站的介面語言、時區，這裡要確認正確。這樣電商購物活動的發起計算才不會有錯。

接著是永久連結選項這邊。永久連結的設定，建議選擇”文章名稱”，這是最好的結構。所以請確認你選擇此選項目點擊儲存確認。這樣所有的基本設定與我們的WordPress網站相關才算初步完成。

安裝主題(Theme) 及外掛(Plugins)

電商平台網網的主題及外掛安裝如下：

主題：搜尋安裝Woostify

外掛：搜尋安裝Elementor、WooCommerce、TI WooCommerce Wishlist、Variation Swatches for WooCommerce、Contact Form7、Conditional Shipping for WooCommerce、YITH WooCommerce Affiliates

外掛工具說明

Elementor：是目前WordPress最熱門的頁面編輯器，可以輕鬆的製作漂亮的頁面。
WooCommerce：是全世界最受歡迎的開放原始碼電子商務解決方案。目前比較受歡迎的網站電子商務開店平台工具有Shopify、Shopline、WooCommerce、Wix購物車、91APP及Cyberbiz，其中只有WooCommerce是免費，不過它屬於自己開發範圍。
TI WooCommerce Wishlist：它是一個強大的WordPress願望清單外掛。在架設購物網站時，我們需要有一個工具，方便收集顧客正在考慮購買商品的工具。
Variation Swatches for WooCommerce：為WooCommerce可變/變體產品提供顏色、圖片、按鈕樣式的屬性選項工具，是銷售服裝、鞋子、多品項樣式等商品的B2C企業網站必修外掛工具。
Contact Form7：可管理多份聯絡表單，也能透過簡單的標記靈活自訂表單及郵件內容外掛工具。
Conditional Shipping for WooCommerce：WooCommerce運送方式設定的延伸功能，WooCommerce提供的運送方式設定提供的基本的運送區域、運送選項及運送類別的設定，但假如今天遇到一個需求，需要判斷假設運送商品的總費用超過1000元，要收150元，超過2000元，要收250元，超過3000元以上，才免運費。這樣的需求設定的話，我們就需要這樣的外掛來設定。
YITH WooCommerce Affiliates：Affiliate是會員聯盟推廣系統，也就是會員佣金分潤系統的意思，現今社會越來越多企業的業務員推銷，是透過網路來經營。YITH WooCommerce Affiliates就是提供網站一個可以讓員工成為網站會員後，只要是由自己這邊網址推銷出去，並完成商品結算的業績，該員工就可以得到應得的佣金，並可以向公司申請領款作業。

TI Wishlist 設定

TI Wishlish外掛啟用後，一開始要設置基本設定。我們按下”Run the Setup Wizard”，開始設定。基本上就是按它預設的設定，一路按下繼續按鍵到完成，最後設置完成後，再按下”RETURN TO THE WORDPRESS DASHBOARD”，回到控制頁面。下面一步步用圖片解釋。