WordPressテーマSANGOの質問

google広告のコンバージョンタグ(onclick)をメニューに設置したい

アバター
yuh

お世話になっております。
SANGOテーマを愛用させて頂いています。

ご質問なのですが、google広告のコンバージョンタグを
モバイル用フッター固定メニューの電話項目に設置したいのですが
どのようにすればよろしいでしょうか?

google広告の公式ページによると、コードに直接onclick属性を追加するとの記載があります。
下記URLがその該当ページになります。
https://support.google.com/google-ads/answer/6331304?hl=ja

お手数ですがご教授いただけると幸いです。
よろしくお願いいたします。

モバイル用フッター固定メニューの設定方法
コメントへの回答
サルワカくん
サルワカくん
2019/09/29

ただいまサイトを拝見したところ、問題なくonclick属性が追加されているようですね。
メニューまわりのPHP(HTML)を直接編集した感じでしょうか?
もしよろしければ、簡単にどのような方法を取ったのか共有していただけますと幸いです。

アバター
yuh
2019/09/29

返信ありがとうございます。

PHPを直接編集することも考えましたが、
ワードプレス/外観/メニュー/ナビゲーションラベルに
onclick属性を追加するようにしました。

ただスマホで見た場合に、モバイル用固定フッターメニューの上部に
スペースができてしまってますね。

あと、この方法で合っているか分からなかったのでご質問したところでした笑
合っているなら良かったです。

サルワカくん
サルワカくん
2019/09/29

なるほど!
上にスペースができている原因は、

<li class="menu-item ">
  <a href="tel:電話番号"></a> ここ
  <a onclick="return gtag_report_conversion('tel:番号');" href="tel:080-1234-5678">
    <i class="fa fa-phone"></i>電話
  </a>
</li>

というように空のaタグが含まれてしまっていることが原因のようです。一度ナビゲーションラベルを確認してみていただければと思います。
よろしくお願いします。

アバター
yuh
2019/09/29

ナビゲーションラベル確認してみましたが、空のaタグはありませんでした。
下記のコードをナビゲーションラベルに設定しています。

電話

ワードプレス/外観/メニュー/カスタムリンクのURLを空にしてみましたが
モバイル固定フッターメニューの上部にスペースは存在したままですね…

PHPのほうで編集が必要かもしれませんね。

サルワカくん
サルワカくん
2019/09/29

aタグの中にaタグを入れようとしているのが原因だと思います(ブラウザはタグを自動的に2つに分離してしまいます)。
aタグの中に入れることができるのは例えばspanタグです。
以下のようにすれば効くようになると思います。

<span onclick="コード">
  <i class="fa fa-home"></i> 項目名
</span>
アバター
yuh
2019/09/29

spanタグに変えたら、上手くできました!
ありがとうございます!