Bỏ qua đến nội dung chính

Cách tùy chỉnh biểu mẫu đăng ký và đăng nhập WooCommerce

Divi: chủ đề WordPress dễ sử dụng nhất

Divi: Chủ đề WordPress tốt nhất mọi thời đại!

hơn Tải xuống 701.000, Divi là chủ đề WordPress phổ biến nhất trên thế giới. Nó là hoàn chỉnh, dễ sử dụng và đi kèm với hơn 62 mẫu miễn phí. [Khuyến nghị]

Bạn đã bao giờ tự hỏi làm thế nào bạn có thể thay đổi các trang đăng nhập và đăng ký WooCommerce của mình?

Nếu bạn đang sử dụng WooCommerce cho cửa hàng trực tuyến của mình, thì bạn đã khá quen thuộc với cái sau. Nó là một trong những nền tảng Thương mại điện tử tốt nhất hiện nay.

Bạn không thể bỏ qua thực tế là nó rất thuận tiện để sử dụng và có thể mang lại lợi ích cho cửa hàng trực tuyến của bạn rất nhiều. Có rất nhiều bộ sưu tập của Chủ đề WordPress et Các plugin và tiện ích mở rộng WooCommerce để giúp bạn làm điều đó.

Tuy nhiên, một số tính năng của nó như đăng nhập WooCommerce hoặc biểu mẫu đăng ký WooCommerce khá hạn chế. Đây là những gì chúng tôi sẽ đề cập trong bài viết này.

Nhưng trước đây, nếu bạn chưa bao giờ cài đặt WordPress khám phá Làm thế nào để cài đặt một bước 7 blog WordPress et Làm thế nào để tìm kiếm, cài đặt và kích hoạt một chủ đề WordPress trên blog của bạn 

Sau đó trở lại lý do tại sao chúng ta ở đây.

Tại sao phải tùy chỉnh biểu mẫu đăng nhập và đăng ký WooCommerce?

Tùy chọn trường hạn chế:

Biểu mẫu đăng ký và đăng nhập WooCommerce mặc định có đầy đủ các trường để người dùng tạo tài khoản. Tuy nhiên, nếu bạn muốn thêm một vài trường khác, bạn không thể làm điều đó theo mặc định. Bạn không thể thêm và hiển thị các trường như hộp kiểm, menu thả xuống, địa chỉ thanh toán và giao hàng khi cần hoặc muốn.

Các trang đăng nhập và đăng ký riêng biệt

Theo mặc định, các biểu mẫu đăng nhập và đăng ký WooCommerce được hiển thị trên cùng một trang. Mặc dù điều này cũng rất hữu ích, bạn không thể tạo các trang riêng biệt để đăng nhập và đăng ký biểu mẫu nếu bạn muốn. Bạn phải sử dụng mã hoặc một số plugin khác để khắc phục điều này.

Giới hạn thiết kế

Đối với một số người dùng, biểu mẫu đăng nhập và đăng ký WooCommerce mặc định có thể hơi buồn tẻ và nhàm chán. Thật không may, WooCommerce không cung cấp cho bạn tùy chọn để tùy chỉnh chúng. Do đó, bạn không thể sử dụng các màu, định dạng văn bản hoặc đường viền khác nhau trên biểu mẫu mặc định.

Tùy chỉnh biểu mẫu đăng nhập và đăng ký WooCommerce của bạn:

Hầu hết các tùy chỉnh của trang đăng nhập WooCommerce và biểu mẫu đăng ký của bạn có thể dễ dàng thực hiện chỉ với một plugin, Đăng ký người dùng. Đây là một plugin đặc biệt tập trung vào việc tạo các biểu mẫu đăng nhập và đăng ký hiệu quả cho trang web của bạn. Nó có một giao diện hỗ trợ chức năng kéo và thả  mà bạn có thể dễ dàng thực hiện các tùy chỉnh của mình mà không cần mã hóa.

Tất cả những gì bạn cần làm là để cài đặt và kích hoạt nó.

Đăng ký người dùng đăng ký Woocommerce đăng nhập

Bạn cũng cần thêm một số phần mở rộng của nó.Addon WooCommerce có thể giúp tiếp tục hơn nữa. Nhờ addon này, bạn có thể tích hợp các biểu mẫu đăng ký tùy chỉnh của mình vào WooCommerce một cách dễ dàng và khắc phục các hạn chế của WooCommerce.

Ur woocommerce

Sau đó, bạn có thể sử dụng nó để tạo biểu mẫu đăng nhập hoặc đăng ký WooCommerce và bắt đầu chỉnh sửa chúng.

1. Thêm các trường bổ sung vào biểu mẫu đăng nhập hoặc đăng ký WooCommerce của bạn

Plugin Đăng ký Người dùng WordPress cung cấp cho bạn một tùy chọn để thêm nhiều trường hơn vào biểu mẫu đăng ký của bạn. Trước hết, bạn cần tạo một biểu mẫu đăng ký mới từ đó đi đến Đăng ký người dùng >> Thêm mới trong bảng điều khiển WordPress.

Khám phá quá Cách thêm hình nền trong WordPress

Bạn có thể sử dụng các trường của Thanh toán và vận chuyển WooCommerce bổ sung từ tab Fields ở phía bên trái của màn hình.

Bạn thậm chí có thể thêm các trường bổ sung bằng menu thả xuống, hộp kiểm và nút radio nếu cần.

Có thể dễ dàng thêm các trường này bằng cách sử dụng chức năng kéo và thả của plugin Đăng ký người dùng WordPress. Các trường biểu mẫu mới của bạn sau đó sẽ hiển thị trên biểu mẫu đăng ký khi người dùng của bạn muốn tạo một tài khoản mới.

2. Thay thế biểu mẫu đăng nhập và đăng ký WooCommerce mặc định

Khi bạn đã tạo biểu mẫu đăng nhập hoặc đăng ký WooCommerce mới của mình, bạn nên thay thế nó bằng biểu mẫu WooCommerce mặc định.

Cũng xem hướng dẫn của chúng tôi trên Làm thế nào để thêm một cửa hàng WooCommerce trên Facebook

Tất cả những gì bạn cần làm là tiếp tục WooCommerce >> Cài đặt và mở tab Tài khoản và tính bảo mật. Theo phần Tạo tài khoản, kiểm tra Cho phép khách hàng tạo tài khoản trên trang "Tài khoản của tôi" và Lưu thay đổi.

Dễ dàng tạo trang web của bạn với Elementor

Elementor cho phép bạn dễ dàng tạo ra bất kỳ thiết kế trang web nào với một cái nhìn chuyên nghiệp. Ngừng trả tiền đắt cho những gì bạn có thể tự làm. [Miễn phí]

Thay thế các biểu mẫu mặc định đăng ký Woocommerce

Sau đó đi đến Đăng ký người dùng >> Cài đặt và mở tab WooCommerce. Tại đây, chọn hình thức đăng ký mà bạn muốn tích hợp. Sau đó, kiểm tra tùy chọn Thay thế trang đăng ký và lưu các thay đổi.

Đọc bài viết của chúng tôi về Làm thế nào để hiển thị một menu cho WooCommerce thuê bao có điều kiện của bạn

Bây giờ biểu mẫu đăng nhập WooCommerce được cá nhân hóa của bạn và biểu mẫu đăng ký sẽ được hiển thị.

Theo mặc định, cả biểu mẫu đăng nhập và đăng ký WooCommerce sẽ được hiển thị trên cùng một trang. Nhưng nếu bạn muốn hiển thị chúng trên các trang khác nhau, bạn cũng có thể làm điều đó bằng cách sử dụng plugin Đăng ký người dùng. Đầu tiên, tạo các trang riêng biệt cho các trang đăng ký và đăng nhập.

Để hiển thị riêng trang đăng nhập, thêm shortcode sau trên trang bạn muốn hiển thị. Bạn cũng nên chuyển hướng nó đến liên kết trang tài khoản sau khi người dùng đăng nhập. Chỉ cần thêm thông số chuyển hướng URL  đến liên kết của trang và xuất bản sau.

[user_registration_my-compte redirect_url = "liên kết trang tài khoản"]

Thay thế các biểu mẫu mặc định đăng ký woocommerce 1

Để hiển thị riêng trang đăng ký, bạn phải có shortcode đăng ký WooCommerce mà bạn đã tạo. Bạn có thể có nó bằng cách tiếp tục Đăng ký người dùng >> Đăng ký người dùng từ bảng điều khiển WordPress.

Bây giờ sao chép và dán mã ngắn vào nơi bạn muốn hiển thị biểu mẫu đăng ký. Sau đó xuất bản trang.

Ou

Bạn chỉ có thể sử dụng trình chỉnh sửa khối để xem biểu mẫu đăng ký mà bạn đã tạo. Chỉ cần tìm kiếm khối Đăng ký người dùng và chọn mẫu đăng ký bạn muốn xem. Sau đó xuất bản trang.

Thay thế các biểu mẫu mặc định đăng ký woocommerce 2

3. Hiển thị các trường bổ sung trên trang tài khoản

Sau khi đăng nhập hoặc đăng ký tài khoản mới, người dùng được chuyển đến trang Thứ compte. Nhưng các chi tiết bổ sung trên trang đăng nhập hoặc đăng ký WooCommerce có thể không được hiển thị trên trang tài khoản.

Đây là 10 plugin WordPress để thêm máy tính vào trang web của bạn

Nhưng khi bạn đã thay thế thành công biểu mẫu đăng nhập và đăng ký, bạn có thể xem chi tiết bổ sung của nó trên trang tài khoản. Cứ đi tiếp  Tài khoản của tôi >> Chi tiết Tài khoản.

Lưu ý: Giao diện của trang Tài khoản của tôi có thể khác nhau tùy theo chủ đề.

4. Tích hợp tài khoản WooCommerce trên trang thanh toán

Để thuận tiện cho khách hàng, bạn cũng có thể hiển thị biểu mẫu đăng ký được cá nhân hóa tại trang thanh toán với plugin Đăng ký người dùng. Bạn thậm chí có thể chọn những trường bạn muốn họ điền vào trang thanh toán. Để thêm tài khoản WooCommerce của bạn trên trang thanh toán, bạn chỉ cần làm theo các bước đã cho.

Đọc bài viết của chúng tôi về 10 plugin WordPress WooCommerce để sử dụng trên blog của bạn

Cứ đi tiếp WooCommerce >> Cài đặt và mở tab Tài khoản và tính bảo mật. Sau đó, trong phần Bảo mật tài khoản, kiểm tra tùy chọn Cho phép khách hàng tạo tài khoản trong quá trình xác thực đơn hàng.

Cho phép khách hàng tạo trang tài khoản tài khoản của tôi

Một lần nữa, điều hướng đến Đăng ký người dùng >> Cài đặt, và dưới tab WooCommerce, bạn sẽ thấy phần Đồng bộ hóa Đăng ký CheckoutĐây là đủ kiểm tra tùy chọn: Chọn tùy chọn này để đồng bộ hóa đăng ký người dùng với đăng ký thanh toán WooCommerce. Các trường bổ sung không có trên biểu mẫu đăng ký WooCommerce sẽ được hiển thị.

Tích hợp trang tài khoản đăng nhập và đăng nhập woocommerce

Sau đó, bạn chỉ cần chọn các trường bạn muốn hiển thị cho khách hàng của bạn trên biểu mẫu đăng ký thanh toán. Nó thậm chí còn bao gồm các trường địa chỉ thanh toán và giao hàng.

Bạn đang tìm kiếm các plugin và plugin WordPress tốt nhất?

Tải xuống các plugin và WordPress chủ đề tốt nhất trên Envato và dễ dàng tạo trang web của bạn. Đã tải xuống nhiều hơn 49.720.000. [ĐỘC QUYỀN]

Lần tới khi khách hàng của bạn muốn thanh toán, họ sẽ nhận được biểu mẫu với các trường cụ thể bổ sung để họ hoàn thành.

5. Thiết kế lại biểu mẫu đăng nhập và đăng ký WooCommerce

Đăng ký người dùng là một plugin tạo biểu mẫu WordPress tuyệt vời, thậm chí cho phép bạn tùy chỉnh đầy đủ các biểu mẫu đăng nhập và đăng ký WooCommerce.

Bạn có thể sử dụng addon Tùy biến phong cách để giúp bạn thay đổi giao diện của toàn bộ biểu mẫu đăng ký như bạn muốn. Nó khá dễ sử dụng vì nó có giao diện hỗ trợ chức năng Kéo và Thả với các tùy chọn xem trước thời gian thực.

Plugin addon kiểu tùy chỉnh

Tất cả những gì bạn cần làm là mua addon Style Customizer và chỉnh sửa biểu mẫu WooCommerce hiện có của bạn hoặc tạo một biểu mẫu mới. Sau đó nhấp vào nút có biểu tượng bàn chải ở phía dưới bên phải màn hình của bạn.

Bây giờ bạn sẽ có thể thấy bảng Customizer.

Tại đây bạn có thể thay đổi tất cả các loại yếu tố thiết kế cho các biểu mẫu đăng nhập và đăng ký của mình. Một số trong số chúng giải quyết giao diện tổng thể của biểu mẫu, nhãn trường, mô tả và kiểu nút radio hoặc nút hộp kiểm. Nó thậm chí còn có các tùy chọn bổ sung cho tiêu đề phần, bài đăng và CSS bổ sung.

Khi bạn hoàn tất việc tùy chỉnh chúng, hãy lưu chúng. Mọi thay đổi bạn thực hiện về tùy chỉnh kiểu dáng sẽ được tự động tích hợp trên biểu mẫu đăng nhập hoặc đăng ký WooCommerce.

Khám phá quá  Cách đặt mật khẩu bảo vệ các biểu mẫu WordPress của bạn

Vì vậy, bạn sẽ có thể thấy những thay đổi này ở bất cứ nơi nào bạn đặt biểu mẫu trên cửa hàng trực tuyến của mình.

Tóm tắt:

Dưới đây là một số mẹo hữu ích nhất về cách bạn có thể sử dụng và tùy chỉnh các khía cạnh khác nhau của biểu mẫu đăng nhập và đăng ký WooCommerce của mình. Nó có thể giúp ích rất nhiều trong việc thu hút một số lượng khách hàng đến với trang web của bạn với giao diện dễ dàng cho phép họ tạo hoặc đăng nhập vào tài khoản WooCommerce của họ.

Các plugin WordPress cao cấp bổ sung khác 

Đồng thời khám phá các plugin WordPress cao cấp khác giúp tối ưu hóa hiệu suất của blog hoặc trang web WordPress của bạn.

1. MapSVG

MapSVG est l’un des plugins WordPress de création d’annuaire les plus puissants et les plus performants. Il vous permet de transformer n’importe quel fichier SVG en cartes vectorielles interactives et en cartes entièrement personnalisables. Il vous permet de créer un répertoire d’entreprises địa phương, danh sách nhà cung cấp, v.v. Thư mục wordpress plugin Mapsvg

Il propose une carte pour tous les principaux pays du monde. Ses principales fonctionnalités sont : l’édition des cartes SVG dans n’importe quel éditeur de vecteurs afin de pouvoir facilement dessiner vos propres cartes, une base de données intégrée pour afficher tout type d’objet, des outils puissants de création de formulaire, pour renseigner la base de données, l’ajout des marqueurs de géolocalisation et autres.

Đọc bài viết của chúng tôi về Làm cách nào để giữ khách truy cập lâu hơn trên trang web của bạn

Tải về| Bản demo | Web hosting

2. Hình ảnh thu phóng

Plugin này cho phép bạn dễ dàng thêm tính năng thu phóng toàn cảnh cho hình ảnh trên blog WordPress của mình thông qua mã ngắn. Ví dụ, bạn có thể tích hợp nó vào bài viết hoặc trang của bạn.

Hình ảnh zoom pan plugin wordpress để thu phóng

Như các chức năng, bạn sẽ có trong số những chức năng khác: thu phóng toàn cảnh trên một hình ảnh duy nhất hoặc một thư viện với hình ảnh không giới hạn, vị trí của thanh điều khiển có thể ở trên, phải, dưới và trái, đáy của thùng chứa có thể tối, sáng và không có cái nào khác; bản xem trước trực tiếp trong trang tổng quan, ví dụ về nhiều phóng to toàn cảnh trên cùng một trang, v.v.

Khám phá cũng của chúng tôi 5 rút ngắn các plugin WordPress cao cấp

Tải về | Bản demo | Web hosting

3. Tự động hóa tiếp thị

Plugin WordPress cao cấp này cung cấp giao diện người dùng đơn giản và linh hoạt, mục đích của nó là giúp bạn dễ dàng tạo một bản tin mạnh mẽ trên trang web của bạn. Tính linh hoạt của nó sẽ cho phép bạn quản lý một loạt các sự kiện, điều kiện và hành động - vì vậy bạn có thể dễ dàng định cấu hình chiến lược tiếp thị email của mình để gửi, theo dõi và thu lợi nhuận từ nó.

Dễ dàng tạo Cửa hàng trực tuyến của bạn

Tải xuống miễn phí WooCommerce, các plugin thương mại điện tử tốt nhất để bán các sản phẩm vật lý và kỹ thuật số của bạn trên WordPress. [Đề xuất]

Tiếp thị tự động hóa plugin wordpress tạo trang web bản tin

Các chức năng chính của nó là: khả năng áp dụng logic có điều kiện dựa trên phản ứng và hành vi của khách truy cập, theo dõi hành động của khách truy cập trang web, hoàn hảo cho tất cả các chương trình khách hàng thân thiết, tuyệt vời cho các chiến lược tiếp thị đặt cược về phần thưởng, bảng điều khiển trực quan, phân khúc khách truy cập trang web, khả năng làm khảo sát, thông báo sms và qua email, cửa sổ bật lên dựa trên hành vi của khách truy cập, quảng cáo biểu ngữ dựa trên hành vi của khách truy cập và nhiều hơn nữa.

Tải về | Bản demo | Web hosting

Tài nguyên đề xuất

Tìm hiểu về các tài nguyên được đề xuất khác để giúp bạn xây dựng và quản lý trang web của mình.

Kết luận

Đây ! Đó là bài viết của chúng tôi hướng dẫn bạn cách tùy chỉnh biểu mẫu đăng ký và đăng nhập WooCommerce. Bây giờ bạn sẽ có  khả năng tạo biểu mẫu đăng ký và kết nối bitchy với plugin Đăng ký người dùng. Những chi tiết nhỏ như thế này rất quan trọng đối với cửa hàng trực tuyến của bạn để đảm bảo khách hàng của bạn sử dụng chúng thường xuyên.

Tuy nhiên, bạn cũng có thể tham khảo ý kiến tài nguyên của chúng tôi, nếu bạn cần thêm các yếu tố để thực hiện các dự án tạo trang Internet của mình, bằng cách tham khảo hướng dẫn của chúng tôi về Tạo blog WordPress hoặc một ngày Divi: chủ đề WordPress tốt nhất mọi thời đại.

Nếu bạn có bình luận hoặc đề xuất, đừng ngần ngại cho chúng tôi biết trong phần dành riêng. Nhưng trong lúc này, chia sẻ bài viết này trên các mạng xã hội khác nhau của bạn

... 

Bài viết này chứa comments 0

Để 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 *

Trang web này sử dụng Akismet để giảm bớt không mong muốn. Tìm hiểu thêm về cách sử dụng dữ liệu nhận xét của bạn.

Trở lại đầu trang
0 cổ phiếu
cổ phiếu
tweet
Enregistrer