Cách Thêm Đăng Nhập Bằng Mạng Xã Hội Vào WordPress (Cách Dễ Dàng)

Mục lục

Bạn có muốn thêm thông tin đăng nhập bằng mạng xã hội vào website WordPress của mình không?

Đăng nhập xã hội cho phép người dùng tạo tài khoản với website WordPress của bạn bằng cách sử dụng tài khoản mạng xã hội hiện có của họ. Thay vì tạo tên người dùng hoặc mật khẩu mới, người dùng chỉ cần đăng nhập bằng Facebook, Google hoặc nền tảng khác. Điều này giúp họ tiết kiệm thời gian, giảm ma sát và vẫn cho phép bạn truy cập vào tên / địa chỉ email của họ cho mục đích marketing trong tương lai.

Trong bài viết này, WPBeginner Việt Nam sẽ chỉ cho bạn cách thêm tính năng đăng nhập bằng mạng xã hội vào WordPress.

Cách thêm đăng nhập xã hội vào WordPress (cách dễ dàng)

Tại sao nên thêm tính năng đăng nhập bằng mạng xã hội vào WordPress?

Có nhiều lý do tại sao bạn có thể muốn cho phép đăng ký người dùng trên website WordPress của mình. Nếu bạn đang điều hành một cửa hàng trực tuyến, thì việc đăng ký người dùng cho phép người mua lưu thông tin thanh toán và giao hàng của họ. Điều này giúp họ dễ dàng mua lại trong tương lai.

Đăng ký người dùng cũng là một phần quan trọng khi tạo website thành viên WordPress.

Tuy nhiên, hầu hết mọi người không thích điền vào mẫu đăng ký người dùng dài dòng và phải nhớ thêm một tên người dùng/mật khẩu nữa.

Đăng nhập xã hội cho phép người dùng tạo tài khoản với website của bạn chỉ bằng cách nhấp vào nút. Họ có thể sử dụng tên người dùng và mật khẩu từ tài khoản mạng xã hội hiện có của họ, chẳng hạn như thông tin đăng nhập Facebook của họ.

Vì rất tiện lợi, đăng nhập bằng mạng xã hội có thể khuyến khích nhiều người đăng ký với website của bạn hơn. Với điều đó, chúng ta hãy xem cách bạn có thể thêm đăng nhập bằng mạng xã hội vào WordPress.

Video hướng dẫn

Đăng ký WPBeginner

Nếu bạn thích hướng dẫn bằng văn bản, hãy đọc tiếp.

Cách Thêm Đăng Nhập Bằng Mạng Xã Hội Vào WordPress

Cách dễ nhất để thêm đăng nhập giao diện vào website WordPress của bạn là sử dụng Nextend Social Đăng nhập và Đăng ký plugin.

Plugin miễn phí này cho phép người truy cập đăng nhập bằng Facebook, Twitter hoặc Google.

Ghi chú: Bạn muốn thêm đăng nhập xã hội cho một website khác ngoài Facebook, Twitter hoặc Google? Ngoài ra còn có phiên bản Nextend Social Login pro bổ sung đăng nhập xã hội cho nhiều website khác nhau bao gồm PayPal, Slack và TikTok.

Đầu tiên, bạn cần cài đặt và kích hoạt plugin Nextend. Để biết thêm chi tiết, vui lòng xem hướng dẫn dành cho người mới bắt đầu về cách cài đặt plugin WordPress.

Sau khi kích hoạt, hãy đi tới Cài đặt » Đăng nhập mạng xã hội Nextend trong khu vực quản trị WordPress. Trên màn hình này, bạn sẽ thấy tất cả các option đăng nhập mạng xã hội khác nhau mà bạn có thể thêm vào trang WordPress của mình.

Thêm đăng nhập xã hội vào website WordPress của bạn

Quá trình thêm thông tin đăng nhập bằng mạng xã hội vào website của bạn sẽ khác nhau tùy thuộc vào việc bạn thêm thông tin đăng nhập bằng Facebook, Twitter hay Google.

Hãy lấy Facebook làm ví dụ.

Để thêm tính năng đăng nhập bằng Facebook vào website WordPress của bạn, hãy nhấp vào nút ‘Bắt ​​đầu’ bên dưới logo Facebook.

Tại thời điểm này, bạn có thể nhận được cảnh báo rằng Facebook chỉ cho phép Chuyển hướng OAuth HTTPS. Điều này có nghĩa là website của bạn phải sử dụng HTTPS trước khi bạn có thể thêm đăng nhập Facebook vào WordPress. Để thiết lập, hãy xem hướng dẫn của WPBeginner Việt Nam về cách chuyển từ HTTP sang HTTPS trong WordPress.

Sau khi sử dụng HTTPs, nhiệm vụ tiếp theo của bạn là tạo ứng dụng Facebook. Điều này cho phép bạn tạo App Key và App Secret, mà bạn sẽ thêm vào plugin Nextend.

Việc tạo ứng dụng Facebook nghe có vẻ kỹ thuật, nhưng đừng lo lắng. Bạn không cần biết bất kỳ code nào và WPBeginner Việt Nam sẽ hướng dẫn bạn từng bước.

Để tạo ứng dụng này, bạn sẽ cần phải chuyển đổi giữa dashboard WordPress của mình và Nhà phát triển Facebook website. Với suy nghĩ đó, bạn nên để dashboard WordPress mở trong tab hiện tại và truy cập Facebook Developers trong một tab mới.

Trong tab Nhà phát triển trên Facebook, chỉ cần nhấp vào nút ‘Tạo ứng dụng’.

Trang web dành cho developer Facebook

Bây giờ bạn có thể chọn loại ứng dụng. Vì chúng ta muốn thêm đăng nhập xã hội vào WordPress, hãy tiếp tục và nhấp vào ‘Người tiêu dùng’.

Sau đó, cuộn xuống cuối màn hình và nhấp vào nút ‘Tiếp theo’.

Thêm đăng nhập Facebook vào WordPress

Trong trường ‘Tên hiển thị’, nhập tên bạn muốn sử dụng cho ứng dụng Facebook. Tên này sẽ được hiển thị cho người dùng, vì vậy bạn sẽ muốn sử dụng tên mà họ có thể nhận ra như tên website WordPress của bạn.

Tiếp theo, nhập địa chỉ email của bạn vào trường ‘Email liên hệ của ứng dụng’.

Đây là địa chỉ mà Facebook sẽ sử dụng để cảnh báo bạn về các vi phạm chính sách tiềm ẩn và hạn chế ứng dụng hoặc chia sẻ thông tin về cách bạn có thể khôi phục tài khoản đã xóa. Với lưu ý đó, bạn sẽ muốn nhập địa chỉ email mà bạn thường xuyên kiểm tra.

Tạo đăng nhập xã hội cho WordPress

Nếu bạn có nhiều trang Facebook, thì bạn có thể đã tạo một tài khoản Facebook Business Manager. Tài khoản này cho phép bạn cấp cho các thành viên trong nhóm quyền truy cập toàn bộ hoặc một phần vào các trang Facebook của bạn mà không cần chia sẻ thông tin đăng nhập của bạn.

Nếu bạn đã tạo tài khoản Facebook Business Manager, thì bạn có thể kết nối ứng dụng mới với tài khoản quản lý của mình bằng cách mở dropdown menu ‘Tài khoản doanh nghiệp’. Sau đó, chỉ cần chọn một người quản lý tài khoản từ dropdown menu.

Nếu bạn không có Trình quản lý doanh nghiệp trên Facebook, bạn chỉ cần để dropdown menu này ở chế độ “Không có tài khoản Trình quản lý doanh nghiệp nào được chọn”, đây là cài đặt mặc định.

Cài đặt Trình quản lý doanh nghiệp Facebook

Sau đó, bạn đã sẵn sàng nhấp vào nút ‘Tạo ứng dụng’.

Trong popup xuất hiện, hãy nhập mật khẩu tài khoản Facebook của bạn rồi nhấp vào nút ‘Gửi’.

Bây giờ bạn đã sẵn sàng thêm sản phẩm vào ứng dụng Facebook. Hãy tiếp tục và tìm phần Đăng nhập Facebook rồi nhấp vào nút ‘Thiết lập’.

Thêm bảng đăng nhập xã hội vào WordPress

Tiếp theo, chỉ cần nhấp vào ‘Web’.

Trong trường URL website, hãy nhập URL website của bạn.

Trang web dành cho developer Facebook

Để có được URL đúng, chỉ cần chuyển về tab đang hiển thị dashboard WordPress của bạn.

Màn hình này có hướng dẫn chi tiết về cách link Nextend với Facebook. Bao gồm hiển thị URL chính xác mà bạn nên sử dụng.

Cài đặt plugin đăng nhập xã hội Nextend

Sau khi nhập URL website của bạn vào trường ‘URL website’, hãy đảm bảo bạn nhấp vào nút ‘Lưu’ để Save Changes.

Trong menu bên trái, tìm phần ‘Đăng nhập Facebook’ và nhấp vào ‘Cài đặt’.

Cài đặt đăng nhập mạng xã hội Facebook

Trên màn hình này, bạn sẽ cần dán một lệnh chuyển hướng oAuth hợp lệ. Để có được giá trị này, chỉ cần chuyển lại tab WordPress của bạn.

Các hướng dẫn này bao gồm một URL được gắn nhãn là ‘URI chuyển hướng OAuth hợp lệ’. Bạn có thể tiếp tục và sao chép URL này.

URL chuyển hướng oAuth

Tiếp theo, hãy quay lại website Nhà phát triển Facebook và dán URL vào trường ‘URI chuyển hướng OAuth hợp lệ’.

Sau đó, bạn đã sẵn sàng nhấp vào nút ‘Lưu thay đổi’ ở phía dưới.

Thêm chuyển hướng đến đăng nhập xã hội

Trong menu bên trái, nhấp vào Cài đặt » Cơ bản.

Trong ‘Tên miền ứng dụng’, hãy nhập tên miền website của bạn.

Cấu hình đăng nhập mạng xã hội Facebook của bạn

Trong trường URL Chính sách bảo mật, bạn sẽ cần nhập địa chỉ chính sách bảo mật của website. Chính sách bảo mật này sẽ tiết lộ thông tin bạn thu thập từ người dùng và cách bạn định sử dụng dữ liệu đó, bao gồm mọi thông tin bạn nhận được từ thông tin đăng nhập xã hội.

Nếu bạn cần trợ giúp để tạo trang quan trọng này, vui lòng xem hướng dẫn của WPBeginner Việt Nam về cách thêm chính sách bảo mật vào WordPress.

Tạo chính sách bảo mật cho đăng nhập xã hội của bạn

Để tuân thủ GDPR, bạn phải cung cấp cho người dùng cách xóa tài khoản của họ trên website của bạn.

Có nhiều cách để cho phép người dùng xóa tài khoản WordPress của họ, nhưng bạn nên luôn chia sẻ những hướng dẫn này với người dùng của mình.

Để giúp người dùng tìm thông tin này, hãy nhấp vào phần ‘Xóa dữ liệu người dùng’, sau đó chọn ‘URL hướng dẫn xóa dữ liệu’ từ dropdown menu.

Sau đó, bạn có thể nhập hoặc sao chép/dán URL nơi người dùng có thể tìm thấy thông tin về cách xóa tài khoản của họ. Ví dụ: bạn có thể thêm hướng dẫn vào chính sách bảo mật hoặc trang Câu hỏi thường gặp của mình.

Cấu hình chính sách xóa dữ liệu của bạn cho GDPR

Sau khi thực hiện xong, hãy mở dropdown menu ‘Danh mục’ và chọn category phù hợp nhất với cách bạn định sử dụng tính năng đăng nhập bằng mạng xã hội trên website WordPress của mình.

Ví dụ, nếu bạn muốn thêm tính năng đăng nhập bằng Facebook vào cửa hàng WooCommerce của mình, thì thông thường bạn sẽ muốn nhấp vào category ‘Mua sắm’.

Chọn category đăng nhập xã hội cho Facebook

Sau khi thực hiện xong, bước tiếp theo là chọn Biểu tượng ứng dụng. Biểu tượng này sẽ đại diện cho ứng dụng của bạn trong Trung tâm ứng dụng, đây là khu vực của Facebook nơi người dùng có thể tìm thấy các ứng dụng mới.

Điều này không thực sự quan trọng đối với ứng dụng của WPBeginner Việt Nam, nhưng lại là yêu cầu bắt buộc nên bạn vẫn cần phải tạo icon ứng dụng.

Biểu tượng ứng dụng của bạn phải có kích thước từ 512 x 512 đến 1024 x 1024 pixel và phải có nền trong suốt. Khi tạo icon này, bạn không được sử dụng bất kỳ biến thể nào của logo, nhãn hiệu hoặc icon của Facebook bao gồm các thương hiệu WhatsApp, Oculus và Instagram.

Bạn cũng không thể đưa vào bất kỳ văn bản ‘Facebook’ hoặc ‘FB’ nào.

Nếu bạn chưa có, bạn có thể dễ dàng tạo icon ứng dụng Facebook chuyên nghiệp bằng công cụ tạo logo.

Sau khi tạo xong icon ứng dụng, hãy nhấp vào phần ‘Biểu tượng ứng dụng’ rồi chọn file hình ảnh mà bạn muốn sử dụng.

Thêm icon ứng dụng vào Facebook

Sau khi hoàn tất, hãy nhấp vào nút Lưu thay đổi.

Ứng dụng Facebook của bạn được đặt ở chế độ riêng tư theo mặc định. Điều này có nghĩa là bạn là người duy nhất có thể đăng nhập bằng Facebook.

Trước khi người dùng của bạn có thể tạo tài khoản bằng Facebook, bạn cần phải đưa ứng dụng của mình vào hoạt động. Để thực hiện việc này, hãy tìm slider ‘Chế độ ứng dụng: Phát triển’ và nhấp vào đó để chuyển slider từ màu trắng sang màu xanh.

Xuất bản ứng dụng đăng nhập xã hội Facebook của bạn

Ứng dụng Facebook có thể có ‘Quyền truy cập chuẩn’ hoặc ‘Quyền truy cập nâng cao’ vào thông tin của người dùng. Nếu ứng dụng của bạn có quyền truy cập chuẩn, thì người dùng sẽ không thể đăng nhập bằng cách sử dụng đăng nhập xã hội của Facebook.

Trước đây, Facebook đã thay đổi cài đặt quyền mặc định, vì vậy, bạn nên kiểm tra xem ứng dụng của mình có đủ quyền để hỗ trợ đăng nhập bằng mạng xã hội hay không.

Trong menu bên trái, nhấp vào Đánh giá ứng dụng » Quyền và tính năng.

Cấu hình quyền của ứng dụng Facebook

Bây giờ, hãy tìm các quyền ’email’ và ‘public_profile’.

Để hỗ trợ đăng nhập bằng mạng xã hội, cả hai quyền này phải được đánh dấu là ‘Quyền truy cập nâng cao’ và ‘Sẵn sàng sử dụng’ như bạn có thể thấy trong hình ảnh sau.

Cài đặt quyền nâng cao của Facebook

Bạn có thấy nút ‘Nhận quyền truy cập nâng cao’ không? Điều này có nghĩa là ứng dụng của bạn hiện không có quyền phù hợp để đăng nhập bằng mạng xã hội.

Trong trường hợp này, bạn cần nhấp vào nút ‘Nhận quyền truy cập nâng cao’, sau đó làm theo hướng dẫn trên màn hình.

Khi bạn có quyền Truy cập nâng cao, hãy tiếp tục và nhấp vào Cài đặt » Cơ bản trong menu bên trái.

Ở đầu trang, bạn sẽ thấy ‘ID ứng dụng’ và ‘Bí mật ứng dụng’.

ID ứng dụng Facebook và Bí mật ứng dụng

Để tiết lộ bí mật của ứng dụng, chỉ cần nhấp vào nút ‘Hiển thị’ rồi nhập mật khẩu tài khoản Facebook của bạn.

Trang web dành cho developer của Facebook hiện sẽ cập nhật để hiển thị Bí mật ứng dụng của bạn.

Bước tiếp theo là thêm App secret và App ID vào plugin Nextend của bạn. Để thực hiện việc này, hãy chuyển lại dashboard WordPress.

Tại đây, hãy nhấp vào tab ‘Cài đặt’. Bây giờ bạn có thể dán ID và bí mật vào các trường ‘ID ứng dụng’ và ‘Bí mật ứng dụng’ trong dashboard WordPress của bạn.

Sau khi thực hiện xong, hãy nhấp vào nút Lưu thay đổi.

Trước khi đi xa hơn, bạn nên kiểm tra xem đăng nhập xã hội của mình đã được thiết lập đúng chưa. Để thực hiện việc này, chỉ cần nhấp vào nút Xác minh cài đặt.

Xác minh thông tin đăng nhập xã hội của bạn trong WordPress

Thao tác này sẽ mở một popup nơi bạn có thể nhập tên người dùng và mật khẩu Facebook của mình. Nếu bạn đã thiết lập đúng cách đăng nhập xã hội, thì bây giờ bạn sẽ được đăng nhập vào blog WordPress của mình.

Ngay cả khi đăng nhập xã hội của bạn đang hoạt động, Nextend vẫn có thể cảnh báo bạn rằng nhà cung cấp hiện đang bị vô hiệu hóa. Nếu bạn thấy cảnh báo này, chỉ cần nhấp vào nút Bật.

Kích hoạt đăng nhập xã hội của Nextend

Bây giờ bạn đã thêm thành công chức năng đăng nhập xã hội vào website WordPress của mình. Bước tiếp theo là thay đổi giao diện và hoạt động của nút đăng nhập trên website của bạn.

Để tạo kiểu cho nút đăng nhập xã hội, chỉ cần nhấp vào tab ‘Nút’. Bây giờ bạn sẽ thấy tất cả các kiểu khác nhau mà bạn có thể sử dụng cho nút đăng nhập xã hội.

Để sử dụng một kiểu khác, chỉ cần nhấp để chọn nút radio của kiểu đó.

Các nút đăng nhập mạng xã hội khác nhau

Sau khi thực hiện xong, bạn có thể thay đổi văn bản mà Nextend hiển thị trên nút này bằng cách chỉnh sửa văn bản ‘Nhãn đăng nhập’.

Bạn cũng có thể áp dụng một số định dạng cơ bản cho nhãn đăng nhập. Ví dụ, trong hình ảnh sau, WPBeginner Việt Nam đang áp dụng hiệu ứng in đậm bằng cách sử dụng Thẻ HTML.

Chỉnh sửa nhãn đăng nhập Facebook

Ngoài ra, bạn cũng có option thay đổi văn bản mà nút này sử dụng cho ‘Nhãn link’. Đây là văn bản mà Nextend hiển thị khi người dùng đã tạo tài khoản trên website của bạn nhưng chưa link tài khoản đó với Facebook.

Bạn có thể sử dụng nhãn link để khuyến khích người dùng đã đăng nhập kết nối tài khoản của họ với nhiều hồ sơ mạng xã hội khác nhau.

Để thay đổi văn bản này, chỉ cần nhập vào trường ‘Nhãn link’. Một lần nữa, bạn có thể sử dụng HTML để áp dụng một số định dạng cơ bản cho văn bản nhãn.

Bạn cũng nên tạo điều kiện thuận lợi cho người dùng ngắt kết nối hồ sơ mạng xã hội của họ khỏi website WordPress của bạn.

Đây chính là nơi trường ‘Hủy link nhãn’ xuất hiện.

Trong trường này, bạn có thể nhập văn bản mà website của bạn sẽ hiển thị cho người dùng đã đăng nhập và kết nối tài khoản mạng xã hội của họ với website của bạn.

Bằng cách nhấp vào link này, người dùng sẽ có thể ngắt kết nối giữa website WordPress của bạn và tài khoản mạng xã hội của họ.

Những thiết lập này đủ cho hầu hết các website. Tuy nhiên, nếu bạn muốn tạo một nút hoàn toàn custom, thì bạn luôn có thể chọn hộp ‘Sử dụng nút custom’.

Phần này sẽ thêm một mục mới, nơi bạn có thể tạo nút đăng nhập mạng xã hội của riêng mình bằng code.

Tạo nút đăng nhập custom bằng code

Khi bạn đã hài lòng với cách tạo kiểu cho nút của mình, hãy nhấp vào nút Lưu thay đổi.

Tiếp theo, nhấp vào tab ‘Sử dụng’. Nextend sẽ hiển thị tất cả các shortcode mà bạn có thể sử dụng để thêm nút đăng nhập xã hội vào website WordPress của mình.

Mã ngắn đăng nhập xã hội

Các shortcode này có thể tạo ra một loạt các nút đăng nhập. Để tạo một nút đăng nhập cơ bản cho Facebook, bạn sẽ sử dụng shortcode sau:

[nextend_social_login provider=”facebook”]

Hình ảnh sau đây cho thấy ví dụ về cách nút đăng nhập bằng mạng xã hội này sẽ trông như thế nào trên website của bạn.

Nút đăng nhập mạng xã hội Facebook

Như bạn có thể thấy trong tab ‘Sử dụng’, có một vài tham số bổ sung mà bạn có thể thêm vào shortcode của mình. Điều này sẽ thay đổi giao diện hoặc hoạt động của nút.

Nếu bạn muốn tạo nút đăng nhập xã hội không có nhãn văn bản, thì bạn có thể thêm tham số ‘icon’, ví dụ [nextend_social_login provider=”facebook” style=”icon”]

Sau đây là ví dụ về giao diện của nút này trên website WordPress của bạn.

Cách thêm đăng nhập xã hội vào WordPress

Khi người dùng đăng nhập vào website của bạn bằng tài khoản mạng xã hội, bạn có thể tự động chuyển hướng họ đến một trang. Màn hình này có một shortcode mẫu sẽ chuyển hướng người dùng đến website Nextend.

Bạn có thể dễ dàng custom shortcode này để chuyển hướng người truy cập đến một trang trên website WordPress của bạn.

Một shortcode với các tham số chuyển hướng

Có một số tham số khác mà bạn có thể thêm vào shortcode của mình, để xem danh sách đầy đủ các tham số, hãy nhấp vào link trong tài liệu plugin.

Sau khi quyết định shortcode nào bạn muốn sử dụng, bạn có thể thêm code vào bất kỳ trang, bài đăng hoặc khu vực sẵn sàng cho tiện ích nào. Để biết hướng dẫn từng bước, hãy xem hướng dẫn dành cho người mới bắt đầu của WPBeginner Việt Nam về cách thêm shortcode vào WordPress.

Chúng tôi hy vọng bài viết này giúp bạn biết cách thêm đăng nhập xã hội vào website WordPress của mình. Bạn cũng có thể xem qua hướng dẫn của WPBeginner Việt Nam về các plugin phương tiện truyền thông xã hội tốt nhất cho WordPress và cách theo dõi người dùng website vào website WordPress của bạn.

Nếu bạn thích bài viết này, vui lòng đăng ký theo dõi WPBeginner Việt Nam Kênh Youtube cho các video hướng dẫn về WordPress. Bạn cũng có thể tìm thấy WPBeginner Việt Nam trên TwitterFacebook.

5/5 - (76 bình chọn)
Facebook
Twitter
LinkedIn
Telegram
Email
Đội Ngũ Biên Tập
WordPress

Cách di chuyển đúng cách từ Weebly sang WordPress (2024)

Bạn có muốn chuyển từ Weebly sang WordPress không? Có, bạn có thể di chuyển toàn bộ content Weebly của mình sang WordPress mà không cần thuê developer hoặc biết cách lập trình. Chúng tôi đã xây dựng một công cụ nhập Weebly sang WordPress miễn phí có thể thực

Đọc tiếp »