Blocksタグをサイトのソースコード（HTML)に直接設置する際、サイトがWordPress等のCMSやカートASP等で構築されている場合には各システムの仕様に沿って設置作業を進めてください。

本記事では、各システムでのBlocksタグの設置方法例についてご紹介します。

本記事は、株式会社プレイドが独自の調査をもとに作成した参考資料です。ただし、弊社側で各種システムやお客様サイトの仕様をすべて把握することはできないため、原則タグの設置はお客様の責任において進めていただくようお願いいたします。 最新の仕様は各システムのサポートサイトなどを確認の上、タグの設置場所・手順については各システムの提供元へお問い合わせください

CMS

1. WordPress

プラグインを使用せず、テーマのテンプレートファイルに直接設置する方法です。

  1. 画面左側の[メニュー > 外観 > テーマエディタ]を選択
  2. 使用中のテーマテンプレートで<head>タグが記述されているphpファイルを選択
    • 多くの場合、header.phpという名称になっています
  3. </head>の直前にタグを記述
  4. ファイルを保存・更新して、表示に問題なければ完了

※ 参考：WordPressサイト（日本語版）
※ プラグインを利用して設置する場合は、各プラグインの仕様・設定方法をご確認ください
※ プラグインを複数利用しているようなWordPressサイトでも、問題なくKARTE Blocksの導入・利用いただけます
※ （子テーマを使用している場合）子テーマには header.php がありません。親テーマに切り替えて編集してください。

2. MovableType

共通headerのテンプレート（テンプレート・モジュール）が設定されていれば、以下のステップで導入できます。

  1. サイドバーから、[デザイン > テンプレート]を選択
  2. 「テンプレートモジュール」から、お使いのサイトで設定されているheaderテンプレートを選択
  3. モジュール本体の入力欄に、</head>の直前にタグを記述
  4. ファイルを保存・更新して、表示に問題なければ完了

参考： テンプレートを編集する（MovableType公式サイト）

ECサイト構築システム

1. Shopify

(1) チェックアウト以外のページ

コード編集画面から、テーマに使われているliquidファイル（HTMLを生成するためのテンプレート）を直接編集可能です。適切なliquidファイルにタグを記述することで、対応するページが開かれたときにタグを発火させることができます。

  1. Shopify管理画面から、[販売チャネル > オンラインストア > テーマ > 現在のテーマ > アクション > コードを編集する]を選択
  2. theme.liquidファイルを選択し、</head>の直前にタグを記述
  3. ファイルを保存・更新して、表示に問題なければ完了

null

(2) 注文完了ページ （/thank_you）

Shopify管理画面の[設定 > チェックアウト > 注文処理 > 追加スクリプト]にタグを登録することで、チェックアウトの注文状況ページ（/thank_you）でタグを発火することができます。

  • 注文完了ページ以外の、チェックアウト（購入）に関するページにはタグ設置ができません
  • ただし、Shopify Plusを利用している場合に限り、チェックアウト（購入）に関するページ（checkout.liquid）を直接編集してタグ設置が可能です

※ 参考：注文状況ページをカスタマイズする（Shopify Help Center)

2. EC-CUBE

EC-CUBE管理画面へアクセスし、以下の手順でそれぞれタグを設置してください。

(1) PC

  1. [デザイン管理 > PC > ヘッダー/フッター設定 > ヘッダー編集] を選択
  2. </head>の直前にタグを記述
  3. ファイルを保存・更新して、表示に問題なければ完了

(2) スマートフォン

  1. [デザイン管理 > スマートフォン > ヘッダー/フッター設定 > ヘッダー編集] を選択
  2. </head>の直前にタグを記述
  3. ファイルを保存・更新して、表示に問題なければ完了

3. MakeShop

MakeShopの管理画面へアクセスし、以下の手順でタグを設置してください。

  1. [プロモーション > タグの設定 > アクセス解析用のタグの設定] を選択
  2. [アクセス解析タグの入力 (headタグ用)]にタグを記述
  3. 保存して表示に問題なければ完了

※ 参考： アクセス解析用のタグの設定（MakeShopオンラインマニュアル)

4. futureshop（コマースクリエイター利用中）

futureshopの管理画面へアクセスし、以下の手順でタグを設置してください。

  1. [設定 > プロモーション > 測定タグ設定 > 測定タグを追加する]を選択
  2. [利用設定]で「利用する」にチェック
  3. [設定名]に「KARTE Blocks」を入力 （名称は任意です）
  4. [共通入力]に以下を入力
    • [出力設定 > headタグ内に出力する]にチェック
    • [出力内容]にタグを記述
  5. 保存して表示に問題なければ完了

※ 参考： 測定タグ設置（コマースクリエイター）

5. ecbeing

ecbeingの管理画面にログインし、以下の手順でタグを設置してください。

  1. [CMS画面 > テンプレート管理 > 共通ヘッドテンプレート]を選択
  2. [１．全画面共通 / 共通ヘッドテンプレート]を選択し、</head>の直前にタグを記述
  3. 保存して表示に問題なければ完了

その他システム

1. STUDIO

2023年6月現在、Starterプラン以上をご利用の場合、<head>タグにScriptタグを設置することができます。
詳しくは、STUDIO公式サイトをご覧ください。

#karte_blocks