wordpressのショートコード自作に悪戦苦闘してた話

WordPress案件、基本はあれこれググりながら、
プラグインでやってくレベルのものをたまに受けたりするのですが。

だがしかし、、、、

function.phpとか触る作業はめちゃ緊張するーーーー！！！涙。

まあコピペなんですけど、、
たまに超緊張しながらショートコードをカスタマイズして追加したりします。

WordPressやってて緊張する瞬間

外部リンクのブログカード化→○

有料の［カードURL］プラグインを使ってたのですが、案件サイトの方でなぜか表示されなくなってしまって……。仕方なく自作してみることに。

いろいろ調べて、
デザインも仕様も希望通りだったこの記事を参考にやってみました！

できた〜〜！！
ばっちり！！！動いた！嬉しい!!!!!

いやーショートコードを自作でいじるのって、数年前の別のプロジェクト以来だったのですが、難しいけど出来たときめっちゃ嬉しいんですよね！

感動です！

アイキャッチYT動画をGTM計測できない→😭

だがしかし！

立ちはだかる壁、
youtubeリンク。。。

案件的に、
youtube動画の見せ方がメインのサイト構築なのでプラグインを使う必要があったのですが、、

それを使うと、Googleタグマネージャーの計測がうまく働かない！！！
( ´；人；`)

埋め込み動画のクリック率やら、
再生率、再生完了率やらを計測したいのに。

プラグインが邪魔をする〜〜。（ＴＴ）

プラグイン: feature video plus→そのまま使う

• 記事サムネクリックで動画再生できる
• YouTubeからサムネ取得
• YouTubeの再生アイコンもつく
• クリックするとモーダル内で再生
• 記事ではページトップで埋め込み再生
• それぞれGTMでanalytics計測したい

という挙動を実現したくて、プラグインを入れてるのですが、これが癖がめちゃくちゃ強くて四苦八苦しまくり！！！

特に、affinger5が高機能なだけに、いろいろバッティングしてしまうんですよね。プラグインあるある……。

追記：結局やったこと😲：wp_oembed＋ショートコード

（以下は自分メモです）2020.6.21

作業したざっくりの流れ

• サムネイル

  結局、記事一覧で出すサムネから再生させたかったので、
  feature video plus のプラグインはそのまま使うことに。




• アイキャッチ動画

  ・アイキャッチに入れた動画をGTMで計測したい
  ・アイキャッチ動画の設定を個別でやることに
  ・カスタムフィールドで動画URL入力欄を追加（id:youtube_eyecatch）




• wp_oembed_get

  ・themeのchildフォルダにOpenGraph.phpファイルを置く
  ・st-eyecatch-under.php の書き換え【←自己責任なのでめちゃ緊張】

st-eyecatch-under.php の記述

タイトル下にアイキャッチ動画が入るようにするためには、
「st-eyecatch-under.php」ファイルをいじらないといけないようで。

ファイル内の下記1行を変更。
wp_oembedを使って、カスタムフィールドに入力したURLからYouTube動画を呼んでくるショートコードのphpに書き換え。

<?php the_post_thumbnail('full'); ?>

↓　上の1行をこのように書き換え

<?php
/* ------------------------------------------------------------------------
サムネの代わりにYouTube動画埋め込み★［ここから］
*/
if( get_field('youtube_eyecatch') ){ ?>
<div class="YoutubeEmbed">
<?php echo $embed_code = wp_oembed_get( get_field('youtube_eyecatch') ); ?>
</div>
<?php } ?>

作業した直後のメモではないので、ややウロ覚えだけど……
確かこれでうまくGTMが動いてくれたはず！

ちなみにGoogleTagManagerでの格闘はこちら。

Wordpressは専門ではないので…
毎回調べながらひいこらやってるから……別案件で少し離れてると再び脳みそに召喚してくるのが毎回大変。涙目

「有償テーマ＋プラグインでOK・できる範囲でいいので、どうしても自分たちで更新できるWordpressサイトを作ってほしい」という知り合い案件ぐらいしか基本は受けてはいないんですが。

ま、でも、そんなイバラの道だけど、
意図した挙動ができたりするとめっちゃ嬉しいので、たまにWordpress案件楽しいです😁

・・・・器用貧乏系フリーランスだけど。地味に地道に頑張っていきまっしょい・・・