WordPressでOGP設定。(2016年8月15日更新)WordPressWordPressでOGP設定。OGPを設置するプラグインはいろいろありますが、<head>部分だけのことですので、プラグイン無しの方法を探しました。動作を指定するものもありましたが、パーツテンプレートだけでシンプルにまとめる方法を書いてくださってるサイトを見つけました。いつもお世話になります。適切に表示させ、画像(og:image)もサムネイル(アイキャッチ画像)があるか無いかなどの条件分岐でURLを設定するなど、必要なOGPプロパティがキレイに入っていて素敵。プロパティを追加して、このサイトでも早速使用したので、以下でその工程をメモります。2ヶ所だけ変更します。prefix属性で下記の記述を追加。http://ogp.me/ns/article#">このソースはHTML5用。Cardsの設定を全部まとめてメモ!」をご覧ください。続いて、コレから作るパーツテンプレートを読み込んでおきます。入れる場所は<head>〜</head>の中。<meta>要素を追加するパーツテンプレなので。get_template_part('header_ogp');?>ここでは「header_ogp.php」という名前のパーツテンプレートにしました。作る新しく作った「header_ogp.php」ファイル内の記述です。このパーツテンプレートは、1〜37行目まで寝ログさんのソースをそのままコピペしています。(このブログは自分自身の作業工程のメモでもあるので、コピーさせていただいたソースを含んだ「header_ogp.php」の全ソースを掲載しています)ソースの詳細は寝ログさんの記事をご参照ください。ソース内のコメントで詳細に説明してくださっています。記述を足して使わせていただきました。関する記述だけ(38〜39行)あと、Facebookのプロパティは、admin_IDの行をとって、App-IDだけにしました。Facebookのデバッガで、エラーも警告もでませんでした。ogp_image用の画像」のURLを指定します。ココでは「images」ディレクトリのjpgを指定していますが、他のディレクトリに置いても、pngでも。Cardsの設定を全部まとめてメモ!」をご覧ください。OGP画像は、記事以外(トップページやアーカイブ)のときは、screenshot.png(テーマのスクリーンショット)を使います(31行目)。作っていない場合は、この際ちゃんと作ろう。screenshot.pngがあったほうがイイ」をご覧ください。Embedカードのリンクを別ウィンドウで開く(PCのみ。Embedカード(ブログカード)の「テンプレートの構成」や「HTML要素のクラス名」などを調べました。Embedカード(ブログカード)について調べたことをメモっています。PMManaさん、コメントありがとうございます。文字列からHTMLタグを削除するんですね。aタグなどは、ちゃんと削除されて表示されるんですよね。エラーになったこともないです。今のWordPressのバージョンでは、抜粋のコンテンツからは「HTMLタグと画像は削除される」仕様のようです。https://goo.gl/3VitiV)というわけで、本文中の寝ログさんのソースはそのままにしておこうと思います。コメントをキャンセル入力エリアすべてが必須項目です。メールアドレスが公開されることはありません。内容をご確認の上、送信してください。jQuery、WordPressなど、Webデザイン関連をメモっていく覚え書きサイトです。Reserved.^。