內容目錄
歡迎回到鵠學苑 — WordPress 網頁設計超詳細攻略 – WooCommerce 帳戶社交登入 外掛對於電商網站管理者而言，是非常需要安裝的附加功能，WordPress 購物網站在會員系統中其實能夠客製化的選項並不多，只有單純的註冊、登入、使用者管理等，如果説想要提升顧客在網站中結帳流程的整體流暢度，安裝 WooCommerce Social Login 讓使用者在結帳或查看商品訂單狀況時可以一鍵使用 FB 帳號登入的方法，是一個不錯的選擇。
在本篇教學中將說明如何安裝 Social Login 外掛以及設定方式，另外這個外掛是 WooCommerce 官方製作，必須要付費後才能取的外掛安裝檔案，在下方有附上官方介紹購買連結，各位朋友可以自行參考是否要付費，或者在網路上搜尋資源。（購買此外掛鵠學苑不會得到任何分成，我們也是付費購買使用的，特此聲明。）讓我們開始學習吧！
WooCommerce Social Login 官方介紹(購買)
https://docs.woocommerce.com/document/woocommerce-social-login/
WooCommerce Social Login 外掛說明文件
https://docs.woocommerce.com/document/woocommerce-social-login/
WooCommerce WordPress 外掛技術支援論壇
https://wordpress.org/support/plugin/woocommerce/
第一步：點擊的連結後會進入到 WooCommerce Social Login 介紹頁面，在右側有購買選項，只要使用 WordPress 帳號登入後就透過信用卡付費，並取得檔案下載權限。
第二步：在 WordPress 後台安裝外掛介面中選擇下載的檔案將外掛上傳安裝。
第三步：安裝並啟用外掛後，在 WooCommerce 設定頁面中或多出 Social Login 的頁籤，選擇進入。
第四步：在基本設定中要選擇社交按鈕在哪裡顯示，預設是在結帳（check out）與我的帳號頁面（My Account），如果要讓使用者在登入時就能自行選擇是否使用社交帳號登入，那麼 My Account 這個項目一定要選擇。
第五步：以下說明圖中欄位：
如下圖所示，可以直皆將欄位中的文字翻譯為繁體中文。
第六步：SSL 是指如果網站有安裝加密憑證（https），那麼此項目就要勾選。在圖中下方可以各別設定要啟用哪些社群媒體來提供給使用者做網站登入，在下一小節會以 Facebook 設定做說明。
第一步：在 Facebook 開發人員網站中註冊好應用程式，會取的如下圖所標示編號與密鑰，將其複製起來。詳細申請流程可以參考：FaceBook 登入 / 註冊 網站會員功能 – 詳細設定步驟教學。
第二步：在 Facebook 設定頁中，將 Enbale 勾選，並將編號與密鑰分別填入到 App ID 與 App Secret 欄位中。
第三步：Button text 的內容文字可以自行更改，最下方 Redirect URL 選項如果在 FB 申請應用程式時有確實將轉址網址填入，請直接勾選即可。
第四步：回到網站前台，在登入畫面中就會出現 FB 登入按鈕。
第五步：點選後會跳出給使用者的提示，網站將收到使用者的姓名與電子郵件地址，接者點選繼續按鈕，如果直接跳轉到已登入帳戶編輯畫面，就表示設定完成了。
第六步：對完全沒有註冊過網站的使用者，在結帳頁面會顯示可以使用社交帳戶登入的選項，也就是在第一小節中所說明的，必須要將 Checkout 加入到顯示按鈕選項，在結帳頁面才會顯示社交按鈕。
WooCommerce 社交登入外掛本身其實並不複雜，比較麻煩的是 Facebook 申請應用程式的步驟，比如說如果網站沒有 SSL 加密憑證，Facebook 是不會通過社交登入功能的申請，還有一些小細節與版本差異的設定，相對而言會比較麻煩，建議在設定時可以參考 FB 的開發人員說明網頁，操作起來才會比較順利。
今天的教學到這裡告一段落了，不要忘記在右側訂閱鵠學苑電子報，確保收到最新 WordPress 教學文章，如果有網頁設計相關需求，或者想了解最新網站知識，也可以到 鵠崙設計 做線上免費諮詢喔！我們下次的教學見～
內容行銷到底要多久才能見效呢？撰寫內文時一定要遵循的潛規則！
重複內容 會影響SEO？如何正確把內容分享到社群平台！
購物網站架設 – 電子商務網站建置的細節與項目