Tạo và định vị biểu mẫu trượt vào

Published: 16 tháng 7, 2026 · Last updated: 21 tháng 7, 2026 · By Marcus Biel

Slide-in là một biểu mẫu đăng ký nhỏ gọn xuất hiện ở mép hoặc vị trí được chọn trên cửa sổ trình duyệt.

Nó thu hút nhiều sự chú ý hơn biểu mẫu được đặt bên trong trang, đồng thời che phủ ít phần website hơn Popup ở giữa. Slide-in phù hợp với lời nhắc đăng ký nhận bản tin, ưu đãi giảm giá, cập nhật sản phẩm và các ưu đãi ngắn cần luôn hiển thị khi khách truy cập đọc trang.

Hướng dẫn này giải thích các cài đặt riêng của Slide-in. Các chức năng chung về bố cục, nội dung, trường, thẻ, kiểu chữ, lớp và luồng đăng ký được đề cập trong hướng dẫn chính về Trình tạo biểu mẫu đăng ký.

Tạo Slide-in

Mở “Signup Forms”, nhấp vào “Create Form” và chọn “Slide-in”. Nhập tên nội bộ rõ ràng rồi tiếp tục đến trình tạo.

Bạn cũng có thể chỉnh sửa Slide-in hiện có bằng cách nhấp vào tên của biểu mẫu trong Tổng quan biểu mẫu đăng ký.

Hãy sử dụng tên như “Blog Newsletter Slide-in”, “New Product Reminder” hoặc “Summer Coupon Slide-in”. Tên nội bộ giúp bạn quản lý biểu mẫu và không tự động hiển thị với khách truy cập.

Chọn mẫu Slide-in

Slide-in cung cấp biểu mẫu trống, biểu mẫu tiêu chuẩn và bốn mẫu được thiết kế sẵn:

• Clean reminder
• Dark offer
• Warm coupon
• Minimal note

Các mẫu được thiết kế cho những thông điệp ngắn gọn, nhưng mọi thành phần vẫn có thể chỉnh sửa. Bạn có thể thay đổi nội dung, trường, màu sắc, kiểu chữ, đường viền, khoảng cách và nút gửi sau khi chọn mẫu ban đầu.

Thiết kế Slide-in

Sử dụng trình tạo trực quan để sắp xếp Slide-in. Biểu mẫu có thể bao gồm biểu mẫu đăng ký cùng với văn bản, hình ảnh, video, danh sách, nút, liên kết mạng xã hội, bộ đếm người đăng ký, khoảng trống hoặc đường phân cách.

Không gian bị giới hạn hơn so với Landing Page hoặc Embedded Form có chiều rộng lớn. Hãy tập trung vào ưu đãi và tránh thêm nội dung khiến khách truy cập phải tìm các trường hoặc nút gửi.

Chọn khối biểu mẫu đăng ký để cấu hình các trường, thông tin bắt buộc, thẻ ẩn, chỉ báo tiến trình, bộ đếm người đăng ký, ô nhập và nút gửi. Mở “Page settings” để thay đổi nền Slide-in và các mặc định về giao diện tổng thể.

Bố cục một cột thường là lựa chọn rõ ràng nhất. Nếu sử dụng nhiều cột, hãy kiểm tra kỹ cách chúng xếp chồng trên màn hình hẹp.

Chọn vị trí trên màn hình

Chọn khối biểu mẫu đăng ký và mở “Widget Settings”. Bộ chọn vị trí cung cấp một lưới ba nhân ba:

• Trên cùng bên trái, chính giữa phía trên hoặc trên cùng bên phải
• Chính giữa bên trái, chính giữa hoặc chính giữa bên phải
• Dưới cùng bên trái, chính giữa phía dưới hoặc dưới cùng bên phải

Hãy chọn vị trí không che các điều khiển quan trọng của website. Kiểm tra thông báo cookie, tiện ích trò chuyện, thanh điều hướng, nút giỏ hàng và các thành phần cố định khác trước khi quyết định.

Trên màn hình di động hẹp, Maildroppa đơn giản hóa vị trí để Slide-in vừa với chiều rộng khả dụng. Các vị trí phía trên vẫn ở phía trên; những vị trí khác được hiển thị từ mép dưới. Luôn kiểm tra kết quả trên màn hình nhỏ thay vì chỉ dựa vào vị trí trên máy tính.

Đặt thời gian trễ hiển thị

“Display Delay” xác định số giây Maildroppa chờ trước khi hiển thị Slide-in trên trang website được nhúng.

Sử dụng 0 khi Slide-in cần khả dụng ngay lập tức. Nhập thời gian trễ dài hơn nếu khách truy cập cần có thời gian tương tác với trang trước. Trình tạo chấp nhận thời gian trễ tối đa 86.400 giây.

Thời gian trễ ngắn có thể phù hợp với lời nhắc đăng ký nhận bản tin đơn giản. Với bài viết dài hơn, hiển thị muộn hơn có thể tự nhiên hơn và khiến ưu đãi phù hợp hơn với những độc giả đang tương tác.

Đặt tần suất hiển thị

“Display Frequency” kiểm soát khoảng thời gian sau đó Slide-in có thể được hiển thị lại cho cùng một khách truy cập. Bạn có thể chọn:

• Always
• Once per hour
• Once per day
• Once per week
• Once per month

Hãy sử dụng tần suất phù hợp với ưu đãi. Khuyến mãi ngắn hạn có thể cần khoảng thời gian ngắn hơn, trong khi lời nhắc đăng ký nhận bản tin thông thường thường không cần xuất hiện trong mỗi lần truy cập.

Tần suất được lưu trong trình duyệt của khách truy cập. Trình duyệt khác, cửa sổ duyệt web riêng tư hoặc dữ liệu lưu trữ trình duyệt đã bị xóa sẽ được xem là lịch sử truy cập khác.

Kết nối luồng đăng ký

Kiểm tra luồng đăng ký được gán trong phần đầu trình tạo. Luồng này xác định phản hồi sau khi gửi, email Double Opt-in và điều gì xảy ra sau khi xác nhận.

Bạn có thể chọn luồng hiện có, chỉnh sửa luồng hiện tại hoặc tạo một luồng riêng cho Slide-in này. Nếu luồng được chia sẻ bởi nhiều biểu mẫu, các thay đổi đối với luồng sẽ ảnh hưởng đến tất cả các biểu mẫu đó.

Xem trước và lưu

Nhấp vào “Preview” để xem lại Slide-in trước khi thêm vào website. Kiểm tra vị trí đã chọn, hành vi mở, thứ tự trường, nút đóng và phản hồi đăng ký hoàn chỉnh.

Nhấp vào “Save changes” khi biểu mẫu và Widget Settings đã sẵn sàng. Sau đó quay lại Tổng quan biểu mẫu đăng ký.

Kích hoạt và nhúng Slide-in

Kích hoạt Slide-in từ menu thao tác ba chấm nếu biểu mẫu chưa được kích hoạt. Nhấp vào “Show Code Snippet” và sao chép toàn bộ mã từ tab “JavaScript”.

Thêm tập lệnh này vào mọi trang website nơi Slide-in cần khả dụng. Không giống Embedded Form, vị trí chính xác của tập lệnh bên trong trang không quyết định vị trí hiển thị của Slide-in. Vị trí được chọn trong Widget Settings sẽ kiểm soát nơi Slide-in xuất hiện.

Tab “HTML” cung cấp mã đánh dấu được tạo cho các triển khai tùy chỉnh. Nếu website sử dụng tùy chọn này, hãy kiểm tra cẩn thận toàn bộ tương tác và luồng gửi.

Để xem hướng dẫn chung về vị trí đặt mã, hãy tham khảo Xây dựng và nhúng Embedded Form.

Kiểm tra Slide-in trên website

Sau khi thêm mã, hãy kiểm tra trang website thực tế:

1. Kiểm tra Slide-in xuất hiện sau thời gian trễ đã chọn.
2. Xác nhận vị trí trên màn hình rộng.
3. Kiểm tra vị trí và chiều rộng được điều chỉnh trên màn hình hẹp.
4. Đảm bảo Slide-in không che thanh điều hướng, tùy chọn cookie, nút trò chuyện hoặc các thao tác quan trọng khác.
5. Kiểm tra việc mở và đóng Slide-in.
6. Gửi biểu mẫu và hoàn tất quy trình Double Opt-in.
7. Xác minh người đăng ký và các thẻ ẩn trong Maildroppa.

Cài đặt tần suất có thể ngăn biểu mẫu xuất hiện lại trong các lần kiểm tra lặp lại. Hãy sử dụng cửa sổ duyệt web riêng tư hoặc xóa dữ liệu lưu trữ trình duyệt liên quan khi cần mô phỏng một khách truy cập mới.

Cập nhật hoặc hủy kích hoạt Slide-in

Mở Slide-in tương tự trong Maildroppa, thực hiện thay đổi, xem trước rồi nhấp vào “Save changes”. Đoạn mã JavaScript vẫn tiếp tục sử dụng cùng một ID biểu mẫu và tải cấu hình đã lưu.

Chọn “Deactivate” trong Tổng quan biểu mẫu đăng ký khi muốn đưa Slide-in ngoại tuyến mà không xóa biểu mẫu. Đồng thời xóa tập lệnh khỏi website nếu bạn không còn dự định sử dụng Slide-in trên đó.