埋め込み（Embeds）は、ソーシャルメディアの投稿などの外部コンテンツをページに直接載せるための仕組みです。サイトのパフォーマンスとセキュリティを損なわずに、ユーザーの関与を高められます。
Cloudflare Zaraz は、埋め込みにサーバーサイドレンダリングを導入します。サードパーティの JavaScript を使わないため、セキュリティ、プライバシー、ページ速度が向上します。コンテンツはサーバー側で処理され、ユーザーのブラウザーとサードパーティサーバーが直接通信する必要がなくなります。
ウェブサイトに埋め込みを追加するには、次の手順を実行します。
-
Cloudflare ダッシュボードで、Tag Setup ページを開きます。
Tag setup を開く ↗ -
Tools Configuration を開きます。
-
「add new tool」をクリックし、Cloudflare Zaraz ダッシュボードで使いたいツールを有効にします。
-
HTML にプレースホルダーを追加し、必要な属性を指定します。汎用的な埋め込みのスニペットは次のとおりです。
<componentName-embedName attribute="value"></componentName-embedName>componentName、embedName、attribute="value" を、対象の Managed Component の要件に合わせて置き換えます。Zaraz はプレースホルダーを自動で検出し、安全かつ効率的にコンテンツへ置き換えます。
<twitter-post tweet-id="12345"></twitter-post>埋め込みたいコンテンツの実際のツイート ID に、tweet-id を置き換えます。
<instagram-post post-url="https://www.instagram.com/p/ABC/" captions="true"></instagram-post>埋め込みたいコンテンツの実際の URL に、post-url を置き換えます。投稿のキャプションを含めるには、captions 属性を true にします。