Tài liệu tiện ích
Hướng dẫn đầy đủ về cách nhúng và tùy chỉnh tiện ích chuyển đổi tiền tệ Currency.Wiki trên trang web của bạn.
Mục lục
1 Bắt đầu
Thêm tiện ích chuyển đổi tiền tệ vào trang web của bạn rất dễ dàng. Làm theo các bước đơn giản sau:
- Truy cập trang Trình tạo tiện ích và tùy chỉnh giao diện tiện ích của bạn
- Chọn kiểu tiện ích, tiền tệ và chủ đề mong muốn
- Sao chép mã nhúng được tạo (Script hoặc Iframe)
- Dán mã vào HTML trang web tại vị trí bạn muốn hiển thị tiện ích
Mẹo: Sử dụng các cài đặt nhanh trong Trình tạo tiện ích để bắt đầu nhanh với tiện ích được cấu hình sẵn.
2 Phương pháp nhúng
Nhúng Script (Khuyến nghị)
Phương pháp nhúng script sẽ chèn tiện ích trực tiếp vào trang của bạn. Menu thả xuống tiền tệ sẽ hiển thị phía trên nội dung xung quanh để dễ lựa chọn.
<div id="currency-wiki-widget"></div>
<script src="https://widget.currency.wiki/v3/script.js?style=compact&theme=light&from=USD&to=EUR"></script>
- Menu thả xuống hiển thị ngoài khung tiện ích
- Phù hợp cho lựa chọn tiền tệ tương tác
- Tích hợp liền mạch với trang của bạn
Nhúng Iframe
Phương pháp nhúng iframe tạo vùng chứa cách ly cho tiện ích. Phương pháp này an toàn và phù hợp với môi trường có chính sách nội dung nghiêm ngặt.
<iframe src="https://widget.currency.wiki/v3/embed?style=compact&theme=light&from=USD&to=EUR"
width="300" height="180" frameborder="0"></iframe>
- Hoàn toàn cách ly với kiểu dáng trang của bạn
- Hoạt động với chính sách bảo mật nội dung nghiêm ngặt
- Triển khai đơn giản và an toàn
Lưu ý: Dùng nhúng Script để có tính tương tác đầy đủ (menu thả xuống hiển thị trên nội dung). Dùng nhúng Iframe khi cần cách ly hoặc có hạn chế CSP.
3 Kiểu dáng tiện ích
Chọn từ 11 kiểu tiện ích khác nhau để phù hợp với thiết kế trang web của bạn. Mỗi kiểu được tối ưu cho các trường hợp sử dụng và kích thước hiển thị khác nhau.
mini
250x140px
Bộ chuyển đổi dòng đơn nhỏ gọn. Phù hợp cho tiêu đề hoặc không gian hẹp.
square
250x250px
Tiện ích tỷ lệ 1:1 với nút đảo chiều. Tuyệt vời cho thanh bên.
compact
300x180px
Bộ chuyển đổi nhỏ gọn với đầy đủ tính năng thiết yếu.
inline
480x56px
Bố cục ngang. Lý tưởng để nhúng trong nội dung hoặc điều hướng.
tall
200x280px
Bố cục thanh bên dọc với nhãn cổ điển.
mini-chart
250x260px
Bộ chuyển đổi nhỏ gọn với biểu đồ đường thể hiện lịch sử tỷ giá.
multi-expandable
300x320px
Bộ chuyển đổi đa tiền tệ. Người dùng có thể thêm/bớt tiền tệ.
multi-fixed
300x300px
Danh sách tỷ giá cố định. Phù hợp để hiển thị tỷ giá cụ thể.
rates-compact
250x320px
Danh sách tỷ giá ngắn gọn với thời gian cập nhật cuối.
rates-viewer
300x500px
Chế độ xem biểu đồ đầy đủ với thông tin tỷ giá chi tiết.
rates-viewer-compact
300x400px
Phiên bản nhỏ gọn của chế độ xem tỷ giá có biểu đồ.
4 Tham số URL
Tùy chỉnh tiện ích của bạn bằng các tham số URL. Các tham số này hoạt động với cả hai phương pháp nhúng Script và Iframe.
| Tham số | Mặc định | Mô tả |
|---|---|---|
| style | compact | Kiểu tiện ích (mini, square, compact, inline, tall, mini-chart, multi-expandable, multi-fixed, rates-compact, rates-viewer, rates-viewer-compact) |
| theme | light | Chủ đề màu sắc (sáng, tối hoặc tự động) |
| from | USD | Mã tiền tệ nguồn (ví dụ: USD, EUR, GBP) |
| to | EUR | Mã tiền tệ đích (ví dụ: EUR, USD, JPY) |
| amount | 1000 | Số tiền mặc định để chuyển đổi |
| accent | #2563eb | Màu nhấn ở định dạng hex (không có #) |
| lang | en | Mã ngôn ngữ tiện ích (ví dụ: en, es, fr, de) |
| flags | 1 | Hiển thị cờ quốc gia (1=hiện, 0=ẩn) |
| display | iso | Định dạng hiển thị tiền tệ (iso=USD, symbol=$) |
| lock | 0 | Khóa tiền tệ (1=khóa, 0=mở khóa) |
| currencies | EUR,GBP,JPY | Danh sách tiền tệ phân tách bằng dấu phẩy cho tiện ích đa tiền tệ |
| dropdown | all | Tiền tệ trong menu thả xuống (all, top10, top20 hoặc danh sách phân tách bằng dấu phẩy) |
| branding | 1 | Hiển thị thương hiệu (1=hiện, 0=ẩn) |
| brandinglink | 1 | Cho phép nhấp vào thương hiệu (1=liên kết, 0=chỉ văn bản) |
| format | auto | Định dạng số (auto, us, eu, french, indian) |
| decimals | 2 | Số chữ số thập phân (0-6) |
| chart | 0 | Bật biểu đồ (1=bật, 0=tắt) |
| chartperiod | 7d | Khoảng thời gian biểu đồ (7d, 14d, 30d, 90d) |
Ví dụ
Bộ chuyển đổi nhỏ gọn chủ đề tối:
?style=compact&theme=dark&from=USD&to=EUR
Tỷ giá đa tiền tệ:
?style=multi-fixed&from=USD¤cies=EUR,GBP,JPY,CAD
Bộ chuyển đổi nhỏ với biểu đồ 30 ngày:
?style=mini-chart&from=EUR&to=USD&chartperiod=30d
Hiển thị ký hiệu tiền tệ thay vì mã:
?style=compact&display=symbol&from=USD&to=EUR
Khóa tiền tệ với số tiền tùy chỉnh:
?style=compact&from=GBP&to=USD&lock=1&amount=100
5 Tùy chọn tùy chỉnh
Tùy chọn chủ đề
- light - Nền sáng với chữ tối
- dark - Nền tối với chữ sáng
- auto - Tự động theo cài đặt hệ thống của người dùng
Định dạng hiển thị tiền tệ
- iso - Hiển thị mã ISO như USD, EUR, GBP
- symbol - Hiển thị ký hiệu tiền tệ như $, €, £
Định dạng số
- auto - Tự động phát hiện cài đặt trình duyệt của khách truy cập
- us - Định dạng Mỹ: 1,234.56
- eu - Định dạng Châu Âu: 1.234,56
- french - Định dạng Pháp: 1 234,56
- indian - Định dạng Ấn Độ: 1,23,456.78
Tùy chọn tiền tệ trong menu thả xuống
- all - Tất cả 170+ tiền tệ được hỗ trợ
- top10 - Top 10 tiền tệ phổ biến nhất
- top20 - Top 20 tiền tệ theo khối lượng giao dịch
- USD,EUR,GBP,... - Danh sách tùy chỉnh các tiền tệ cụ thể
Mẹo: Sử dụng Trình tạo tiện ích để cấu hình trực quan tất cả các tùy chọn này và tự động tạo mã nhúng.
6 Khắc phục sự cố
Tiện ích không hiển thị
Đảm bảo mã nhúng được đặt đúng vị trí trong HTML. Với nhúng script, hãy chắc chắn có thẻ div chứa đúng ID. Kiểm tra bảng điều khiển trình duyệt để xem lỗi JavaScript.
Menu thả xuống không hoạt động
Nếu dùng nhúng iframe, menu thả xuống sẽ cuộn trong vùng tiện ích. Để có chức năng thả xuống đầy đủ, hãy dùng phương pháp nhúng script.
Xung đột kiểu dáng
Nếu CSS trang web của bạn ảnh hưởng đến giao diện tiện ích, hãy thử dùng nhúng iframe để cách ly kiểu dáng tiện ích khỏi trang.
Vấn đề chính sách bảo mật nội dung
Nếu bạn có CSP nghiêm ngặt, có thể cần thêm currency.wiki vào chỉ thị script-src và frame-src. Ví dụ: script-src 'self' currency.wiki; frame-src 'self' currency.wiki;
Cần hỗ trợ?
Không tìm thấy điều bạn cần? Đội ngũ hỗ trợ của chúng tôi luôn sẵn sàng giúp đỡ.
