การลงชื่อเข้าใช้ด้วยโซเชียลมีเดียสำหรับบัญชีผู้ใช้ของลูกค้า

นอกเหนือจากประสบการณ์การลงชื่อเข้าใช้แบบไม่ต้องใช้รหัสผ่านที่เป็นค่าเริ่มต้นสำหรับบัญชีผู้ใช้ของลูกค้า คุณสามารถเชื่อมต่อบัญชี Google และ Facebook ของคุณเพื่อให้ลูกค้าสามารถลงชื่อเข้าใช้ด้วยข้อมูลประจำตัวของโซเชียลมีเดียได้

การเปิดใช้งานการลงชื่อเข้าใช้ด้วยโซเชียลมีเดียสำหรับบัญชีผู้ใช้ของลูกค้าสามารถช่วยให้ลูกค้าลงชื่อเข้าใช้ได้รวดเร็วยิ่งขึ้นผ่านวิธีการยืนยันตัวตนที่คุ้นเคย คุณสามารถเปิดใช้งานวิธีการลงชื่อเข้าใช้ด้วยโซเชียลมีเดียหลายวิธีในร้านค้าของคุณได้

หากคุณเชื่อมต่อผู้ให้ข้อมูลระบุตัวตนของคุณเองกับบัญชีผู้ใช้ของลูกค้าแล้วและต้องการเชื่อมต่อการลงชื่อเข้าใช้ด้วยโซเชียลมีเดีย คุณต้องติดต่อผู้ให้ข้อมูลระบุตัวตนภายนอกของคุณ

ข้อควรพิจารณาสำหรับการเชื่อมต่อการลงชื่อเข้าใช้ด้วยโซเชียลมีเดียกับบัญชีผู้ใช้ของลูกค้า

ตรวจสอบข้อควรพิจารณาต่อไปนี้สำหรับการเชื่อมต่อการลงชื่อเข้าใช้ด้วยโซเชียลมีเดียกับบัญชีผู้ใช้ของลูกค้า ดังนี้

  • คุณต้องมีบัญชีนักพัฒนาสำหรับผู้ให้บริการที่คุณต้องการเชื่อมต่อกับบัญชีผู้ใช้ของลูกค้า
  • ข้อมูลลูกค้าเพียงอย่างเดียวที่จะซิงค์กับ Shopify เมื่อคุณใช้การลงชื่อเข้าใช้ด้วยโซเชียลมีเดียคือที่อยู่อีเมลของลูกค้า

เชื่อมต่อ Google กับบัญชีผู้ใช้ของลูกค้า

หากต้องการเชื่อมต่อ Google กับบัญชีผู้ใช้ของลูกค้า คุณจะต้องดำเนินการต่อไปนี้ให้เสร็จสมบูรณ์ตามลำดับ ดังนี้

ในระหว่างการตั้งค่า คุณต้องสลับไปมาระหว่างแท็บเบราว์เซอร์สำหรับ Google Cloud Console และส่วนผู้ดูแล Shopify คุณต้องมีการตั้งค่าบัญชี Google Cloud ไว้เพื่อเชื่อมต่อ Google กับบัญชีผู้ใช้ของลูกค้า หากต้องการดูข้อมูลเพิ่มเติมเกี่ยวกับ Google Cloud โปรดดูเอกสารความช่วยเหลือของ Google

ขั้นตอนที่ 1: เปิดหน้า Sign in with Google ในส่วนผู้ดูแล Shopify

  1. จากส่วนผู้ดูแล Shopify ให้ไปที่การตั้งค่า > บัญชีผู้ใช้ของลูกค้า

  2. ในส่วนการยืนยันตัวตน ให้คลิกจัดการ

  3. คลิกเชื่อมต่อที่อยู่ถัดจาก Google เพื่อเปิดหน้า Sign in with Google

หน้านี้มีข้อมูลที่คุณจะต้องคัดลอกและวางเมื่อกำหนดค่าไคลเอ็นต์ OAuth สำหรับแอป Google ของคุณ ดังนั้นโปรดเปิดหน้านี้ทิ้งไว้ในแท็บเบราว์เซอร์อื่น

ขั้นตอนที่ 2: สร้างแอปใน Google Cloud Console

  1. ในอีกแท็บเบราว์เซอร์ ให้ลงชื่อเข้าใช้ Google Cloud Console ของคุณ
  2. เลือกโปรเจ็กต์ที่มีอยู่หรือสร้างขึ้นใหม่ ระบบจะเปลี่ยนเส้นทางคุณไปยังแดชบอร์ดของโปรเจ็กต์
  3. คลิก เมนู จากนั้นคลิก APIs & Services > Credentials
  4. คลิก Configure consent screen > Get started
  5. กรอกรายละเอียดการกำหนดค่า OAuth ของโปรเจ็กต์ให้ครบถ้วน ดังนี้
    1. ตั้งชื่อแอปที่ลูกค้าจดจำได้ เช่น ชื่อร้านค้าออนไลน์ของคุณ ระบุอีเมลสำหรับรับความช่วยเหลือทางเทคนิค จากนั้นคลิก Next
    2. ในส่วน Audience ให้เลือก External แล้วคลิก Next
    3. ระบุอีเมลสำหรับติดต่อเพื่อรับการแจ้งเตือนใดๆ จาก Google เกี่ยวกับโปรเจ็กต์ จากนั้นคลิก Next
    4. ยอมรับนโยบายข้อมูลผู้ใช้สำหรับบริการ API ของ Google จากนั้นคลิก Continue
    5. คลิก สร้าง
  6. กำหนดค่าข้อมูลนโยบายของแอปซึ่งจะแสดงให้ลูกค้าเห็นบนหน้าจอยินยอม ดังนี้
    1. คลิก Branding
    2. ในส่วน App domain ให้ใส่ลิงก์ไปยังหน้าแรกของคุณ ลิงก์ไปยังนโยบายความเป็นส่วนตัวสาธารณะ และลิงก์ไปยังข้อกำหนดในการใช้บริการของคุณ ดูข้อมูลเพิ่มเติมเกี่ยวกับการสร้างนโยบายของร้านค้า

ขั้นตอนที่ 3: กำหนดค่าไคลเอ็นต์ OAuth ของแอปใน Google Cloud Console

ในขั้นตอนนี้ คุณจะต้องคัดลอกรายละเอียดจากส่วนคำแนะนำการตั้งค่าในหน้า Sign in with Google ในส่วนผู้ดูแล Shopify ของคุณ แล้ววางลงในช่องที่เกี่ยวข้องในแท็บ Google Cloud Console

  1. ในแอปสำหรับโปรเจ็กต์บน Google Cloud Console ให้คลิก Overview
  2. ในส่วน Metrics ให้คลิก Create OAuth client
  3. กำหนดรายละเอียดของไคลเอ็นต์ OAuth ดังนี้
    1. ในเมนูดรอปดาวน์ Application type ให้เลือก Web application
    2. ป้อนชื่อในช่อง Name
  4. กำหนดค่า Authorized Javascript origins สำหรับแอปของคุณ ดังนี้
  5. ในส่วน Authorized Javascript origins ให้คลิก + Add URI
  6. ในหน้า Sign in with Google ในส่วนผู้ดูแล Shopify ให้คัดลอกค่า Authorized Javascript origins
  7. ใน Google Cloud Console ให้วางค่าดังกล่าวลงในช่อง URIs 1
  8. หากคุณมี URI มากกว่าหนึ่งรายการในส่วน Authorized Javascript ในส่วนผู้ดูแล Shopify ให้ทำขั้นตอนเหล่านี้ซ้ำสำหรับช่อง URI เพิ่มเติม
  9. กำหนดค่า Authorized redirect URIs สำหรับแอปของคุณ ดังนี้
  10. ใน Google Cloud Console ของคุณ ในส่วน Authorized redirect URIs ให้คลิก + Add URI
  11. ในแท็บเบราว์เซอร์ที่มีส่วนผู้ดูแล Shopify ของคุณ ให้คัดลอกค่า Authorized redirect URI
  12. กลับไปยัง Google Cloud Console จากนั้นวางค่าดังกล่าวลงในช่อง URIs 1
  13. หากคุณมี URI มากกว่าหนึ่งรายการในส่วน Authorized redirect URI ในส่วนผู้ดูแล Shopify ให้ทำขั้นตอนเหล่านี้ซ้ำสำหรับช่อง URI เพิ่มเติม
  14. ใน Google Cloud Console ของคุณ ให้คลิกสร้าง

เปิดกล่องโต้ตอบ สร้างไคลเอ็นต์ OAuth แล้ว ที่แสดงขึ้นค้างไว้สำหรับ ขั้นตอนที่ 4: กำหนดค่าข้อมูลประจำตัวในส่วนผู้ดูแล Shopify เนื่องจากคุณจำเป็นต้องคัดลอกและวางข้อมูลจาก Google Cloud Console ในส่วนผู้ดูแล Shopify

ขั้นตอนที่ 4: กำหนดค่าข้อมูลประจำตัวในส่วนผู้ดูแล Shopify

  1. จากกล่องโต้ตอบ สร้างไคลเอ็นต์ OAuth แล้ว ใน Google Cloud Console ให้คัดลอก Client ID
  2. ในหน้าลงชื่อเข้าใช้ด้วย Google ของส่วนผู้ดูแล Shopify ในส่วนข้อมูลประจำตัว ให้วาง Client ID
  3. จากกล่องโต้ตอบ สร้างไคลเอ็นต์ OAuth แล้ว ใน Google Cloud Console ให้คัดลอก Client secret
  4. ในหน้าลงชื่อเข้าใช้ด้วย Google ของส่วนผู้ดูแล Shopify ในส่วนข้อมูลประจำตัว ให้วาง Client secret
  5. ในหน้าลงชื่อเข้าใช้ด้วย Google ของส่วนผู้ดูแล Shopify ให้คลิกบันทึก

ขั้นตอนที่ 5: เผยแพร่แอปใน Google Cloud Console

  1. ในแอปของโปรเจ็กต์ใน Google Cloud Console ให้คลิก Audience
  2. คลิก Publish app (เผยแพร่แอป)

เชื่อมต่อ Facebook กับบัญชีผู้ใช้ของลูกค้า

ในการเชื่อมต่อ Facebook กับบัญชีผู้ใช้ของลูกค้า คุณจำเป็นต้องดำเนินการต่อไปนี้ตามลำดับ:

ระหว่างการตั้งค่า คุณจะต้องสลับระหว่างแท็บเบราว์เซอร์ของแดชบอร์ด Meta for Developers และส่วนผู้ดูแล Shopify ในการเชื่อมต่อ Facebook กับบัญชีผู้ใช้ของลูกค้า คุณจะต้องมีบัญชี Meta Developer ดูข้อมูลเกี่ยวกับวิธีลงทะเบียนเป็น Meta Developer

ขั้นตอนที่ 1: เปิดหน้าลงชื่อเข้าใช้ด้วย Facebook ในส่วนผู้ดูแล Shopify

  1. จากส่วนผู้ดูแล Shopify ให้ไปที่การตั้งค่า > บัญชีผู้ใช้ของลูกค้า

  2. ในส่วนการยืนยันตัวตน ให้คลิกจัดการ

  3. คลิกเชื่อมต่อถัดจาก Facebook เพื่อเปิดหน้าลงชื่อเข้าใช้ด้วย Facebook

ขั้นตอนที่ 2: สร้างแอปในแดชบอร์ด Meta for Developers

  1. ในแท็บเบราว์เซอร์แยกต่างหาก ให้ไปที่แดชบอร์ด Meta for Developers แล้วคลิก Login (เข้าสู่ระบบ) เพื่อลงชื่อเข้าใช้ หากคุณยังไม่ได้ตั้งค่าบัญชี Meta Developer คุณจะต้องสร้างบัญชีใหม่จากหน้าการเข้าสู่ระบบก่อนดำเนินการขั้นตอนถัดไป
  2. คลิกแอป
  3. คลิกสร้างแอป
  4. กรอกช่องชื่อแอปและอีเมลติดต่อของแอป จากนั้นคลิกถัดไป
  5. ในหน้า Add use cases ให้เลือก Authenticate and request data from users with Facebook Login จากนั้นคลิกถัดไป
  6. ในหน้า Which business portfolio do you want to connect to this app ให้เลือกพอร์ตโฟลิโอธุรกิจ หรือเลือก I don't want to connect a business portfolio yet. จากนั้นคลิกถัดไป
  7. ตรวจสอบหน้า Publishing requirements จากนั้นคลิกถัดไป
  8. ตรวจสอบหน้า Overview จากนั้นคลิก Go to dashboard

ขั้นตอนที่ 3: กำหนดการตั้งค่าแอป Meta

  1. หลังจากสร้างแอปแล้ว ในแดชบอร์ด Meta for Developers ให้คลิก Use cases
  2. ในกรณีการใช้งาน Authenticate and request data from users with Facebook Login ให้คลิก Customize
  3. เพื่อให้แน่ใจว่าระบบบันทึกข้อมูลลูกค้าเมื่อลงชื่อเข้าใช้ ในส่วน Permissions and features ถัดจาก email ให้คลิก Add
  4. คลิก Settings จากนั้นไปที่ Client OAuth settings
  5. ในหน้าลงชื่อเข้าใช้ด้วย Facebook ในส่วนผู้ดูแล Shopify ให้คัดลอก URL สำหรับการเปลี่ยนเส้นทางจากส่วน Redirect URLs
  6. ในหน้า Settings ในแดชบอร์ด Meta for Developers ให้วาง URL สำหรับการเปลี่ยนเส้นทางในช่อง Valid OAuth Redirect URIs
  7. หากคุณมี URL สำหรับการเปลี่ยนเส้นทางมากกว่าหนึ่งรายการในส่วน Redirect URLs ของส่วนผู้ดูแล Shopify ให้ทำซ้ำขั้นตอนเหล่านี้สำหรับ URL สำหรับการเปลี่ยนเส้นทางเพิ่มเติม
  8. ในหน้าลงชื่อเข้าใช้ด้วย Facebook ของส่วนผู้ดูแล Shopify ให้คัดลอก URL จากส่วน Deauthorize URL
  9. ในหน้า Settings ในแดชบอร์ด Meta for Developers ให้วาง URL ในช่อง Deauthorize callback URL
  10. ในหน้า Settings ในแดชบอร์ด Meta for Developers ให้คลิก Save changes

ขั้นตอนที่ 4: กำหนดค่าข้อมูลประจำตัวในส่วนผู้ดูแล Shopify

  1. คลิกไอคอนหน้าแรกเพื่อกลับไปยังแดชบอร์ด Meta for Developers ของคุณ จากนั้นคลิก App settings > Basic
  2. คัดลอก App ID จากแดชบอร์ด Meta for Developers
  3. ในหน้าลงชื่อเข้าใช้ด้วย Facebook ของส่วนผู้ดูแล Shopify ให้วาง App ID ในช่อง App ID ของส่วนข้อมูลประจำตัว
  4. ในแดชบอร์ด Meta for Developers ให้คลิก Show ถัดจาก App secret จากนั้นคัดลอก App secret
  5. ในหน้าลงชื่อเข้าใช้ด้วย Facebook ของส่วนผู้ดูแล Shopify ให้วาง App secret ในช่อง App secret แล้วคลิกบันทึก
  6. ในส่วนผู้ดูแล Shopify ให้คลิกบันทึกการเปลี่ยนแปลง

ขั้นตอนที่ 5: ทดสอบและเปิดใช้งานลงชื่อเข้าใช้ด้วย Facebook

  1. ในหน้าลงชื่อเข้าใช้ด้วย Facebook ของส่วนผู้ดูแล Shopify ให้คลิก การดำเนินการเพิ่มเติม > แสดงตัวอย่าง จากนั้นทดสอบขั้นตอนการตรวจสอบสิทธิ์ของ Facebook เสมือนว่าคุณเป็นลูกค้าที่กำลังลงชื่อเข้าใช้ร้านค้าของคุณ
  2. คลิกเปิดใช้งาน

หลังจากที่คุณเปิดใช้งานลงชื่อเข้าใช้ด้วย Facebook แล้ว คุณสามารถทดสอบประสบการณ์การใช้งานของลูกค้าได้โดยไปที่ร้านค้าออนไลน์ของคุณแล้วลงชื่อเข้าใช้บัญชีผู้ใช้ของลูกค้าโดยใช้ Facebook

ลงชื่อเข้าใช้ด้วย Shop

หากคุณเปิดใช้งาน Shop Pay ลูกค้าของคุณจะสามารถลงชื่อเข้าใช้ด้วยข้อมูลประจำตัวของ Shop และรหัสการเข้าถึงที่บันทึกไว้ได้ ลูกค้าจะลงชื่อเข้าใช้ด้วย Shop โดยอัตโนมัติเช่นกันหลังจากที่ชำระเงินในร้านค้าของคุณโดยใช้ Shop Pay

ระบบจะเปิดใช้งาน Sign in with Shop สำหรับบัญชีผู้ใช้ของลูกค้าโดยอัตโนมัติ และจะสามารถลบออกจากร้านค้าของคุณได้ก็ต่อเมื่อคุณปิดใช้งาน Shop Pay เท่านั้น

ดูวิธีเพิ่มปุ่ม Sign in with Shop ในร้านค้าของคุณ

การจัดการตัวเลือกลงชื่อเข้าใช้ผ่านโซเชียลของคุณ

คุณสามารถแก้ไข ปิด หรือลบวิธีการลงชื่อเข้าใช้ผ่านโซเชียลที่คุณเชื่อมต่อไว้ได้

หลังจากที่คุณปิดหรือลบวิธีการลงชื่อเข้าใช้ผ่านโซเชียล ลูกค้าจะยังคงอยู่ในระบบเพื่อป้องกันไม่ให้เกิดการขัดจังหวะ เซสชันการลงชื่อเข้าใช้ผ่านโซเชียลจะหมดอายุตามปกติ หรือเมื่อลูกค้าลงชื่อออก

ขั้นตอน:

  1. จากส่วนผู้ดูแล Shopify ให้ไปที่การตั้งค่า > บัญชีผู้ใช้ของลูกค้า

  2. ในส่วนการยืนยันตัวตน ให้คลิกจัดการ

  3. ถัดจากวิธีการลงชื่อเข้าใช้ที่คุณต้องการเปลี่ยน ให้คลิกเมนู

  4. ดำเนินการข้อใดข้อหนึ่งต่อไปนี้:

    • หากต้องการแก้ไขตัวเลือกลงชื่อเข้าใช้ ให้คลิก จัดการ แล้วอัปเดตข้อมูลประจำตัวที่คุณต้องการแก้ไข
    • หากต้องการปิดตัวเลือกลงชื่อเข้าใช้โดยไม่ต้องลบออก ให้คลิก ปิด
    • หากต้องการลบตัวเลือกลงชื่อเข้าใช้ ให้คลิก ลบออก แล้วคลิก ลบออก ในกล่องโต้ตอบ

การอัปเดตการลงชื่อเข้าใช้ผ่านโซเชียลของคุณเมื่อเปลี่ยนโดเมนบัญชีผู้ใช้ของลูกค้า

หากคุณวางแผนที่จะเปลี่ยนโดเมนบัญชีผู้ใช้ของลูกค้าเป็น URL อื่น คุณจะต้องอัปเดตการตั้งค่าการลงชื่อเข้าใช้ผ่านโซเชียลของคุณก่อนทำการเปลี่ยนแปลงใน Shopify การดำเนินการนี้จะช่วยให้มั่นใจได้ว่าลูกค้าจะสามารถลงชื่อเข้าใช้ต่อได้โดยไม่หยุดชะงัก

ขั้นตอนเหล่านี้จำเป็นเมื่อคุณอัปเดต URL บัญชีผู้ใช้ของลูกค้าใน Shopify จากรูปแบบเดิม เช่น shopify.com/1234567890/account เป็นรูปแบบโดเมนย่อยใหม่ account.your-store.com หรือจากโดเมนย่อยที่มีอยู่เป็นโดเมนย่อยอื่น เช่น อัปเดต account.your-store.com เป็น customers.your-store.com

เพิ่มโดเมนย่อยของบัญชีผู้ใช้ของลูกค้าใหม่ไปยังผู้ให้บริการโซเชียลของคุณ

คุณจะเพิ่มโดเมนใหม่ในการตั้งค่าผู้ให้บริการโซเชียลของคุณควบคู่ไปกับโดเมนปัจจุบัน หลังจากเปลี่ยนโดเมนบัญชีผู้ใช้ของลูกค้าใน Shopify และยืนยันว่าขั้นตอนการลงชื่อเข้าใช้และการลงชื่อออกของบัญชีผู้ใช้ของลูกค้าทำงานได้ตามปกติแล้ว คุณจึงสามารถลบรายการโดเมนเดิมออกได้

คุณต้องทำซ้ำขั้นตอนเหล่านี้สำหรับตัวเลือกลงชื่อเข้าใช้ผ่านโซเชียลแต่ละรายการที่คุณเปิดใช้งานไว้

ขั้นตอน:

Google
  1. ไปที่ Google Cloud Console แล้วเปิด APIs & Services > ข้อมูลประจำตัว
  2. เลือก OAuth 2.0 Client ที่คุณสร้างไว้สำหรับ Shopify
  3. ใน Authorized JavaScript origins ให้เพิ่มรายการใหม่ ตัวอย่างเช่น https://account.your-store.com
  4. ใน Authorized redirect URIs ให้เพิ่มรายการใหม่ ตัวอย่างเช่น https://account.your-store.com/authentication/social/google/callback
  5. ใน Deauthorize callback URL ให้เพิ่มรายการใหม่ ตัวอย่างเช่น https://account.your-store.com/authentication/social/google/revoke
  6. บันทึกการเปลี่ยนแปลงของคุณ เก็บไว้ทั้ง URL เดิมและ URL ใหม่ในตอนนี้
  7. กลับไปที่ส่วนผู้ดูแล Shopify แล้วทำตามขั้นตอนเพื่อเปลี่ยนโดเมนบัญชีของคุณเป็น URL โดเมนย่อยแบบกำหนดเองใหม่ใน Shopify
  8. ทดสอบทั้งการลงชื่อเข้าใช้และการลงชื่อออกด้วยตัวเลือกโซเชียลแต่ละรายการบนหน้าร้านของคุณเพื่อยืนยันว่าทุกอย่างทำงานได้
  9. ไม่บังคับ: หลังจากยืนยันว่าขั้นตอนการลงชื่อเข้าใช้ทำงานได้อย่างถูกต้องแล้ว คุณสามารถกลับไปที่ Google แล้วลบรายการโดเมนเดิมออกได้
Facebook
  1. ไปที่ Meta for Developers แล้วเปิดแอปของคุณ
  2. ไปที่ เข้าสู่ระบบ ของ Facebook > การตั้งค่า
  3. ใน Valid OAuth Redirect URIs ให้เพิ่มรายการใหม่ ตัวอย่างเช่น https://account.your-store.com/authentication/social/facebook/callback
  4. ใน Deauthorize Callback URL ให้เพิ่มรายการใหม่ ตัวอย่างเช่น https://account.your-store.com/authentication/social/facebook/revoke
  5. ไปที่ การตั้งค่า > พื้นฐาน
  6. ใน App Domains ให้เพิ่มรายการใหม่ ตัวอย่างเช่น account.your-store.com
  7. บันทึกการเปลี่ยนแปลงของคุณ เก็บไว้ทั้ง URL เดิมและ URL ใหม่ในตอนนี้
  8. กลับไปที่ส่วนผู้ดูแล Shopify แล้วทำตามขั้นตอนเพื่อเปลี่ยนโดเมนบัญชีของคุณเป็น URL โดเมนย่อยแบบกำหนดเองใหม่ใน Shopify
  9. ทดสอบทั้งการลงชื่อเข้าใช้และการลงชื่อออกด้วยตัวเลือกโซเชียลแต่ละรายการบนหน้าร้านของคุณเพื่อยืนยันว่าทุกอย่างทำงานได้
  10. ไม่บังคับ: หลังจากยืนยันว่าขั้นตอนการลงชื่อเข้าใช้ทำงานได้อย่างถูกต้องแล้ว คุณสามารถกลับไปที่ Facebook แล้วลบรายการโดเมนเดิมออกได้