開発者ツール
eSIMプラン検索ツール
カスタマイズ可能な設定で、WebサイトにeSIMプランを表示できる埋め込みウィジェットです。
クイックスタート
ウィジェットを表示したい場所に、次の1行コードを追加してください：
基本インストール
このコードを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
ボタン色をカスタマイズ（16進数、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）
レスポンシブ
モバイルとデスクトップの両方で動作
カスタマイズ可能
ボタン色をブランドカラーに合わせられます
軽量
ページ読み込み時間に影響しません
フェイルセーフ
エラー時はウィジェットが表示されないだけです
対応ブラウザ
Chrome81+
Firefox86+
Safari14.1+
Edge81+注意 このウィジェットは完全なスタイル分離のためにShadow DOMを使用しています。サイトのCSSはウィジェットに影響せず、ウィジェットのCSSもページ側に漏れません。