Hướng dẫn thêm Contact Form Slide Out trong WordPress

Nếu doanh nghiệp của bạn phụ thuộc vào việc thu hút khách hàng tiềm năng mới từ contact form trên trang web thì một trong những cách tốt nhất để phát triển nguồn khách hàng tiềm năng là làm cho contact form của bạn trở nên đáng chú ý hơn. Trong bài viết này, CunghocWP sẽ hướng dẫn cách thêm contact form slide out trong WordPress mà không làm phiền tới người dùng.

Tại sao phải thêm contact form Slide Out trong WordPress?

Nhiều chủ doanh nghiệp nhỏ tạo trang web với hi vọng rằng việc này sẽ giúp họ phát triển kinh doanh, do đó bạn cần thêm trang contact form để người dùng có thể liên hệ với bạn.

Tuy nhiên, vấn đề là hầu hết người dùng có câu hỏi sẽ rời khỏi trang web của bạn mà không liên hệ với bạn.

Đây là lý do tại sao nhiều trang web phổ biến đều thêm các popup contact form, slider trong contact form hoặc nút CTA để mở các contact form.

Các tùy chọn động và tương tác này chuyển hướng sự chú ý của người dùng đến contact form và cho phép họ điền vào form mà không cần truy cập trang khác. Các form này làm tăng đáng kể chuyển đổi của bạn, đây là lý do tại sao bạn thấy chúng ở khắp mọi nơi.

Hãy cùng xem cách tạo contact form Slide Out trong WordPress.

Thêm contact form Slide Out trong WordPress

Trong hướng dẫn này, bạn sẽ cần tới WPForms – plugin contact form WordPress tốt nhất trên thị trường hiện nay.

Bạn có thể sử dụng phiên bản miễn phí của plugin contact form WPForms nếu không cần tới tất cả các tính năng cao cấp.

Bạn cũng cần OptinMonster – phần mềm tối ưu hóa chuyển đổi quyền lực nhất để chuyển đổi khách truy cập trang web thành khách hàng. Họ có các gói Pro cung cấp quyền truy cập vào tính năng canvas mà CunghocWP sẽ sử dụng trong hướng dẫn này.

Bước 1. Tạo contact form trong WordPress

Trước tiên, bạn cần cài đặt và kích hoạt plugin WPForms. Để biết thêm chi tiết, hãy xem hướng dẫn của CunghocWP về cách cài đặt plugin WordPress.

Sau khi kích hoạt, truy cập trang WPForms » Add New để tạo contact form. Thao tác này sẽ khởi chạy giao diện trình tạo WPForms.

Nhập tên cho contact form và chọn template ‘Select contact form’.

WPForms sẽ tải một contact form đơn giản. Bạn sẽ thấy bản xem trước form ở phía bên phải. Bạn có thể nhấp vào bất kỳ trường nào để chỉnh sửa hoặc thêm các trường mới từ cột bên trái.

 

Sau khi hoàn tất việc chỉnh sửa form, click vào Save để lưu các thay đổi.

Tiếp theo, click vào nút Embed ở trên cùng để lấy mã nhúng của form.

Thao tác này sẽ mở ra một popup hiển thị shortcode của form. Sao chép shortcode này để sử dụng trong bước tiếp theo.

Bước 2. Tạo một Optin Slide Out trong OptinMonster

Bây giờ chúng ta sẽ tạo một chiến dịch slide out được hiển thị contact form mà bạn đã tạo ở bước đầu tiên.

Đầu tiên, bạn cần cài đặt và kích hoạt plugin OptinMonster. Hãy tham khảo bài viết của CunghocWP để cài đặt plugin WordPress một cách nhanh nhất.

Plugin này hoạt động như một trình kết nối giữa trang web và tài khoản OptinMonster của bạn.

Sau khi kích hoạt, hãy nhấp vào menu OptinMonster trong thanh quản trị WordPress và nhập khóa API của bạn. Bạn có thể lấy thông tin này từ tài khoản của mình trên trang web OptinMonster.

Sau khi nhập khóa license, click vào ‘Create new optin’ ở góc trên cùng bên phải của màn hình.

Thao tác này sẽ đưa bạn đến trang web OptinMonster.

OptinMonster cung cấp các loại chiến dịch động khác nhau. Đối với hướng dẫn này, CunghocWP sẽ sử dụng chiến dịch ‘Slide in’. Tiếp tục và chọn ‘Slide in’ làm loại chiến dịch của bạn.

Tiếp theo, bạn cần chọn template. OptinMonster cung cấp một số template dựng sẵn, bạn cần chọn ‘Canvas’ cho hướng dẫn này.

Sau khi chọn template, bạn cần nhập tên cho chiến dịch của mình. Điều này giúp bạn định vị chiến dịch trong dashboard OptinMonster của mình một cách dễ dàng.

Bây giờ OptinMonster sẽ tải giao diện trình tạo chiến dịch.

Bạn sẽ thấy bản xem trước trực tiếp của chiến dịch của mình ở bên phải. Vì CunghocWP đang sử dụng template canvas nên vào thời điểm này template không có gì cả.

Ở bên trái, bạn sẽ thấy các tab khác nhau. Trong phần ‘General Optin Settings’, bạn cần nhập URL trang web bên dưới tùy chọn ‘Optin campaign website’.

Tiếp theo, bạn cần chuyển sang tab ‘Optin’. Tại đây, bạn có thể chọn màu sắc, chiều cao và chiều rộng cho optin của mình.

Tiếp tục chọn màu bạn thích và điều chỉnh chiều rộng & chiều cao để hiển thị toàn bộ form của bạn một cách độc đáo.

Sau đó, bạn cần cuộn xuống phần ‘Canvas custom HTML’ và nhập shortcode WPForms bạn đã sao chép trước đó.

Nhập shortcode sẽ không hiển thị form của bạn bên trong chiến dịch slide-in bởi vì shortcode chỉ hoạt động trên trang WordPress riêng.

Bây giờ bạn có thể nhấp vào nút ‘Save’ ở trên cùng để lưu trữ cài đặt và click vào ‘Publish’.

Trên màn hình tiếp theo, bạn cần thay đổi trạng thái optin thành đã publish để thêm optin vào trang web WordPress của bạn.

Bước 3. Hiển thị contact form Slide Out trong WordPress

Bạn đã tạo contact form và chiến dịch slide out, bây giờ là lúc hiển thị cả hai trên trang web của bạn.

Truy cập trang OptinMonster trong khu vực quản trị WordPress. Bạn sẽ thấy chiến dịch slide out được tạo gần đây được liệt kê ở đó.

Click vào liên kết ‘Edit output settings’ để quyết định cách bạn muốn hiển thị trên trang web của mình.

Trên màn hình tiếp theo, hãy nhớ chọn box bên cạnh tùy chọn ‘Enable optin on site?’. OptinMonster cho phép bạn chọn người có thể xem optin. Bạn cũng có thể chọn khu vực cụ thể để hiển thị optin trên trang web.

Đừng quên nhấp vào nút Save để lưu trữ các thay đổi.

Bây giờ bạn có thể truy cập trang web của mình để xem contact form slide out đang hoạt động như thế nào. Hãy nhớ sử dụng chế độ ẩn danh trong trình duyệt hoặc đăng xuất khỏi WordPress để bạn có thể xem chính xác những gì người dùng sẽ thấy.

Theo mặc định, chiến dịch slide out sẽ xuất hiện trong 5 giây sau khi trang được tải xong. Tuy nhiên, bạn có thể thay đổi điều này.

Bạn có thể tạo vô số quy tắc để hiển thị chiến dịch bất cứ khi nào phù hợp với các điều kiện nhất định.

Ví dụ: bạn có thể hiển thị form slide out khi người dùng đã cuộn 50% trang, khi người dùng sắp rời khỏi trang, vv…

CunghocWP hi vọng bài viết này sẽ giúp bạn tìm hiểu cách thêm contact form slide out trong WordPress. Bạn cũng có thể muốn xem danh sách các mẹo hữu ích của CunghocWP để thúc đẩy traffic đến trang web WordPress của mình.

Nếu thích bài viết này, hãy theo dõi YouTube Channel để xem thêm các video hướng dẫn về WordPress. Bạn cũng có thể tìm kiếm CunghocWP trên Twitter hoặc Facebook.