Đăng ký để nhận ngay ưu đãi tốt nhất





Banner register
Trang chủ » Tạo popup form với fancybox cho website wordpress

Tạo popup form với fancybox cho website wordpress

Tạo popup form với fancybox cho website wordpress

Popup form hiện nay được sử dụng rất phổ biến trên các website, nhằm mục đích tăng sự nổi bật cho trang web và tăng sự thuận tiện cho người dùng đăng ký thông tin.

Tạo popup form trong website wordporess như thế nào? Trong bài viết này mình sẽ hướng dẫn chi tiết cách làm, cụ thể là dùng plugin contact form 7 kết hợp với thư viện fancybox 3.

Nghe có vẻ phức tạp nhưng làm thì rất đơn giản, bạn theo dõi tiếp bài viết nha …

Tạo form với contact form 7

Bạn vào phẩn quản lý của plugin contact 7 và bấm tạo form mới, sau đó dán đoạn code sau vào phần nội dung của form.

Sau đó bạn bấm lưu lại, contact form 7 sẽ trả lại cho bạn một mã shortcode để dùng hiển thị form (ví dụ shortcode: [contact-form-7 404 "Not Found"]).

Tạo form mới trong contact form 7

Tạo form mới trong contact form 7

Chèn thư viện fancybox 3 vào website

Các bạn cần truy cập vào thư mục theme đang sử dụng, sau đó làm các bước sau.

Copy đoạn code dưới và dán vào trong cặp thẻ <head></head> trong file header.php

Copy đoạn code dưới và dán vào trước thẻ đóng </body> trong file footer.php

HIển thị form

Bạn copydán đoạn code sau vào file footer.php

Bạn thay shortcode bằng shortcode form mà bạn đã tạo trong contact form 7.

Code CSS

Code JS

Vậy là mình đã hướng dẫn xong, bạn có thể xem demo trực tiếp tại đây

Cảm ơn bạn đã theo dõi bài viết!