Tạo biểu mẫu đăng nhập và đăng ký cho Elementor

Nếu bạn muốn tạo một trang web thành viên nơi mọi người đăng ký để tận dụng các tính năng đặc biệt thì tốt hơn bạn nên tạo một trang đăng nhập và đăng ký chuyên dụng. Điều này sẽ cho phép bạn làm cho trang web của mình trở nên chuyên nghiệp hơn nhiều, yêu cầu thêm thông tin người dùng trong quá trình đăng ký, v.v.

Vì vậy, chúng tôi đã tổng hợp một hướng dẫn chi tiết để giúp bạn tạo trang đăng nhập và đăng ký tùy chỉnh bằng cách sử dụng plugin xây dựng trang Elementor .

plugin xây dựng trang phổ biến và có nhiều tính năng nhất dành cho WordPress. Phiên bản miễn phí của plugin đi kèm với rất nhiều khối và tiện ích để xây dựng trang web cơ bản. Trong khi đó, phiên bản chuyên nghiệp của plugin tồn tại cung cấp các khối và tiện ích nâng cao hơn.

Giờ đây, tiện ích trình tạo biểu mẫu đi kèm với Elementor đã bị khóa bên trong phiên bản chuyên nghiệp của nó. Tuy nhiên, thay vì sử dụng Elementor Pro để xây dựng biểu mẫu đăng ký của bạn, chúng tôi khuyên bạn nên sử dụng plugin Ultimate Addon cho Elementor (UAE) vì nó đi kèm với nhiều khối và tiện ích mạnh mẽ so với Elementor Pro.

Mục lục

Lợi ích của việc tạo trang đăng ký tùy chỉnh

Chỉ xét riêng về chức năng, không có vấn đề gì khi sử dụng trang đăng ký có giao diện chung trên trang web của bạn. Nhưng nếu bạn làm điều này, bạn sẽ bỏ lỡ rất nhiều lợi ích đi kèm với một trang đăng ký được thiết kế riêng cho trang web của bạn.

Dưới đây là một số lợi ích chính của việc tạo trang đăng ký tùy chỉnh để bạn có ý tưởng:

1. Cá nhân hóa trang đăng ký người dùng

Với sự trợ giúp của các trang đăng ký tùy chỉnh, bạn có thể tạo biểu mẫu đăng ký với các trường tùy chỉnh và thiết kế chúng theo yêu cầu của bạn. Bạn có thể tạo kiểu cho các biểu mẫu phù hợp với nhu cầu và yêu cầu của mình để chúng phù hợp với ý tưởng kinh doanh và trang web của bạn.

Tiện ích Biểu mẫu đăng ký người dùng có thể được sử dụng cho các mục đích sau:

  • Một giải pháp tao nhã để trở thành thành viên của cửa hàng trực tuyến
  • Biểu mẫu đăng ký WordPress tùy chỉnh để phản ánh doanh nghiệp của bạn
  • Một biểu mẫu an toàn cho các diễn đàn và trang web học tập điện tử
  • Một mẫu đăng ký tùy chỉnh cho các trang web thành viên

2. Thu thập tất cả thông tin cần thiết từ một biểu mẫu duy nhất

Nếu có một thông tin cụ thể mà bạn muốn thu thập từ các thành viên của mình, bạn có thể đưa thông tin đó vào mẫu đăng ký của mình.

Vì vậy, người dùng không chỉ có thể chọn tên người dùng và mật khẩu, chỉ có vậy thôi. Bạn có thể thêm nhiều trường biểu mẫu như tên, địa chỉ email, chi tiết liên hệ, v.v. Bạn có thể xây dựng các biểu mẫu toàn diện một cách trang nhã với sự trợ giúp của các trường tùy chỉnh mà bạn có thể tạo một phần của biểu mẫu đăng ký của mình.

3. Tùy chỉnh trải nghiệm người dùng

Bạn có thể cung cấp trải nghiệm người dùng tùy chỉnh cho các thành viên của mình. Điều này có thể chuyển hướng người dùng đến một trang cụ thể, giúp họ tự động đăng nhập vào tài khoản của mình hoặc gửi email vào hộp thư đến của họ.

4. Chống thư rác và tăng cường bảo mật

Với việc bổ sung Honeypot và ReCaptcha, bạn có thể chống lại những kẻ gửi thư rác và ngăn chặn việc đăng ký giả mạo.

5. Hoàn hảo cho phong cách thương hiệu của bạn

Biểu mẫu đăng ký sẽ trông giống như các trang khác trên trang web của bạn. Với các biểu mẫu đăng ký tùy chỉnh, bạn có thể tạo các biểu mẫu phù hợp với doanh nghiệp của mình.

Làm cách nào để tạo biểu mẫu đăng ký người dùng tùy chỉnh bằng Elementor?

Bây giờ bạn đã hiểu cơ bản về cách biểu mẫu đăng ký người dùng tùy chỉnh có thể giúp bạn kinh doanh, đây là hướng dẫn từng bước toàn diện về cách sử dụng Elementor và tiện ích bổ sung UAE để giúp bạn tạo trải nghiệm đăng nhập người dùng tùy chỉnh của riêng mình.

Dưới đây là hướng dẫn ba bước về cách bạn có thể tạo Biểu mẫu đăng ký người dùng cho trang web của mình.

Lưu ý : Trước khi tiếp tục, hãy đảm bảo rằng bạn đã bật Tư cách thành viên bằng cách đi tới Bảng điều khiển > Cài đặt > Chung > Tư cách thành viên: Đã bật .

1.png

Kích hoạt tùy chọn Thành viên sẽ cho phép bất kỳ người dùng nào đăng ký trên trang web của bạn.

Bước 1: Tạo biểu mẫu đăng ký người dùng bằng cách sử dụng Plugin UAE (Ultimate Addon for Elementor)

Để tạo Biểu mẫu đăng ký người dùng tùy chỉnh, hãy đảm bảo rằng bạn có phiên bản cập nhật của plugin UAE , với khối được kích hoạt.

Khi bạn đã đảm bảo các điều kiện tiên quyết để tạo trang đăng nhập, bạn cần tạo hoặc thêm Trang mới. Và chỉnh sửa trang mà bạn muốn đính kèm Mẫu đăng ký người dùng.

Nếu bạn kéo và thả tiện ích, bạn có thể thấy Trường biểu mẫu mặc định.

2.png

Bạn có thể thử nghiệm với các trường - bạn có thể xóa trường mà bạn không yêu cầu hoặc thêm các trường khác như Tên người dùng, Tên, v.v.

Có một tùy chọn để quản lý Độ rộng Cột và Độ rộng Cột bắt buộc trên các trường biểu mẫu riêng lẻ.

Bạn cũng có thể quản lý Kích thước đầu vào và nhãn của các trường (cho dù bạn muốn hiển thị hay ẩn chúng) hoặc Dấu bắt buộc.

Bước 2: Định cấu hình cài đặt biểu mẫu của bạn

Sau khi trình bày những điều cơ bản, bạn có thể định cấu hình cài đặt biểu mẫu bằng cách truy cập Cài đặt chung . Bạn có thể thực hiện các chức năng sau từ đây:

  • Vai trò người dùng mới
  • Chọn 'Hành động sau khi đăng ký'

Đây là một tài khoản chi tiết của cả hai:

Vai trò người dùng mới

Nếu bạn có một trang web thành viên yêu cầu người dùng đăng ký trên trang web của bạn thì theo mặc định, bạn đang chỉ định 'Vai trò người dùng' là Người đăng ký .

Bạn có thể đặt Vai trò người dùng mặc định cho các thành viên của mình và vai trò được chỉ định sẽ được đặt cho tất cả người dùng mới khi họ đăng ký trên trang web của bạn.

Không có tiêu đề.png

Hành động chọn sau khi đăng ký

4.png

Người dùng có thể chọn các Hành động sau mà anh ta có thể thực hiện sau khi tự đăng ký trên một trang web thành viên, bằng cách sử dụng tiện ích Biểu mẫu đăng ký người dùng:

  • Tự động đăng nhập : với tùy chọn này, bạn có thể cho phép người dùng đăng nhập tự động vào trang web của mình. Sau khi cung cấp thông tin đăng nhập lần đầu, người dùng sẽ không phải đăng nhập lại vì sẽ tự động đăng nhập vào trang web sau khi đăng ký thành công.
  • Chuyển hướng sau khi đăng ký : với tùy chọn này, bạn có thể chuyển hướng người dùng đến trang chào mừng hoặc trang đăng nhập - sau khi đăng ký thành công. Bạn có thể đặt trang chuyển hướng bằng cách dán URL của Trang mong muốn vào trường URL bên dưới tùy chọn này.
  • Gửi email: khi người dùng đăng ký thành công trên trang web của bạn, tùy chọn này sẽ gửi email cho anh ta xác nhận việc đăng ký của mình. Nội dung của email có thể tùy chỉnh và bạn có thể cá nhân hóa những email này để ấm áp hơn. Tuy nhiên, nếu bạn muốn gửi cùng một email cho tất cả người dùng của mình, bạn cũng có thể thực hiện điều đó bằng cách khám phá tùy chọn này.
5.png
  • Ẩn sau khi đăng ký: Đôi khi, bạn có thể muốn ẩn biểu mẫu đăng ký người dùng sau khi họ đăng ký thành công trên trang web của bạn. Với tùy chọn 'Ẩn sau khi đăng ký', bạn có thể ẩn biểu mẫu đăng ký trong khi dẫn họ đến trang đăng nhập hoặc chỉ đơn giản là hiển thị thông báo 'Thành công' sau khi cung cấp cho họ liên kết đến trang đăng nhập để có quyền truy cập vào trang web. Bạn có thể tìm thấy tùy chọn này trong phần Cài đặt chung trong tab Nội dung của tiện ích.

Tiếp tục, bạn có thể thiết kế và tạo kiểu cho biểu mẫu đăng ký người dùng bằng cách sử dụng tab Kiểu của tiện ích.

Sau khi thực hiện việc này, bạn đã hoàn tất quá trình tạo và cấu hình cho tiện ích Biểu mẫu đăng ký người dùng. Biểu mẫu đã sẵn sàng để hiển thị trực tuyến trên Trang web Trực tiếp.

Bước 3: Thêm mẫu đăng ký người dùng vào trang web của bạn

Phần này khá cơ bản và đơn giản. Bạn có thể kéo và thả trực tiếp để thêm tiện ích này, giống như bất kỳ tiện ích Elementor nào khác. Bạn cũng có thể lưu phần chứa tiện ích và tìm nạp Phần đã lưu trong trang Đăng ký được yêu cầu.

6.png

Dưới đây chúng tôi đã giải thích thêm một số cách để giúp thêm bất kỳ tiện ích nào vào trình chỉnh sửa Elementor.

ví dụ: đối với Biểu mẫu đăng ký người dùng trên trang WooC Commerce

Nếu bạn muốn tạo một trang WooC Commerce tùy chỉnh, tức là Trang tài khoản của tôi, dưới tên là Trang tài khoản tùy chỉnh, bạn chỉ cần:

Chỉ cần nhấp vào nút 'Chỉnh sửa bằng Elementor' và bạn sẽ chuyển đến trình chỉnh sửa Elementor.

Chúng ta có thể tạo một biểu mẫu đăng ký khác giống như thế này và Lưu nó để sử dụng trên Trang Tài khoản Tùy chỉnh bằng cách thực hiện theo các bước tương tự nêu trên.

Cuối cùng, để đặt trang là 'Trang tài khoản của tôi', hãy truy cập Bảng điều khiển WordPress. Và đi theo đường dẫn sau trong tùy chọn WooC Commerce:

WooC Commerce > Cài đặt > Nâng cao > Thiết lập trang > Trang tài khoản của tôi > Trang tài khoản của tôi > chọn Trang tài khoản tùy chỉnh

8.png

Bạn có thể xem trang chứa UAE trên trang Tài khoản WooC Commerce.

Phần kết luận:

Bạn có thể tạo một biểu mẫu đăng ký phong cách, với tùy chọn tùy chọn mà bạn chọn, cho trang web của mình bằng Elementor và UAE .

Bằng cách làm theo các bước được đưa ra trong bài viết này, bạn có thể đăng ký người dùng bằng tiện ích Biểu mẫu đăng ký người dùng của UAE . Đó là một giải pháp đơn giản và tinh tế để tạo biểu mẫu đăng ký người dùng phong cách cho người dùng mới của bạn.

Để lại một bình luận

Địa chỉ email của bạn sẽ không được công bố. Các trường bắt buộc được đánh dấu *