高度な埋め込みオプション · JavaScriptクライアント

Entaseアカウントで生成される埋め込みコードは、完成済みのイベントウィジェットをページに追加します。開発作業なしでコピー＆ペーストできるように設計されています – 取得方法については、ウェブサイトへのイベントの埋め込みを参照してください。

このページでは、そのスニペットに追加できるオプションと、そこから開くチェックアウトの設定方法について説明します。

ウィジェットはJavaScriptクライアントを自ら読み込むため、併せてclient.jsを追加する必要はありません。また、公開可能キーも必要ありません。ウィジェットはEntaseから配信されるため、チェックアウトはページ上のキーではなくウィジェットを通じて認可されます。

設定

各ウィジェットはオプションオブジェクトで設定します。

HTML

<div id="entase_OBJ_CODE"></div>
<script>
  window.entase = window.entase || { o: [] };
  window.entase.o.push({
    obj: 'OBJ_CODE',
    theme: 'dark',
    ext: true
  });
</script>
<script src="https://js.entase.com/embed.js" async></script>

objは設定をコンテナに紐付けます。ウィジェットは、idがentase_に同じコードを続けた要素内にレンダリングされます。その要素がない場合、ウィジェットは警告をログに記録し、何もレンダリングしません。

1ページに複数配置する場合は、ウィジェットごとに1つのエントリを追加してください。

名前	型	デフォルト	説明
`obj`	文字列	–	埋め込みスニペット内のオブジェクトコード。必須です。
`width`	文字列	`'auto'`	CSS値によるコンテナの幅。`'auto'`は全幅を意味します。
`height`	文字列	`'auto'`	CSS値によるコンテナの高さ。`'auto'`では200pxから開始し、ウィジェットはコンテンツに合わせて自動的にサイズ変更します。
`theme`	文字列	`'light'`	`'light'`または`'dark'`。
`locale`	文字列	`'auto'`	ウィジェットの言語。`'auto'`は`<html>`要素の`lang`属性を読み取ります。
`ext`	真偽値	`false`	拡張レイアウト – 日付の上にイベント名とポスターを追加します。
`attribution`	真偽値	`true`	Entaseのクレジット行を表示します。非表示にするには`false`に設定します。
`client`	オブジェクト	`{}`	チェックアウトを開くJavaScriptクライアントに渡すオプション。

widthの値にかかわらず、コンテナには最小幅200pxが設定されます。これ未満では、ウィジェットを正しくレイアウトできません。

チェックアウトの設定

clientにはクライアントコンストラクタと同じオプションを指定できるため、ウィジェットから開くチェックアウトも、自分で開くものと同様にスタイルやサイズを設定できます。

JavaScript

window.entase.o.push({
  obj: 'OBJ_CODE',
  client: {
    checkoutMode: 'pane',
    pane: { width: '60vw' },
    backdrop: true,
    backdropColor: '#101014'
  }
});

一覧については、コンストラクタオプションを参照してください。

注意点が2つあります。tprmはウィジェット自体がページURLから設定するため（以下を参照）、ここで渡した値は置き換えられます。また、複数のウィジェットが1ページを共有する場合、それらは1つのクライアントインスタンスを共有します – 最後に初期化されたウィジェットのclientオプションが適用されるため、同じページ上のすべてのウィジェットで同一のオプションを使用してください。

キャンペーンパラメータの自動転送

スタンドアロンのクライアントとは異なり、ウィジェットはページのクエリ文字列を読み取り、既知のキャンペーンパラメータをウィジェットとチェックアウトの両方に転送します。

sgm, utm_source, utm_medium, utm_campaign, utm_term, utm_content, utm_id, utm_source_platform, utm_creative_format, fbclid

yoursite.com/concert?utm_source=facebook&sgm=SOCIALにアクセスした訪問者については、追加設定なしで、その結果発生する注文にこのアトリビューションが記録されます。このリスト以外のパラメータは無視されます – 独自のパラメータを引き継ぐには、クライアントで直接チェックアウトを開き、tprmを自分で設定してください。トラッキングと同意を参照してください。