Widget tính ngân sách du lịch của Orizn cho độc giả ước tính chi phí theo ngày, tháng và năm tại 195 quốc gia — chỗ ở, ăn uống, di chuyển, hoạt động — bằng chính đồng tiền của họ. Nhúng vào các bài viết điểm đến và biến sự tò mò về chi phí sinh hoạt thành doanh số cẩm nang chất lượng.
Widget này làm gì
Chi phí là yếu tố quyết định lớn nhất trước mỗi chuyến đi. Phần lớn nội dung du lịch xử lý kém — hoặc một đoạn văn mơ hồ kiểu "khá rẻ so với Đông Nam Á", hoặc một bảng tĩnh lỗi thời ngay khi tỷ giá thay đổi. Widget tính ngân sách của Orizn thay cả hai bằng một câu trả lời trực tiếp, có tương tác.
Khách chọn quốc gia, phong cách du lịch (Backpacker / Trung bình / Thoải mái) và độ dài chuyến đi. Widget trả về tổng theo ngày và tổng cả chuyến bằng đồng tiền của họ, chia theo chỗ ở, ăn uống, di chuyển và hoạt động. Mỗi hạng mục lấy từ hỗn hợp Numbeo, BackpackerIndex và giá do người dùng gửi của Orizn cập nhật hàng đêm.
Widget hoàn toàn tự khởi tạo — dán đoạn mã hai dòng vào bất kỳ đâu trong HTML là nó hiển thị. Hoạt động trên mọi CMS lớn, nặng dưới 15 KB gzip, chỉ đặt một cookie first-party để điền sẵn cho lần quay lại, và đi kèm CTA mua cẩm nang bạn có thể kiếm tiền với chia sẻ 50/50.
Trình tạo widget
Widget bên dưới chạy đúng script production mà bạn sẽ dán lên website của mình. Mọi tùy chọn cập nhật bản xem trước và đoạn mã ngay lập tức — ngôn ngữ, giao diện, màu sắc, white-label — rồi sao chép đoạn mã hai dòng.
Live preview · updates as you type
The widget above runs the exact production script you would paste on your own site — async, zero dependencies, scoped CSS. Every option on the left maps to a data-* attribute in the snippet.
Tính năng
Tính năng cụ thể, có nguồn — không phải checkbox chung chung. Mọi mục bên dưới đều có trong widget production hôm nay.
Mỗi quốc gia có bốn hạng mục chi phí — chỗ ở, ăn uống, di chuyển, hoạt động — lấy từ Numbeo, BackpackerIndex và bộ tổng hợp giá do người dùng gửi cập nhật hàng đêm. Mỗi hạng mục có ba mức tiết kiệm/trung bình/cao cấp.
Khách gạt một segmented control duy nhất để tính lại tổng. Hữu ích cho cả người đi nghỉ hai tuần lẫn digital nomad tính chi phí ở một năm.
Giá lưu nội bộ bằng USD nhưng hiển thị theo bất kỳ loại nào trong 50+ tiền tệ qua tỷ giá làm mới hàng ngày. Tự phát hiện từ locale của khách.
Kéo thanh trượt từ 1 đến 365 ngày. Tổng cập nhật theo thời gian thực, không cần chuyển trang.
Một chạm chuyển giữa Backpacker, Trung bình và Thoải mái. Mỗi preset điều chỉnh bốn hạng mục chi phí theo tỷ lệ.
Khi điểm đến yêu cầu visa, một chip nhỏ hiện cạnh ngân sách để độc giả thấy chi phí và quy định nhập cảnh cùng lúc.
CTA "Xem cẩm nang ngân sách Việt Nam đầy đủ" xuất hiện dưới kết quả. Với data-affiliate được đặt, mỗi lượt bán chuyển 50% cho bạn.
Vanilla JS, tải async, CSS đóng phạm vi. Không xung đột với Tailwind, Bootstrap hay script analytics sẵn có của bạn.
Nơi widget tỏa sáng
Widget dùng được cho mọi mục đích, nhưng bốn nhóm dưới đây triển khai nhiều nhất. Nhận ra mình trong số này, bạn sẽ thấy giá trị chỉ vài phút sau khi dán mã.
Đặt widget dưới đề mục H2 "Chi phí hết bao nhiêu?" trong mỗi bài hướng dẫn quốc gia. Độc giả rời trang với một con số cụ thể, không phải một đoạn văn mơ hồ.
Ghim widget trên trang chủ. Người đăng ký mới so sánh Bali với Lisbon nhận câu trả lời chi phí song song trong vài giây, ghi nhận vào mã affiliate của bạn.
Nhúng tại /resources/cost-of-travel. Thành viên tính chi phí chuyến đi tiếp theo tạo doanh số cẩm nang giúp trả tiền hosting cho bạn.
Nhúng cạnh các gói tour. Widget ngân sách neo kỳ vọng; ưu đãi của công ty trả lời câu hỏi tiếp theo.
Dữ liệu được lấy thế nào
Bốn hạng mục chi phí của mỗi quốc gia được tính hàng đêm từ Numbeo (chỉ số chi phí sinh hoạt, ~120 quốc gia), BackpackerIndex (mức chi hàng ngày cho backpacker, ~80 quốc gia) và bộ tổng hợp giá người dùng gửi nội bộ có loại bỏ giá trị bất thường. Quy đổi tiền tệ dùng tỷ giá trung bình thị trường ECB và OXR làm mới hàng ngày. Nguồn của từng hạng mục hiển thị khi di chuột để minh bạch biên tập.
Tài liệu tham chiếu
Mọi tùy chọn là một thuộc tính data-* trên div chứa. Không cần cấu hình JavaScript — dán, đặt các thuộc tính bạn muốn, xuất bản.
| Tham số | Kiểu | Mặc định | Mô tả |
|---|---|---|---|
data-destination | ISO3 | "" | Điền sẵn quốc gia điểm đến (ví dụ VNM, THA, MEX). Khách có thể thay đổi. |
data-lang | string | "auto" | Ghi đè ngôn ngữ trình duyệt được tự động phát hiện. Hỗ trợ 16 ngôn ngữ: en, fr, es, de, it, pt, ja, ko, zh, ru, ar, hi, th, vi, tl, tr (tiếng Ả Rập hiển thị RTL). |
data-theme | string | "auto" | Ép giao diện: "auto" (theo hệ điều hành), "light" hoặc "dark". |
data-affiliate | string | "" | Mã ORIZN-XXXXX hoặc aff_… của bạn (cả hai định dạng đều hợp lệ) để nhận chia 50/50 doanh thu bán cẩm nang. |
data-color | hex | #2563EB | Màu nhấn dùng cho nút, viền focus, thanh trượt và CTA. Chỉ chấp nhận giá trị hex (được lọc an toàn). |
data-branding | string | "on" | Đặt "off" để white-label: ẩn footer "Powered by Orizn", schema JSON-LD và phần nhắc orizn.app trong nội dung chia sẻ. |
data-radius | int | 16 | Bán kính bo góc (px) cho thẻ widget và các ô nhập. |
data-font | string | "system-ui" | Font-family dùng trong toàn widget. Chấp nhận mọi CSS font stack. |
data-currency | string | "USD" | Tiền tệ hiển thị. Chấp nhận mã ISO 4217 (USD, EUR, GBP, JPY, VND, THB, …) — hỗ trợ 50+ loại. |
Tích hợp
Cùng một đoạn mã hai dòng, cách dán khác nhau đôi chút tùy stack của bạn. Hướng dẫn từng bước chi tiết theo CMS:
Kiếm tiền
Thêm data-affiliate="ORIZN-XXXXX" vào div chứa — chấp nhận cả hai định dạng mã ORIZN-… và aff_…. Mỗi lượt mua cẩm nang của độc giả qua widget được ghi nhận cho bạn trong 30 ngày, thanh toán hàng tháng qua Stripe. Không mức tối thiểu, không thu hồi, minh bạch hoàn toàn trên dashboard affiliate.
Câu hỏi thường gặp
Câu hỏi thật từ developer, blogger và affiliate marketer đang tích hợp widget. Nếu câu hỏi của bạn không có ở đây, tài liệu tại /embed/getting-started bao quát phần còn lại.
Widget liên quan
Cả năm widget dùng chung một runtime, nên thêm widget thứ hai vào trang không tốn thêm gì. Bộ công cụ được thiết kế để kết hợp với nhau.
Yêu cầu visa trực tiếp cho 199 hộ chiếu × 238 điểm đến.
Thứ hạng di chuyển + phân tích 4 trục cho 199 hộ chiếu, làm mới hàng đêm.
Chi phí, visa, an toàn và khí hậu cạnh nhau cho hai quốc gia bất kỳ.
Checklist giấy tờ, vắc-xin, hành lý và tiền bạc cá nhân hóa cho từng chuyến đi.
Sẵn sàng nhúng?
Hai dòng HTML, không phụ thuộc, miễn phí trọn đời. Thêm mã affiliate và bắt đầu nhận 50% trên mỗi cẩm nang widget của bạn bán được.