eSIM 套餐查找工具

可嵌入到您网站的 eSIM 套餐展示组件，支持多项自定义配置。

快速开始

在希望显示组件的位置添加这行代码：

基础安装

将这段代码复制并粘贴到您的 HTML 中

<script
  async
  src="https://esimcardlist.com/external/widget.js?locale=en"
></script>

使用 URL 参数自定义组件行为：

locale

设置组件语言

默认： en

可用选项：

country

通过 ISO 代码预选国家

默认：无

示例：

color

自定义按钮颜色（hex，URL 编码）

默认： #2563eb

注意：颜色必须在 URL 中进行编码。例如， #2563eb 会变成 %232563eb。

查看组件在不同配置下的效果：

基础组件（英文）

默认英文组件

自定义颜色组件

绿色按钮颜色（#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 不会影响组件，组件的 CSS 也不会泄漏到您的页面中。