Ứng dụng - Social Login

Bằng cách đăng ký và đăng nhập tài khoản vào một trang web mua hàng, Khách mua hàng đã tự "định danh" trên trang web đó. Khi đó việc tương tác với Nhà bán hàng dễ dàng hơn cũng như đem lại một số tiện ích nhất định:

  • Đối với Khách mua hàng: đăng ký thành viên, tích lũy điểm, nhận khuyến mãi, không cần nhập lại thông tin khi mua hàng,...
  • Đối với Nhà bán hàng: nắm được thông tin khách hàng, theo dõi hành vi,..

Tuy nhiên, đôi khi khách mua hàng không muốn sử dụng đăng ký tài khoản mới mà thực hiện liên kết thẳng với tài khoản Facebook, Google của họ.

Vậy thì làm sao giải quyết vấn đề đó? 

=>>> Ứng dụng sẽ Social Login điều đó!

Các mục liên quan


Tổng quan về ứng dụng Social Login

Social Login là ứng dụng được cung cấp hoàn toàn miễn phí, do nhóm Haravan Partners phát triển.

Social Login được ra đời nhằm mục đích đáp ứng việc đăng nhập bằng tài khoản Facebook, Google,..

Với ứng dụng Social Login:

  • Khách mua hàng trên website dễ dàng đăng ký và đăng nhập mua hàng bằng các tài khoản social như Facebook, Google.
  • Nhà bán hàng dễ dàng biết được tên và email của người mua ngay khi họ vừa đăng nhập
  • Tăng tỉ lệ đăng ký tài khoản lên đến 90%.

Cài đặt ứng dụng

  1. Nhà bán hàng truy cập vào trang ứng dụng Social Login.
  2. Chọn Cài đặt ứng dụng.

  3. Nhập tên miền Haravan.


  4. Hệ thống điều hướng về Trang quản trị Haravan. Tại đây, Nhà bán hàng chọn "Cài ứng dụng Social Login".


  5. Khi ứng dụng được cài đặt thành công, hệ thống tự động điều hướng về trang ứng dụng Social Login.


Cấu hình hiển thị cho ứng dụng

Sau khi cài đặt ứng dụng vào Trang quản trị Haravan, Nhà bán hàng cần thực hiện thêm một thao tác nữa thì ứng dụng mới có hiệu lực. Đó là cấu hình hiển thị cho ứng dụng.

  1. Từ Trang quản trị Haravan -> Ứng dụng -> Social Login.

  2. Trong trang ứng dụng Social Login, Nhà bán hàng vào mục Widget.
  3. Nhà bán hàng sao chép một trong hai đoạn mã.

  4. Nhà bán hàng vào tiếp mục Website -> Giao diện -> Hiệu chỉnh theme.
  5. Nhà bán hàng chọn vị trí cần dán (ví dụ đặt trong login.liquid hay register.liquid).
  6. Nhà bán hàng dán đoạn mã và Lưu lại.  

Lưu ý: Nhà bán hàng chỉ cần dán một trong hai đoạn mã trong mục Widget. Haravan khuyến cáo Nhà bán hàng lựa chọn đoạn mã 1 được đánh giá là mã hóa tốt hơn.


Tùy chỉnh CSS cho nút đăng ký/đăng nhập 

Sau khi cài đặt và cấu hình hiển thị cho ứng dụng, bây giờ website của Nhà bán hàng đã có chức năng đăng nhập bằng tài khoản social.

Trong trường hợp Nhà bán hàng muốn tùy chình nút đăng ký/đăng nhập về màu sắc, font chữ,... thì Nhà bán hàng có thể tùy chỉnh CSS ngay trong ứng dụng.

  1. Từ Trang quản trị Haravan -> Ứng dụng -> Social Login.

  2. Trong trang ứng dụng Social Login, Nhà bán hàng chọn mục Tùy chỉnh CSS.
  3. Nhà bán hàng viết đoạn mã vào ô trống.

  4. Chọn Cập nhật để lưu thiết lập.

Cấu hình Facebook

Việc cấu hình Facebook giúp Nhà bán hàng đo lường (tracking) lượng người dùng từ Facebook tương tác với website thông qua ứng dụng Social Login.

Facebook App sở hữu nhiều tính năng hữu ích giúp mang lại nhiều trải nghiệm tốt hơn cho người dùng trong quá trình sử dụng website. Khi Nhà bán hàng yêu cầu khách hàng đăng nhập, đăng kí tài khoản truy cập website, họ có thể đăng nhập bằng tài khoản Facebook và sử dụng một số tính năng của nó, website cần cài đặt Facebook App.

Cấu hình Facebook này chính cấu hình từ app Facebook ID trên trang https://developers.facebook.com

Bước 1: Tạo Facebook apps

Để cấu hình Facebook ID vào trong ứng dụng Social Login, Nhà bán hàng thực hiện theo các bước 1, 2, 3 trong bài viết Thêm và quản lý comments bằng facebook

Lưu ý:

  1. Trong Bước 2, phần thiết lập thông tin cơ bản, nhập thông tin như hướng dẫn bên dưới:


    • Miền ứng dụng (App Domains):
      http://multiapp.haravan.com
    • URL chính sách quyền riêng tư (Privacy policy): 
      http://multiapp.haravan.com/social-login/policy
    • URL điều khoản dịch vụ (Terms of service): 
      http://multiapp.haravan.com/social-login/terms
  2. Trong Bước 3, phần điền đường dẫn của web vào ô URL trang web, Nhà bán hàng điền liên kết sau:


    • URL trang web (Site URL): http://multiapp.haravan.com 

Bước 2: Lấy mã ứng dụng 

  1. Sau khi tạo được ứng dụng, Nhà bán hàng vào trang Bảng điều khiển.
  2. Trong ô Khóa bí mật của ứng dụng, Nhà bán hàng nhấp chọn Hiển thị.


  3. Xác nhận lại mật khẩu tài khoản Facebook trong hộp thoại.
  4. Nhà bán hàng sao chép thông tin ID ứng dụng (1) và Khóa bí mật của ứng dụng (2). 

Bước 3: Dán mã vào ứng dụng Social Login

  1. Nhà bán hàng truy cập vào trang ứng dụng Social Login.
  2. Dán ID ứng dụng (1) và Khóa bí mật của ứng dụng (2) vào Client ID (1) và Client Secret (2) tương ứng. 

  3. Nhấn chọn Cập nhật.
Bây giờ Nhà bán hàng có thể theo dõi được lượng người tương tác với Website của bạn thông qua cổng đăng nhập nhanh Social Login. 

Cấu hình Google

Việc cấu hình Google trong ứng dụng giúp Nhà bán hàng đo lường (tracking) lượng người dùng từ tài khoản Google tương tác với cửa hàng thông qua ứng dụng Social Login.

Cũng giống như Facebook, Google App sở hữu nhiều tính năng hữu ích giúp mang lại nhiều trải nghiệm tốt hơn cho người dùng trong quá trình sử dụng website. Khi Nhà bán hàng yêu cầu khách hàng đăng nhập, đăng kí tài khoản truy cập website, họ có thể đăng nhập bằng tài khoản Gmail. Vậy, để đăng nhập trực tiếp được bằng tài khoản Gmail và sử dụng một số tính năng của nó, website cần cài đặt Google API.

Cấu hình Google này chính cấu hình từ Google API trên trang https://console.developers.google.com

Để thực hiện được việc này, Nhà bán hàng cần làm hai thao tác:

  1. Tạo Google App API
  2. Cấu hình trong giấy giới thiệu

Xem chi tiết cách thao tác tại đây. xem mục Tạo API để đăng nhập bằng tài khoản Google.

Khi cấu hình giấy giới thiệu trong tab OAuth consent screen, Nhà bán hàng điền hai url này:

  • Privacy policyhttp://multiapp.haravan.com/social-login/policy
  • Terms of servicehttp://multiapp.haravan.com/social-login/terms

Trong bước chọn loại Credentials, Nhà bán hàng:

  1. chọn OAuth 2.0 client ID.
  2. Tiếp theo Nhà bán hàng chọn thể loại ứng dụng ( Application Type ) là Web application. Điền đầy đủ các thông tin như hướng dẫn sau: 


    • #Authorized JavaScript origins (2)
      http://multiapp.haravan.com
      https://multiapp.haravan.com
    • #Authorized redirect URIs (3)
      http://multiapp.haravan.com/social-login/zauth/google/callback    https://multiapp.haravan.com/social-login/zauth/google/callback

Sau khi thực hiện hoàn tất, Nhà bán hàng sao chép thông tin client ID và client secret để sử dụng cho việc thiết lập thông tin ứng dụng Google trong các ứng dụng Social Login




TIN DÙNG BỞI HƠN 15.000 DOANH NGHIỆP VÀ CÁC THƯƠNG HIỆU HÀNG ĐẦU

Haravan - Công ty công nghệ cung cấp giải pháp kinh doanh thương mại điện tử, duy nhất tại Việt Nam được Google lựa chọn vào chương trình bệ phóng tiềm năng với hỗ trợ và đào tạo công nghệ để vươn ra thị trường quốc tế vững chắc.