見出し画像

WordpressでCAPI連携ーパラメータを動的に設定する

Wordpressは現状でも多くのサイトで利用されております。ただ、WordpressでコンバージョンAPIを連携しようと思うと何から手をつけていいのやら。

WordPress + プラグインで簡単にコンバージョンAPI連携を実現する方法

WordPressでコンバージョンAPIを実現したい場合、一番簡単なのがプラグインを利用することかと思います。中でもとても簡単に連携ができるのがPixelYourSiteというプラグインかと思います。

PixelYourSiteはそんな面倒なコンバージョンAPI連携をサックと実現できてしまうとても素晴らしいプラグインです。

ただ、一つ難点があります。

それは、動的なパラメータを設定できないということ。。
つまり、フォームに入力されたユーザ情報を動的に取得できないということです。

今回はその難点を無理くり(パワープレイします。)解決して動的パラメータを設定できるようにしようという挑戦です。(好奇心強めです。)

ということでまずはPixelYourSiteをWorpressにインストールしていきます。

PixelYourSiteのインストール

ただ単にWordpressとPixelYourSiteを利用してコンバージョンAPIを連携する方法は他の記事でも書いてあるかと思いますのでここでは簡単に記載致します。

今回の目的はあくまで動的パラメータを設定したコンバージョンAPIの実現です。
①PixelYourSIteを新規プラグインからインストール

画像1

まずはピクセル連携の実装からみていきます。
②次の様に各入力項目を入力します。

画像2

<ピクセルID>:対象のピクセルIDを入力
<アクセストークン>:コンバージョンAPIのアクセストークンを入力
<テストコード>イベントマネージャから取得したテストコードを入力

上記を入力後、ページ下部にSave Settingsというボタンがあるのでクリックして保存します。

③次にEventsタブからイベントを入力していきます

画像3

画像4

Addボタンをクリックします。

④イベント名称を入力します

画像5

こちらはピクセル連携時のイベント名ではないので、
管理画面上でわかりやすい任意の名称で問題ありません。

⑤次にイベントトリガーを設定します。

画像6

Fire Event When :ここにはイベントを発火させる操作を選択します。
※無料版ではPage Visitのみが選択できます。
これはGTMでいうところのPage Viewと同じです。

When delayには意図的にイベントの発火を遅らせたい場合に設定します。
例えば、ページが表示されてから10秒後に発火させたい場合は10と入力します。

次に発火条件を指定します。
Page Visitの場合は以下二つから選択できます。

URL Contains :URLに指定文字列が含まれる場合
URL Match:URLが指定文字列の一致する場合

複数の条件を設定したい場合はAdd another URLをクリックすることで追加の条件を指定できるようになります。
⑥Enable on FacebookをONにします。

画像7

ONにするとFacebookのイベントを選択できるようになります。
今回はPurchaseを選択してみます。
⑦次にAdd ParameterをONにすることでパラメータの入力ができるようになります。

画像8

こんな感じで設定してみました。
最後にページ下部のSave Eventをクリックすることで保存できます。

画像9


こんな感じでイベントが設定できました。

現在の設定ですが、
「xn--68j031jeobzzhlxg486b」を含むURLのページが表示されたときに
以下のイベントがFacebookにピクセル連携されます。

イベント:Purchase(購入)
パラメータ:value 100 
      curreny Japanese Yen 
      content_name testProduct
                num_items 1 
      order_id 001 

ページが表示された際に購入イベントが送られるというヘンテコな設定ではありますがテストなのでよしとしましょう。

実際に確認してみましょう。

画像10

これだけでピクセル連携が実装できちゃいます!

でも待って。。。

金額とか動的にパラメータを入力したい場合はどうすれば良いのか。。。

なんと実は、PixelYourSiteの画面からは動的なパラメータを設定できないのです。。。

でも、何とかしてPixelYourSiteを使って動的パラメータを設定したい

いや、動的パラメータ使いたいならGTM使えばいいじゃん。

はい。GTM使います。ただし、動的パラメータを使用したピクセル連携を実現することがゴールではないです。

ここまではPixelYourSiteを利用したピクセル連携の方法を記載してきましたが、あくまでそれはコンバージョンAPIを実装するための前段です。

PixelYourSiteの仕様としてPixelYourSite上で設定したピクセルイベント情報を基本的にそのまま利用してコンバージョンAPIとしても連携します。

つまり、ピクセルイベントの設定段階で動的パラメータの設定を実現しておく必要があります。

※ここからパワープレイを含みます。
(少しエンジニア向けの情報も含みます。)

GTMを使って動的パラメータの実現

ここでPixelYourSiteの仕様に関してもう少し詳細を記載します。

ここから先は

7,254字 / 21画像

¥ 5,000

この記事が気に入ったらチップで応援してみませんか?