开发者工具
eSIM 套餐查找工具
可嵌入到您网站的 eSIM 套餐展示组件,支持多项自定义配置。
快速开始
在希望显示组件的位置添加这行代码:
基础安装
将这段代码复制并粘贴到您的 HTML 中
<script
async
src="https://esimcardlist.com/external/widget.js?locale=en"
></script>参数
使用 URL 参数自定义组件行为:
locale
设置组件语言
默认: en
en · 英语de · 德语es · 西班牙语fr · 法语it · 意大利语ja · 日语pt · 葡萄牙语ru · 俄语tr · 土耳其语
country
通过 ISO 代码预选国家
默认: 无
US · 美国AE · 阿拉伯联合酋长国DE · 德国JP · 日本
color
自定义按钮颜色(hex,URL 编码)
默认: #2563eb
实时演示
查看组件在不同配置下的效果:
基础组件(英文)默认英文组件
自定义颜色组件绿色按钮颜色(#059669)
预选国家组件预选德国(DE)
示例
以下是一些常见用法:
基础用法
使用默认设置的简洁英文组件
<script
async
src="https://esimcardlist.com/external/widget.js?locale=en"
></script>德语 + 自定义颜色
德语界面与绿色按钮
<script
async
src="https://esimcardlist.com/external/widget.js?locale=de&color=%23059669"
></script>预选国家(日本)
预选日本的英文组件
<script
async
src="https://esimcardlist.com/external/widget.js?locale=en&country=JP"
></script>全部选项组合
法语、预选法国、红色按钮
<script
async
src="https://esimcardlist.com/external/widget.js?locale=fr&country=FR&color=%23dc2626"
></script>功能
异步加载
非阻塞,不会拖慢页面
Shadow DOM 隔离
组件样式不会与站点 CSS 冲突
9 种语言
英语、德语、西班牙语、法语、意大利语、日语、葡萄牙语、俄语、土耳其语
键盘可访问
完整键盘导航(方向键、Enter、Escape)
响应式
适配移动端和桌面端
可定制
按钮颜色可匹配您的品牌
轻量
不影响页面加载时间
故障安全
发生错误时,组件只会不显示
浏览器支持
注意 该组件使用 Shadow DOM 实现完整样式隔离。您网站的 CSS 不会影响组件,组件的 CSS 也不会泄漏到您的页面中。