Hướng dẫn thêm widget Đăng Ký Email vào website HTML tùy chỉnh

Form thu thập email khách hàng: modal, slide-up, hoặc inline. Tích hợp vào HTML tùy chỉnh chỉ trong vài phút.

Xem Demo → Dùng miễn phí

Tổng quan

Với website HTML tĩnh hoặc tự code, bạn chỉ cần dán đoạn script tag vào file HTML. Đơn giản nhất trong tất cả các cách nhúng.

Widget Đăng Ký Email của Widget.vn giúp bạn form thu thập email khách hàng: modal, slide-up, hoặc inline. Bài viết này hướng dẫn bạn từng bước nhúng widget vào HTML tùy chỉnh, từ đăng ký tài khoản đến hoàn tất tích hợp.

Tại sao nên dùng widget Đăng Ký Email?

  • Thu thập email khách hàng tiềm năng
  • 3 kiểu hiển thị: modal, slide-up, inline
  • Tùy chỉnh thời gian hiển thị popup
  • Tích hợp API gửi email marketing

Bước 1: Tạo widget trên Widget.vn

Trước tiên, bạn cần tạo và cấu hình widget Đăng Ký Email trên dashboard Widget.vn.

  1. 1Truy cập Widget.vn và đăng ký tài khoản miễn phí
  2. 2Vào Dashboard → Tạo Widget mới → Chọn "Đăng Ký Email"

Bước 2: Cấu hình widget Đăng Ký Email

Thiết lập các tùy chọn cho widget theo nhu cầu doanh nghiệp:

  1. 1Chọn kiểu hiển thị: modal, slide-up, hoặc inline
  2. 2Cấu hình tiêu đề và nội dung mời đăng ký
  3. 3Thiết lập thời gian delay trước khi hiển thị
  4. 4Kết nối webhook nhận dữ liệu subscriber

Bước 3: Lấy mã nhúng

Sau khi cấu hình xong, sao chép mã nhúng từ dashboard:

<script src="https://api.widget.vn/v1/loader.js"
  data-widget-id="YOUR_WIDGET_ID"
  data-api="https://api.widget.vn"
  data-cdn="https://api.widget.vn"
  async defer></script>

Thay YOUR_WIDGET_ID bằng ID widget thực từ dashboard Widget.vn.

Bước 4: Nhúng vào HTML tùy chỉnh

Làm theo các bước sau để nhúng widget vào HTML tùy chỉnh:

  1. 1Mở file HTML của trang cần nhúng widget (ví dụ: index.html)
  2. 2Tìm vị trí muốn hiển thị widget trong <body>
  3. 3Dán đoạn mã nhúng widget vào vị trí đó
  4. 4Lưu file và mở trình duyệt để kiểm tra
  5. 5Widget sẽ tự động tải và render tại vị trí đã chọn

Mẹo khi nhúng vào HTML tùy chỉnh

  • Đặt script tag trước </body> để không block render trang
  • Thuộc tính async defer đảm bảo widget tải không đồng bộ
  • Có thể nhúng nhiều widget trên cùng một trang
  • Hoạt động với mọi hosting: Apache, Nginx, Netlify, Vercel, GitHub Pages

Xem Demo Trực Tiếp

Trải nghiệm widget Đăng Ký Email trước khi nhúng vào website:

Mở Demo →