3646日くらい過ぎています。年で言ったら9.99年くらいです。情報が古くなってる可能性もあるので参考程度に御覧ください。Facebookなどで利用されているOpenGraph。ソーシャルメディアでシェアしてもらうことを考えるとこれの設定はほぼ必須ですよね。今回はこのOpenGraphのうち、シェアされた時にアイキャッチ画像にもなるサイトのサムネイル(og:image)をWordPressのアイキャッチとあわせる設定をうちのブログでもようやく実装したのでやり方を共有します。基本的なOpenGraphの設定は済んでいるものとして進めます。実際に今回自分が導入したコードを紹介します。ヘッダー部分(たいていはheader.php)のog:imageの部分を書き換えます。?>">また、アイキャッチ機能を使いますので、有効化していない場合(投稿ページにアイキャッチが現れない場合)は、functions.phpに以下も書いて下さい。投稿または固定ページ(あと添付ファイルページ)の時かつ、アイキャッチが設定されているという条件の時だけ、og:imageをアイキャッチ画像にするようにしました。{}まずはじめに、is_singular()で投稿の本文(詳細ページ)かどうかを判別しています。判定が同時にできちゃう便利なやつです。別々には判別出来ませんが、一覧表示されるページ以外のときに何か処理をさせたい場合などには便利です。日本語版なんでこうしたのかというと、一覧の時にシェアされた場合に、最新の投稿のアイキャッチが出てしまうのを防ぐためです。このへんはサイトの運用スタンスにもよりますが、トップページをシェアした場合はサイト全体の概要を表示させ、個別ページ(投稿)をシェアされた場合はそれぞれに特化したOpenGraphを出したい場合なんかはこのような設定にした上で、トップページやカテゴリで更に細かく書き出し分けを行うのがいいのではないでしょうか?自分も今回の例ではカテゴリ関連は含めていませんが、いずれはカテゴリページをシェアした場合はカテゴリ毎にサムネイルを出し分けなんてのもやってみようかと計画中です。これはループ外で投稿のIDを取り出す関数です。$post->ID;}と非常にシンプルですので、これをこのまま書いても大丈夫だと思います。指定した投稿(省略時は現在の投稿)がアイキャッチを持っているかどうかを判別します。かえりますので、これでアイキャッチの有無により代替画像を出す設定ができますね。こちらは現在の投稿のアイキャッチIDを取得するものです。アイキャッチの情報を取得します。使い方は、wp_get_attachment_image_src(ID,サイズ,アイコン設定);となります。IDは添付ファイルのIDですね。続いてサイズはthumbnail,medium,large,fullから指定するか、配列で幅と高さを指定します。アイコン設定は、アイコン画像を使う場合にtrueにします。いうことで、これで画像情報が取れました。$ogimage[0];としてURLを取り出しています。src基本的な部分は以上です。部分はアイキャッチが見つからない場合や、アイキャッチをog:imageに設定したくないページでのデフォルト画像の設定になります。いるように書いておいて下さい。代入されるようになり、アイキャッチを指定した投稿をシェアすればアイキャッチが、アイキャッチなしか、一覧ページの時はデフォルト画像が表示されるようになります。テストする方法Facebookには、オープングラフのテストをするためのデバッガーというツールがありますアイキャッチ付きで投稿した上で、このサイトに個別記事のURLを入力すれば、実際に表示されるかを簡単にチェック出来ます。簡単な方法としては、出来上がった個別記事のURLをFacebookの投稿入力フィールドにペーストしてしまうことです。URLを貼り付けると自動的に投稿の情報を取得しに行きますので、設定が済んでいれば投稿前でもOpenGraphのプレビューを見ることができます。キャンセル投稿を送信できませんでした。メールアドレスを確認してください。メール送信チェックに失敗しました。このブログではメールでの投稿共有はできません。%d人のブロガーが「いいね」をつけました。