LogoLogo
Back to PageFly.ioVideo Tutorials
Japanese 🇯🇵
Japanese 🇯🇵
  • PageFlyヘルプセンター
  • はじめに
    • 概要
    • クイックスタート
      • PageFlyのインストール方法
      • PageFlyの使用方法 | 5分で始める
      • PageFlyテンプレートから新しいページを作成する方法
      • PageFly LiveChatにアクセスする方法
      • PageFlyはShopifyテーマとどのように連携しますか?
    • 価格と請求
      • 概要
      • PageFlyの料金プラン
      • PageFlyの請求の仕組み
      • PageFlyをアンインストールするとどうなりますか?
      • PageFlyの返金ポリシー
  • ページとセクションの作成
    • 概要
    • 一般
      • PageFlyページのセットアップ
      • PageFlyがサポートするページの種類
      • PageFlyのページとセクションを使用する方法
      • PageFlyのページとセクションをエクスポート・インポートする方法
    • ページ
      • PageFlyでホームページを作成する方法
      • PageFlyで商品ページを作成する方法
      • PageFlyでコレクションページを作成する方法
      • PageFlyでブログ記事ページを作成する方法
      • PageFlyでパスワード保護ページを作成する方法
      • PageFlyでよくある質問(FAQ)ページを作成する方法
      • PageFlyで公開予定ページを作成する方法
      • PageFlyで会社概要ページを作成する方法
      • PageFlyでお問い合わせページを作成する方法
      • PageFlyでランディングページを作成する方法
      • PageFlyでA/Bテストページを作成する方法
    • セクション
      • プリメイドセクションと保存済みセクションを使用してページを作成する方法
      • 画像とテキストを含む基本セクションを作成する方法
      • PageFlyセクションでパララックス効果を使用する方法
      • PageFlyで全幅セクションを作成する方法
      • PageFlyでコードなしで固定セクションを作成する方法
  • ページ構造と要素
    • 概要
    • エディター
      • ユーザーインターフェース
        • PageFlyエディターでの作業方法
        • PageFlyをモバイルで使用する方法
        • ページエディター – 要素インスペクター
        • ページエディター - 全般タブ
        • ページエディター - スタイルタブ
        • ページ構成を使用してページレイアウトを整理する方法
        • 魅力的なモバイルレスポンシブページを作成する方法
        • 自動保存とバージョン履歴を使用する方法
      • 追加機能
        • 商品バリエーションのカスタムオプションスウォッチを管理する方法
        • グローバルスタイルを使用して、すべてのPageFlyページで使用するスタイルをカスタマイズする方法
        • ゴミ箱を使用して、削除されたページ、セクション、メディアファイルを管理する方法
        • PageFlyにカスタムフォントを追加する方法
        • PageFlyで画像と動画を管理する方法
    • PageFly要素
      • ユニバーサル要素
      • コンテナ
        • レイアウト
        • スライドショー
        • タブ
        • アコーディオン
        • コンテンツリスト
      • 基本
        • 見出し
        • 段落
        • ボタン
        • リスト
        • アイコン
        • 区切り線
        • HTML/Liquid
      • メディア
        • 画像
        • Youtube動画
        • Vimeo動画
        • HTML動画
        • Soundcloud
      • ソーシャル
        • Instagramフィード
        • Facebook「いいね!」とシェア
        • Facebookフィード
        • Twitterフィード
      • 詳細
        • QRコード
        • テーブル
        • カウントダウン
        • Googleマップ
        • プログレスバー
        • Mailchimpフォーム
    • Shopify要素
      • カスタムコンテンツ
        • アプリブロック
      • 商品
        • 商品バリエーションメタフィールド
        • 商品リスト
        • 商品詳細
        • 商品メディア
        • 商品タイトル
        • 商品ベンダー
        • 商品価格
        • 商品詳細説明
        • 商品バリエーション
        • 商品数量
        • 商品カートに追加
        • 商品詳細を見る
        • 商品メタフィールド
        • 動的チェックアウトボタン
      • コレクション
        • コレクションタイトル
        • コレクション画像
        • コレクションリスト
        • コレクション詳細を見る
        • コレクション詳細
        • コレクション説明
      • フォーム
        • 顧客フォーム
        • 顧客フォームフィールド
        • 顧客フォームボタン
        • お問い合わせフォーム
        • お問い合わせフォームフィールド
        • お問い合わせフォームボタン
        • 検索フォーム
      • ブログ記事
        • ブログ記事リスト
        • ブログ記事詳細
        • ブログ記事画像
        • ブログ記事タイトル
        • ブログ記事内容
        • ブログ記事メタデータ
    • 最適化
      • カスタムコードエディターを使用してページをカスタマイズする方法
      • ページ分析
      • Shopifyストアの速度を上げる方法
      • Facebookピクセルを設定して、ウェブサイト上でのユーザーアクションを理解する方法
      • PageFlyページをShopifyメニューナビゲーションに公開する方法
      • PageFlyページでZakeke Product Customizerを使用する方法
      • Langifyを使用してページを翻訳する方法
      • Weglotを使用してページを翻訳する方法
      • T Labを使用してPageFlyのページを翻訳する方法
      • PageFlyでのJSONテンプレート
      • PageFlyエディターでTinyIMGを使用して画像を最適化する方法
      • PageFlyでShoplift A/Bテストを使用する方法
      • PageFlyでSEOAnt:AI SEO & 画像最適化を使用する方法
      • ブラックフライデーセールアイデア
      • PageFly要素でCRO向けページを最適化
      • バレンタインデーのセールを最適化
      • PageFlyでクリスマスセールページを設定する方法 | 2023年ベストガイド
      • フラッシュセールセクションを作成する方法 - 新学期
      • 母の日に向けてストアを最適化: PageFlyでギフトガイドを作成
    • 主なユースケース
      • ページ上の要素を整列
      • リンク、セクション、ポップアップへの直接リンク
      • スペーシング、マージン、パディングの編集
      • Flex機能
      • ページへのファイルアップロード
  • 連携機能
    • サードパーティ要素
      • 連携されたサードパーティShopifyアプリをページで使用するためにアクティベートする方法
      • PageFlyと連携するアプリは何ですか?
      • レビューと評価
      • アップセルとクロスセル
      • バッジとシール
      • 予約システム
      • 配送と受け取り
      • サブスクリプション
      • 注文追跡
      • ファイルアップロードフィールド
      • メールマーケティング
      • 商品情報
      • プッシュ通知
      • リファーラルとアフィリエイトマーケティング
      • 画像とメディア
      • ロイヤリティとリワード
      • 持続可能性
      • ギフト
      • 国際化
      • 広告
      • サポート
      • SMSマーケティング
  • FAQとトラブルシューティング
    • 概要
    • FAQ
      • PageFly使用時のShopifyテーマに関する問題
      • GDPRへの準拠方法
      • 私のページのURLアドレス
      • PageFlyページエディター - FAQ
      • 要素 - FAQ
    • トラブルシューティング
      • ライブサイトの問題
        • カートドロワーが自動的に更新されない
        • モバイルレスポンシブの横スクロール問題
        • YouTube、HTML動画の自動再生問題
        • テーマプレビューモードでページが完全に表示されない
        • ロケールファイルを作成できない
        • theme.pagefly.liquidを作成できない
        • Shopifyのデフォルト商品詳細を非表示にする方法
        • PageFlyページリストのロードが終わらない
        • ページ上部の空白スペースを削除する
        • ブログページが正常に更新されない
        • ページのスタイルが崩れている
      • エラーメッセージ
        • PageFlyページリストのロードが終わらない
        • ページサイズ制限
        • ページ上の要素数制限
        • データをインポートできません
        • 画像サイズ制限
        • 不明なエラー
  • 最新アップデート
    • PageFlyがOnline Store 2.0に対応しました
    • PageFlyリファーラルプログラム
    • PageFly旧料金プラン
  • PageFlyアフィリエイトプログラム
    • アフィリエイトサクセス:PageFlyがマーチャントのためにできること
    • アフィリエイトサクセス:DOs & DON'Ts - PageFlyアフィリエイトとして成功するために知っておくべきすべて
    • アフィリエイトサクセス:よくある質問
Powered by GitBook
LogoLogo

製品

  • テンプレート
  • 価格
  • ハッピー顧客

リソース

  • ブログ
  • アカデミー
  • ビデオチュートリアル
  • コミュニティ
  • フィードバック

パートナー

  • 私たちのパートナー
  • アフィリエイトプログラム

会社

  • 私たちについて
  • キャリア
  • プライバシーポリシー
  • 利用規約

Copyright © 2025 PageFly. All rights reserved.

On this page
  • 概要
  • 要件
  • Facebook Pixelの設定方法
  • 使用例
  • Facebook Pixelに関する一般的な問題
  • よくある質問

Was this helpful?

Edit on GitHub
  1. ページ構造と要素
  2. 最適化

Facebookピクセルを設定して、ウェブサイト上でのユーザーアクションを理解する方法

概要

Facebook Pixelは、人々があなたのウェブサイトで行う行動を理解することで、広告の効果を測定できる分析ツールです。したがって、Facebook Pixelの設定は非常に重要な役割を果たします!

そのため、Facebook PixelはShopifyストアのパフォーマンスを監視するために重要な役割を果たします。

Facebook Pixelについて、さらに詳しく読むことができます。

要件

開始する前に、以下を確認してください。

  • ビジネス用Facebookページ

  • パスワード保護されていないShopifyオンラインストア

  • ご自身のビジネス用Facebookページに接続されたFacebook Business Manager

  • 管理者権限

  • Facebook広告アカウントが設定され、使用できる状態になっていること。まだ設定していない場合は、Facebookのステップバイステップガイドに従ってください。ガイドはこちらで見つけることができます。

アカウントにFacebook Pixelを正常に設定している場合は、ステップ2をスキップしてください。

Facebook Pixelの設定方法

ステップ1:Facebook Pixelを設定する

まず、イベントマネージャーで、ビジネスマネージャー > データソースをクリック > Pixelを選択 > 詳細をクリックします。

次に、Pixelの名前を選択 > 続行をクリック > 今すぐPixelを設定 > パートナー連携を使用してコードを追加を選択します。

次に、パートナーとしてShopifyを選択します。

Facebook PixelをShopifyアカウントに正常に接続するために、3つのステッププロセスに従ってください。

すべてが整ったら、ShopifyストアにFacebook Pixel IDを追加する準備ができました。

ステップ2:ストアにFacebook Pixelをインストールする

イベントマネージャーページにいることを確認してください。アカウント名の下にある固有のPixel IDをコピーします。

Shopify管理画面に戻り > オンラインストア > 環境設定に移動 > Facebook PixelセクションにPixel IDを貼り付け > 保存を押します。

完了です!これでストアにFacebook Pixel IDを追加する準備ができました。

ステップ3:Facebook & Instagramアプリを追加する

  1. Shopify管理画面から、販売チャネル > 環境設定 > Facebook Pixelセクションで、Facebookを設定を選択します。

2. アプリをまだインストールしていない場合は、Shopifyアプリストアページにリダイレクトされます。その後、インストールをクリックします。

注: 「Facebookを設定」ボタンをクリックすると、Facebook & InstagramアプリをインストールするためにShopifyアプリストアにリダイレクトされます。

3. 左側のサイドバーに、新しい販売チャネルとしてFacebook & Instagramが表示されます。

設定

一般設定

次に、トラッキングを設定したいページに移動します。

Facebook Pixelのトラッキングオプションは、以下の12の要素で利用可能です。

  • 見出し

  • ボタン

  • 画像

  • MailChimpフォーム

  • 商品リスト

  • 商品画像

  • 商品タイトル

  • 商品をカートに追加

  • 商品詳細を表示

  • コレクション画像

  • コレクションタイトル

  • コレクション詳細を表示

選択できるイベントタイプは10種類あります。

  • 検索 (Search)

  • コンテンツ表示 (View Content)

  • カートに追加 (Add To Cart)

  • ウィッシュリストに追加 (Add To Wishlist)

  • チェックアウト開始 (Initiate Checkout)

  • 支払い情報の追加 (Add Payment Info)

  • 購入 (Purchase)

  • リード (Lead)

  • 登録完了 (Complete Registration)

  • カスタムイベント (Custom Event)

イベントタイプを選択すると、イベントコードが自動的に生成されます。

Pixelの実装を検証するには、Pixel Helper Google Chrome拡張機能をインストールします。クリックするとパネルが展開され、警告、エラー、成功を含むページのPixelの詳細な概要が表示されます。

Facebook Pixelイベントトラッキングを確認する

ビジネスマネージャーで、左側のサイドバーにあるすべてのツールを選択 > 広告マネージャーを選択します。

広告セットタブに移動 > 列アイコンをクリック > 列をカスタマイズを選択します。

表示をコンバージョンに切り替え > スクロールダウンして、使用しているPixelの種類を選択 > 適用を押します。

再度メニューを選択 > イベントマネージャーを選択します。Pixelの結果が表示されます。

詳細については、このビデオをご覧ください。

使用例

以下に、ページのFacebook Pixel設定に関連して最もよく寄せられる質問を示します。

PageFlyページが読み込まれたときに特定のFacebookイベントを発生させるには?

  • ステップ1: エディターに移動します。

  • ステップ2: 以下のコードをカスタムJavaScriptオプションに挿入します。

window.trekkie.load = function () {
  fbq("track", "ViewContent");
};

_window.addEventListener("load", function () {
  _;

  _fbq("track", "ViewContent");
  _;

  _;
});
_;
  • ステップ3: 「変更を保存」をクリックし、ページを公開します。

  • ステップ4: Facebook Pixel Helperで結果を確認します。

ヒント

Facebookイベントに追加の目的(例えば「content_name」と「content_type」)を送信したい場合は、以下のコードを使用してください。

window.trekkie.load = function () {
  fbq("track", "ViewContent", { content_name: "Bearie Backpack", content_type: "product" });
};

window.addEventListener("load", function () {
  fbq("track", "ViewContent", { content_name: "Bearie Backpack", content_type: "product" });
});

特定のFacebookイベントには、あらかじめ定義された目的を割り当てることができることに注意してください。Facebookヘルプドキュメントを参照してください。

例えば、Facebook ViewContentは以下の目的をサポートしています:content_ids, content_category, content_name, content_type, contents, currency, value.

Facebook Pixel Helperで結果を確認してください。ご覧のように、content_typeとcontent_nameを含むカスタムパラメータが送信されています。

ユーザーが特定のセクションをスクロールしたときにFacebook Pixelを発生させるには?

  • ステップ1: セクションに名前を付けます。

この例では、「countdown」です。

  • ステップ2: カスタムJavaScriptコードを追加します。

注意すべき点は2つあります。

まず、jQuery関数は「countdown」という名前のセクションIDをトリガーします。

次に、この例では、オブジェクトなしでFacebook Pixel「ViewContent」を送信します。

  • ステップ3: 結果を確認します。

ご覧のように、固有のIDを割り当てたセクションは「countdown」と呼ばれ、その部分をスクロールした後にFacebook pixelが発生しています。

同じページで複数のFacebook Pixelを発生させるには?

カスタムJavaScript設定の中に以下のコードを含めてください。

「YOUR PIXEL ID」をあなたの固有のID番号に置き換えてください。コードはこちらからコピーできます。

結果として、ページの読み込み時に2つのPixelが発生しているのを確認できるはずです。

Facebook Pixelに関する一般的な問題

エラーメッセージ

エラーメッセージ:「AddToCart Event missing some deduplication parameters」または「Purchase Event missing some deduplication parameters」

  • 原因:ストアにFacebook Pixelを正常に設定できていません。

  • 解決策:上記3つの設定手順を参照し、何か見落としていないか再度確認してください。

Facebookが「Shopifyサンクスページ」経由の購入をトラッキングできない

解決策:

  • ステップ1: オンラインストア > 環境設定でFacebook Pixelが完全に設定されているか確認します。上記の手順を参照してください。次に、Facebook Pixelトラッキングアプリが正常に動作していることを確認します。

  • ステップ2: Facebook Pixelがボタン要素ではなく、「商品をカートに追加」で設定されているか確認します。

  • ステップ3: ヘッダーとフッターがオンになっているか確認します。

Facebookが1つのイベントを二重にトラッキングしている

原因:PageFlyページに手動でイベントを追加したが、テーマがそれ以前に自動的にイベントを発生させた。

それがPageFlyで構築された商品ページであるか確認してください。

次に、Themes Marketplace (themes.shopify.com) からテーマを入手した場合、原因はFacebook Pixelが「カートに追加」で既に発生していることかもしれません。PageFlyでFacebook Pixelを手動で再度発生させると、二重トラッキングが発生します。解決策:PageFlyで手動で発生させた要素を「なし」に割り当てます。

Facebookトラッキングが突然無効になる

原因:オンラインストアではなく、手動のコード注入またはtheme.liquidファイル内でFacebook Pixelを設定した。

解決策:手動のコードまたはtheme.liquidファイルを再度確認してください。手動のコードを削除するか、theme.liquidファイルの古いバージョンを復元してみてください > 代わりにオンラインストア > 環境設定でFacebook Pixelを設定します。

theme.liquidファイルの古いバージョンを復元する方法を知りたいかもしれません。

上記に記載されていないその他の問題については、推奨される解決策は、オンラインストア > 環境設定によってのみFacebook Pixelを適切に発生させていること、他の方法では発生させていないことを確認することです。Facebook Pixelトラッキングアプリが動作していることを確認してください。

Facebook Pixel Advancedの詳細については、この記事を確認してください。

ご不明な点がございましたら、チケットを提出してください。カスタマーサポートチームが迅速に対応いたします。

よくある質問

1. Facebook Pixelとは何ですか?

Facebook Pixelは、ウェブサイト(この場合はShopifyストア)に埋め込むコードの断片であり、広告キャンペーンから収集されたデータを使用して、オーディエンスを測定、最適化、構築するために使用されます。

2. Facebook Pixelはどこで見つけられますか?

MetaSuitesの「Business Settings」>「Data Sources」>「Pixel」の下にあります。この記事を確認してください。

3. Facebook Pixelの異なるタイプは何ですか?

主に3つのタイプがあります:標準イベント、カスタムコンバージョン、およびカスタムイベントです。

Last updated 25 days ago

Was this helpful?