Khi bạn có một trang web kinh doanh, biểu mẫu là một yếu tố quan trọng. Chúng giúp khách hàng liên hệ với bạn dễ dàng hơn, đồng thời cung cấp thông tin và phản hồi quan trọng. Tuy nhiên, tìm ra cách tạo ra chúng có thể là một thách thức.

Nếu bạn đang tìm kiếm một chiến lược đơn giản, dễ hiểu, chúng tôi khuyên bạn nên sử dụng các biểu mẫu Elementor. Trình tạo trang phổ biến này cung cấp các giải pháp để xây dựng các biểu mẫu khác nhau vừa đẹp mắt về mặt thẩm mỹ vừa dễ sử dụng.

Trong bài đăng này, chúng tôi sẽ thảo luận lý do tại sao bạn có thể muốn tạo biểu mẫu Elementor. Sau đó, chúng tôi sẽ hướng dẫn bạn quy trình làm như vậy và bao gồm một số bổ trợ hữu ích và mẹo khắc phục sự cố. Hãy nhảy vào!

Tại sao tạo biểu mẫu Elementor

Có rất nhiều lợi thế để tạo biểu mẫu cho trang web WordPress của bạn. Đối với những người mới bắt đầu, bạn có thể cung cấp cho khách truy cập một phương pháp liên lạc với bạn nhanh chóng và đơn giản. Ngoài ra, bạn có thể sử dụng chúng để tạo khách hàng tiềm năng và thu được thông tin quan trọng từ khán giả của mình.

Biểu mẫu cũng có thể là công cụ hữu ích để đăng ký người dùng của bạn và chấp nhận thanh toán. Tuy nhiên, nếu bạn muốn thêm một biểu mẫu vào trang web WordPress của mình, bạn cần sử dụng một plugin. Ngoài ra, bạn có thể sử dụng trình tạo trang như Elementor.

Elementor cho phép bạn tạo các biểu mẫu tuyệt đẹp mà không cần chạm vào dòng mã. Bạn có thể sử dụng trình chỉnh sửa kéo và thả để tạo các biểu mẫu đáp ứng phù hợp với thương hiệu và thẩm mỹ trang web của bạn.

Bạn cũng có thể chọn từ nhiều loại biểu mẫu, bao gồm:

  • Elementor Contact Forms : bạn có thể sử dụng tính năng này để tạo một biểu mẫu đơn giản để người dùng liên hệ với bạn.
  • Elementor Gravity Forms : widget Gravity Forms này giúp bạn linh hoạt hơn trong việc tùy chỉnh và tạo kiểu cho các biểu mẫu của mình.
  • Elementor Register Forms : tính năng này cho phép bạn thiết lập các biểu mẫu đăng ký người dùng trên trang web của mình.

Như bạn có thể thấy, mỗi biểu mẫu này có trường hợp sử dụng cụ thể riêng và có thể giúp nâng cao chức năng của trang web của bạn. Tiếp theo, chúng tôi sẽ hướng dẫn bạn cách tạo biểu mẫu liên hệ bằng Elementor.

Cách tạo biểu mẫu liên hệ Elementor trong WordPress (trong 6 bước)

Bây giờ chúng ta đã hiểu thêm về lý do tại sao bạn có thể muốn sử dụng biểu mẫu Elementor, hãy xem cách bạn có thể tạo một biểu mẫu trong một vài bước đơn giản. Lưu ý rằng đối với hướng dẫn này, chúng tôi giả sử bạn đã cài đặt và kích hoạt Elementor trên trang web của mình.

Có một công cụ miễn phí và plugin trả phí. Để truy cập các tính năng của biểu mẫu, bạn sẽ cần phiên bản cao cấp.

Bước 1: Thêm tiện ích liên hệ Elementor

Để bắt đầu, hãy điều hướng đến trang hoặc bài đăng mà bạn muốn chèn biểu mẫu liên hệ của mình. Sau đó, nhấp vào nút Edit with Elementor ở đầu màn hình:

Click on edit with Elementor
Nhấp vào liên kết “Chỉnh sửa với Elementor”.

Thao tác này sẽ khởi chạy giao diện trình soạn thảo Elementor. Từ các tiện ích bên trái, hãy tìm kiếm và chọn tiện ích Biểu mẫu :

Find the form module and drag and drop it
Kéo và thả tiện ích “Biểu mẫu”.

Sau đó, bạn có thể kéo và thả tiện ích vào trang của mình. Điều này sẽ chèn một biểu mẫu liên hệ tiêu chuẩn.

Bước 2: Thiết lập các trường trong biểu mẫu liên hệ của bạn

Khi bạn đặt biểu mẫu liên hệ của mình trên trang, sẽ có một số cài đặt để bạn định cấu hình. Bây giờ, hãy tập trung vào việc thiết lập các trường biểu mẫu.

Bạn có thể chỉnh sửa các trường biểu mẫu cơ bản bằng cách nhấp vào tiện ích và tùy chỉnh văn bản (nếu bạn muốn thay đổi bất kỳ tùy chọn mặc định nào). Nếu bạn muốn thêm các trường bổ sung, bạn có thể làm như vậy bằng cách chọn Thêm mục :

Customize the form by adding an item
Tùy chỉnh biểu mẫu bằng cách thêm một mục.

Bạn có thể chọn loại trường bạn muốn thêm từ danh sách thả xuống. Tiếp theo, bạn có thể thêm nhãn, là tên của trường biểu mẫu. Điều này cho khách truy cập của bạn biết những gì đầu vào được mong đợi.

Đối với tùy chọn Trình giữ chỗ , bạn có thể tùy chỉnh văn bản xuất hiện trong trường biểu mẫu trước khi người dùng nhập thông tin của họ. Bạn có thể sử dụng điều này để cung cấp cho khách truy cập các ví dụ về dữ liệu bạn muốn họ cung cấp.

Ngoài ra, bạn có thể chọn bật cài đặt Bắt buộc và sửa đổi chiều rộng cột. Bạn cũng có thể nhấp vào bảng điều khiển Nút để tùy chỉnh giao diện của các nút biểu mẫu của bạn. Bạn có thể thay đổi kích thước cũng như phông chữ và màu sắc.

Bước 3: Định cấu hình việc gửi biểu mẫu của bạn

Sau khi bạn tạo xong các trường biểu mẫu, bước tiếp theo là định cấu hình cài đặt gửi biểu mẫu của bạn. Bạn có thể điều hướng đến Email trong trình chỉnh sửa Elementor để truy cập các tùy chọn khác nhau.

Ví dụ: bạn có thể nhập địa chỉ email của mình vào trường Tới nơi bạn muốn gửi. Bạn có thể nhập nhiều địa chỉ email nếu muốn:

Configure Elementor form subbmissions
Định cấu hình gửi biểu mẫu của bạn.

Bạn cũng có thể tùy chỉnh chủ đề của email và tin nhắn. Khi bạn hoàn tất việc định cấu hình tất cả các tùy chọn, hãy nhớ lưu các thay đổi của bạn.

Bước 4: Tùy chỉnh tin nhắn trong biểu mẫu liên hệ của bạn

Nếu bạn muốn cá nhân hóa thêm biểu mẫu liên hệ của mình, bạn có thể làm như vậy bằng cách bật tính năng nhắn tin tùy chỉnh. Chọn Tùy chọn bổ sung , sau đó chuyển công tắc chuyển đổi cho Nhắn tin tùy chỉnh thành :

Customize the contact form messaging
Tùy chỉnh tin nhắn biểu mẫu liên hệ.

Có bốn loại thông báo bạn có thể sửa đổi:

  • Thông báo thành công: thông báo này xuất hiện sau khi người dùng gửi biểu mẫu
  • Thông báo Lỗi : thông báo này sẽ xuất hiện nếu có vấn đề trong quá trình gửi
  • Thông báo bắt buộc : để thông báo cho người dùng rằng một trường cụ thể chưa được hoàn thành
  • Thông báo không hợp lệ : để cho người dùng biết rằng điều gì đó với việc gửi biểu mẫu đang tắt

Bạn có thể tùy chỉnh những thông điệp này để phù hợp với tiếng nói và phong cách của thương hiệu. Ví dụ: bạn có thể sửa đổi từ ngữ để thêm một chút cá tính.

Đăng kí để nhận thư mới

Bước 5: Tạo kiểu cho Biểu mẫu liên hệ Elementor của bạn

Khi bạn đã quan tâm đến văn bản và các trường cơ bản của biểu mẫu, bạn có thể bắt đầu tạo kiểu dáng cho biểu mẫu liên hệ Elementor của mình. Ví dụ: bạn có thể muốn đảm bảo rằng nó phù hợp với thương hiệu của bạn.

Để bắt đầu, bạn có thể nhấp vào tab Kiểu ở đầu trình chỉnh sửa tiện ích con:

Style the Elementor form
Tạo kiểu và thiết kế biểu mẫu.

Tại đây, bạn sẽ tìm thấy nhiều tùy chọn và cài đặt khác nhau mà bạn có thể sử dụng để tùy chỉnh thiết kế của biểu mẫu liên hệ của mình. Ví dụ: bạn có thể điều chỉnh khoảng cách và phần đệm, cũng như thay đổi màu sắc, kích thước, nhãn và các nút.

Bước 6: Lưu và xuất bản biểu mẫu của bạn

Khi bạn hài lòng với giao diện và nội dung của biểu mẫu liên hệ Elementor của mình, điều duy nhất cần làm là lưu và xuất bản nó. Bạn có thể làm như vậy bằng cách chọn nút Xuất bản ở dưới cùng bên trái của màn hình.

Đó là nó! Sau đó, bạn có thể xem trước biểu mẫu liên hệ của mình trên giao diện người dùng để xác nhận rằng biểu mẫu đó trông như bạn muốn.

Addons hàng đầu cho các biểu mẫu Elementor

Ngoài ra, trình tạo trang Elementor đi kèm với nhiều tùy chọn để xây dựng biểu mẫu cho trang web WordPress của bạn. Tuy nhiên, bạn cũng có thể cân nhắc thêm các plugin để giúp mở rộng chức năng của các biểu mẫu của mình. Chúng ta hãy xem xét một số tùy chọn.

Master Addons cho Elementor

Master Addons for Elementor
Master Addons cho Elementor.

Plugin Master Addons cho Elementor là một công cụ miễn phí cung cấp một bộ sưu tập các công cụ hữu ích để nâng cao trình tạo trang và đến lượt nó, trang web của bạn. Nó bao gồm các tính năng sau:

Bạn đang vật lộn với các vấn đề về thời gian chết và WordPress? Kinsta là giải pháp lưu trữ được thiết kế để tiết kiệm thời gian cho bạn! Kiểm tra các tính năng của chúng tôi
  • Trình tạo đầu trang, chân trang và nhận xét
  • Trình tạo Menu Mega
  • Hiệu ứng di chuột qua hình ảnh
  • Điều kiện hiển thị

Nó cũng tương thích với nhiều loại plugin biểu mẫu. Điều này bao gồm Biểu mẫu liên hệ 7, Biểu mẫu Ninja, Biểu mẫu WP và Biểu mẫu Caldera. Để truy cập tất cả các tính năng của plugin, bạn cần mua phiên bản chuyên nghiệp, có sẵn với giá 39 đô la mỗi năm.

The Plus Addons

The Plus Addons for Elementor
The Plus Addons.

Một công cụ tiện dụng khác mà bạn có thể sử dụng với Elementor là Plus Addons. Plugin này được đóng gói với hơn 8.000 tùy chọn tùy chỉnh và hơn 300 khối Giao diện người dùng (UI) có thể giúp bạn tạo và thiết kế các trang và biểu mẫu của mình một cách dễ dàng.

Các tính năng của nó bao gồm:

  • Hộp biểu tượng
  • Các phần bản đồ
  • Các hình thức
  • Bảng định giá

Ngoài ra còn có hơn 18 mẫu bạn có thể lựa chọn. Chúng được thiết kế đặc biệt cho một số loại hình doanh nghiệp, bao gồm cơ quan, nhà hàng, tiệm ăn, v.v.

Có một phiên bản miễn phí có sẵn. Tuy nhiên, để tận dụng toàn bộ bộ tính năng hữu ích, chúng tôi khuyên bạn nên mua giấy phép cao cấp, có sẵn với giá 39 đô la mỗi năm.

Các mẹo và thủ thuật bổ sung để tạo các biểu mẫu Elementor

Nếu bạn muốn tạo biểu mẫu liên hệ Elementor cho trang web WordPress của mình mà không phải trả phí cho giấy phép cao cấp, bạn có thể thực hiện theo cách này. Làm như vậy sẽ yêu cầu bạn ghép nối trình tạo trang với một plugin biểu mẫu WordPress khác, chẳng hạn như WPForms hoặc Form domains.

Giả sử bạn chọn Dạng có thể quyết định. Sau khi cài đặt và kích hoạt plugin trên trang web của mình, bạn có thể điều hướng đến Form Does > Forms > Add New :

Adding a new form using Formidable Forms
Các hình thức đáng gờm.

Tiếp theo, bạn có thể chọn Biểu mẫu liên hệ từ danh sách các tùy chọn và chọn từ một số mẫu được tạo sẵn. Khi bạn hoàn thành việc xây dựng biểu mẫu của mình, hãy duyệt đến trang bạn muốn đặt biểu mẫu và khởi chạy giao diện trình chỉnh sửa Elementor.

Từ bảng điều khiển bên trái, hãy tìm kiếm và chọn tiện ích Mẫu có định dạng. Bạn có thể điều chỉnh định dạng, màu sắc, nút, văn bản, v.v.:

Selecting the Formidable Forms widget in Elementor.
Tiện ích Form Does Forms trong Elementor.

Khi hoàn tất, bạn có thể lưu và xuất bản các thay đổi của mình. Phương pháp này đòi hỏi nhiều thời gian và nỗ lực hơn mức cần thiết với plugin Elementor Pro. Tuy nhiên, nó có thể giúp bạn tiết kiệm một số tiền nếu bạn không muốn mua gói cao cấp.

Khắc phục sự cố Biểu mẫu phần tử

Biểu mẫu liên hệ Elementor khá đơn giản và dễ sử dụng. Tuy nhiên, bạn có thể gặp sự cố khi sử dụng nó. Một trong những vấn đề phổ biến nhất mà mọi người báo cáo là email chưa được gửi.

Elementor sử dụng chức năng wp_mail để phân phối các email của nó. Điều này có nghĩa là nhà cung cấp dịch vụ lưu trữ của bạn nhận email đã gửi và gửi nó.

Tuy nhiên, một số máy chủ vô hiệu hóa chức năng PHP thường được sử dụng để gửi email, đó là lý do tại sao sự cố này có thể xảy ra. Để giải quyết lỗi này, chúng tôi khuyên bạn nên liên hệ với nhà cung cấp dịch vụ lưu trữ của mình và yêu cầu họ bật chức năng send_mail.

Ngoài ra, bạn có thể sử dụng máy chủ Giao thức Truyền Thư Đơn giản (SMTP). Đây là một máy chủ email sẽ định tuyến email của bạn dưới dạng biểu mẫu đến hộp thư đến của khách hàng, sử dụng một nguồn bên ngoài như Gmail. Điều này có thể làm giảm khả năng email của bạn bị đưa vào thư mục spam. Để thiết lập SMTP, bạn có thể sử dụng một plugin như WP MAIL SMTP.

Bản tóm tắt

Biểu mẫu đóng một vai trò quan trọng trong các trang web. Chúng cho phép khách hàng liên hệ với bạn, đăng ký tài khoản, gửi thông tin thanh toán và hơn thế nữa. Tuy nhiên, việc tìm ra cách thiết kế các biểu mẫu đẹp mắt về mặt thẩm mỹ cho trang web của bạn có thể là một thách thức. May mắn thay, Elementor làm cho nó dễ dàng.

Khi bạn thêm tiện ích biểu mẫu Elementor vào trang của mình, bạn có thể thiết lập các trường của mình và định cấu hình cài đặt biểu mẫu. Bạn cũng có thể tùy chỉnh thiết kế của biểu mẫu để nó phù hợp với thương hiệu của bạn.

Bạn có bất kỳ câu hỏi nào về việc tạo biểu mẫu Elementor trong WordPress? Cho chúng tôi biết trong phần ý kiến dưới đây!


Tiết kiệm thời gian, chi phí và tối đa hóa hiệu suất trang web với:

  • Trợ giúp tức thì từ các chuyên gia lưu trữ WordPress, 24/7.
  • Tích hợp Cloudflare Enterprise.
  • Tiếp cận khán giả toàn cầu với 34 trung tâm dữ liệu trên toàn thế giới.
  • Tối ưu hóa với Giám sát Hiệu suất Ứng dụng được tích hợp sẵn của chúng tôi.

Tất cả những điều đó và hơn thế nữa, trong một kế hoạch không có hợp đồng dài hạn, hỗ trợ di chuyển và đảm bảo hoàn tiền trong 30 ngày. Kiểm tra các kế hoạch của chúng tôi hoặc nói chuyện với bộ phận bán hàng để tìm ra kế hoạch phù hợp với bạn.