楽天モバイルが「arrows We2」を一括1円で販売

Open Graph Protocol(通称:OGP)の設定方法 【wordpressサンプルあり】

シェアの内容を好きなように設定しよう


最終更新 [2014年7月15日]

この記事内には広告リンクが含まれています。

\\どうかフォローをお願いします…//


< この記事をシェア >

usedoor Twitterでシェア
usedoor facebookでシェア
usedoor はてなブックマークに保存
usedoor Pocketに保存
usedoor LINEでシェア
usedoor feedly


Wordpressをはじめ、ブログやサイトの記事・ページをfacebookやTwitterなどのSNSで共有してほしい時に設定しておいた方が絶対いいOpen Graph Protocol(通称:OGP)の設定方法とwordpressでのサンプルです。

usedoorのようにfacebookのシェアボタンやTwitterのつぶやくボタンなどを設置する場合はもはや必須と思われる項目です。

[関連記事]
FacebookのOGPキャッシュを削除する方法

こんな感じになりますよ

このOGPを適切に設定していることでfacebookのシェアボタンを押した際などに自分がシェアしてほしい内容をキレイにfacebookに通知することができちゃいます。

↑のfacebookの例ですと、https://usedoor.jp/howto/life/keitai/au-157-30000p-get/のページをシェアする際に「画像」「タイトル」「サブタイトル(説明文)」「サイトの情報」をOGPに設定しています。
もしusedoorにてOGP設定が適切に行われていないとタイトルと画像がぜんぜん違うものだったりしちゃう場合もあります。

facebookに限らず、このOpen Graph Protocol(通称:OGP)は全てのSNSにて共通基準となっています。


OGPの設定方法

なにやら難しそうなOGP設定ですが、設定方法はいたって超簡単です。

ヘッダー(head)内に指定の文字を書くだけ!

OGPの設定はヘッダーの中にある<head>~</head>の間にmeta要素を書いてやるだけでOKです。

OGPの内容は↓のようなものがあります。

og:type

サイトのタイプを記載します。
websiteやblogなどがあります。
usedoorは「website」に設定しています。

<meta property=”og:type” content=”website” />


og:title

タイトルを記載します。
usedoorは各エントリのタイトルをここに設定しています。

<meta property=”og:title” content=”Open Graph Protocol(通称:OGP)の設定方法 【wordpressサンプルあり】 &raquo 使い方・方法まとめサイト – usedoor” />


og:description

サブタイトル(説明文)を記載します。
usedoorは各エントリの見出し(抜粋)にしています。

<meta property=”og:description” content=”シェアの内容を好きなように設定しよう” />


og:url

ページのURLを記載します。

<meta property=”og:url” content=”https://usedoor.jp/howto/web/code/open-graph-protocol-setting/” />


og:site_name

サイト名を記載します。

<meta property=”og:site_name” content=”使い方・方法まとめサイト – usedoor” />


og:image

記事と一緒にシェアしたい画像のURLを記載します。
これは各SNSからアクセスできる画像の絶対パスとなり、facebookであれば200px×200px以上でないとはたらきません。

<meta property=”og:image” content=”https://usedoor.jp/wp-content/uploads/2013/10/au_30000p.jpg” />


OGPの主要な部分は↑な感じだと思います。
usedoorもここまでしか設定していません。

その他にも

og:email

連絡用メールアドレス

og:locality

場所

og:country-name



などといろいろと取り揃えられています。

WordPressでのOGP設定サンプル

usedoorで実際に設定しているOGPのWordpressサンプルです。

<meta property=”og:type” content=”website” />
<meta property=”og:title” content=”<?php echo trim(wp_title( ”, false)); ?>” />
<meta property=”og:description” content=”<?php echo strip_tags( get_the_excerpt() ); ?>” />
<meta property=”og:url” content=”<?php echo(“http://” . $_SERVER[“HTTP_HOST”] . $_SERVER[“REQUEST_URI”]); ?>” />
<meta property=”og:site_name” content=”使い方・方法まとめサイト – usedoor” />
<meta property=”og:image” content=”<?php echo wp_get_attachment_url( get_post_thumbnail_id() , ‘full’ ); ?>” />

適切なOpen Graph Protocol(通称:OGP)設定でキレイに記事をシェアしてもらいましょー!


[関連記事]
FacebookのOGPキャッシュを削除する方法

< この記事をシェア >

usedoor Twitterでシェア
usedoor facebookでシェア
usedoor はてなブックマークに保存
usedoor Pocketに保存
usedoor LINEでシェア
usedoor feedly



\\どうかフォローをお願いします…//



このOpen Graph Protocol(通称:OGP)の設定方法 【wordpressサンプルあり】の最終更新日は2014年7月15日です。
記事の内容に変化やご指摘がありましたら問い合わせフォームまたはusedoorのTwitterまたはusedoorのFacebookページよりご連絡ください。

現在開催中の「おトク」なキャンペーン、セール

【UQモバイル】のりかえ時にクーポンを適用して20,000円分のau PAY残高をもらう方法 – 買い物不要&クーポンコードあり。実際に申込してみた

携帯電話

UQ mobileにSIMのみでのりかえ契約するなら絶対にコレ!買い物不要で20,000円分のau PAY残高が還元されるスペシャルクーポンを使ってみた

Amazonで『ギフトカード大還元祭』開催!対象のお店でAmazon Pay利用で1回ごとに最大10,000円分のギフトカードが当たる抽選に参加できる&回数上限なし

キャンペーン

Amazon Payを対象店舗で1回1,000円以上利用すると必ずAmazonギフトカードが当たる抽選に参加できる「ギフトカード大還元祭」開催!期間は6月7日(金)まで

ワイモバイルでおトクに機種変更できるスマホまとめ – moto g64y 5Gが一括6,800円など、Libero Flipが一括9,800円&PayPay還元など

携帯電話

現在ワイモバイルで機種変更でもおトクに購入できるスマホまとめ。機種変更割引&端末単体割引で機種変更でも激安購入できる機種アリ!

「Audible」のキャンペーンまとめ – Amazonの朗読サービスを通常よりもおトクに利用する方法

キャンペーン

10月14日までAudibleが過去最長クラスの2ヵ月無料で利用できるプライムデー連動キャンペーン開催中!Amazonの朗読サービス「Audible」に登録するならキャンペーンの利用がオススメ

【10,000ポイント還元!!】楽天モバイル『Apple Watchスタートキャンペーン』でおトクにApple Watchを購入する方法 – 対象商品&条件まとめ

Apple Watch

楽天モバイルで条件を満たした上でApple Watch購入で最大10,000ポイントが還元されるキャンペーン開催!セルラー版をお試ししたい人に最適


開催中のキャンペーンをもっと見る

usedoorの新着記事をチェック!

記事を書くヤル気が出るのでフォローよろしくお願いしますm(._.)m

usedoor Twitter
usedoor facebook
usedoor feedly
usedoor RSS


新着ニュース&記事

【招待コードあり】エアウォレットの友だち招待キャンペーンで最大1,000円分のCOIN+残高をゲットする方法 – 適用条件や招待コードの発行/確認手順など

キャンペーン

AirWALLETを始めるなら友だち招待キャンペーンで招待コード(紹介コード)を入力しての利用開始がおトク!2026年3月16日まで最大1,000円分のCOIN+残高がもらえる。

Netflixの料金だけでLYPプレミアムが利用できる「LYPプレミアム with Netflix」の提供開始

ニュース

LINEヤフーとNetflixが業務提携!Netflixの月額料金だけでLYPプレミアムの全特典が利用できる新プラン「LYPプレミアム with Netflix」が登場。

【1/13~16に追加抽選】『ピカピカボックス2026』の抽選販売に参加、購入する方法 – 2026年ポケモンセンターオンライン福袋

福袋

2026年もポケセンオンラインの福袋「ピカピカボックス」が登場!今年はコイキングの「ショルダーバッグ」が入ってる!抽選販売期間は2025年11月21日14:00~27日16:59。価格は税込4,400円。

【LINE】無料スタンプ&隠しスタンプまとめ(2026年1月13日更新)ダウンロード方法&取得条件

LINE

現在配布されているLINEの無料スタンプ&隠しスタンプを徹底まとめ!スタンプを無料ゲットできる条件や取得するまでの手順、有効期限など

【21.2.0登場】Nintendo Switchのシステムソフトウェアをアップデートする方法 – ニンテンドースイッチおよびスイッチ2本体の現在のバージョン確認&更新手順

ゲーム

Nintendo Switchにももちろんソフトウエアバージョンあり。本体更新データの配信が開始されたらアップデートしよう


新着記事をもっと見る

usedoorをフォロー


注目・おすすめ記事

「メルペイ」のクーポン&キャンペーンまとめ – クーポンは人によって違うので来ない場合も… メルカードキャンペーンもあり

メルカリが提供するスマホコード支払「メルペイ」は定期的におトクなキャンペーンを開催&クーポンを配布!人によって違うクーポンを徹底的にまとめてみた


【紹介コードあり】増量中!メルカリ/メルペイの紹介キャンペーンでポイントをゲットする方法 – 2025年9月はコード利用で1,000ポイントがもらえる

メルカリ・メルペイを始めるなら最初に招待コードの登録がおトク。2025年9月は通常の2倍となる1,000ポイントがもらえる!


【Android】スマホのバッテリー消費を抑えて電池持ちをアップさせる方法まとめ – Pixelのバッテリーが悪いのでいろいろ設定してみた

Pixel 4のバッテリー持ちが悪すぎるのでAndroid全般の電池消費を節約する設定をガッツリ行ってみた


【iPhone・Androidスマホ】『緊急速報』をオン⇔オフする方法 – 外出自粛や緊急地震速報、Jアラートなどを無効化もできる。届かない、非対象機種の対処方法も

緊急地震速報&ミサイル発射も警告してくれるJアラートはちゃんとスマホで受信出来た方がいい!外出自粛はちょっとウザいけどしょうがない


AmazonでPayPayで支払いする方法 – 初期セットアップと利用条件、使用できる残高/ポイント、キャンペーンなどまとめ

ついにAmazonでPayPayで支払いができるようになった!PayPay残高とポイントのみ利用可能で最初のみ初期設定が必要



注目の記事をぜんぶ見る


最新記事&ニュース

【招待コードあり】エアウォレットの友だち招待キャンペーンで最大1,000円分のCOIN+残高をゲットする方法 – 適用条件や招待コードの発行/確認手順など

AirWALLETを始めるなら友だち招待キャンペーンで招待コード(紹介コード)を入力しての利用開始がおトク!2026年3月16日まで最大1,000円分のCOIN+残高がもらえる。


Netflixの料金だけでLYPプレミアムが利用できる「LYPプレミアム with Netflix」の提供開始

LINEヤフーとNetflixが業務提携!Netflixの月額料金だけでLYPプレミアムの全特典が利用できる新プラン「LYPプレミアム with Netflix」が登場。


【1/13~16に追加抽選】『ピカピカボックス2026』の抽選販売に参加、購入する方法 – 2026年ポケモンセンターオンライン福袋

2026年もポケセンオンラインの福袋「ピカピカボックス」が登場!今年はコイキングの「ショルダーバッグ」が入ってる!抽選販売期間は2025年11月21日14:00~27日16:59。価格は税込4,400円。


【LINE】無料スタンプ&隠しスタンプまとめ(2026年1月13日更新)ダウンロード方法&取得条件

現在配布されているLINEの無料スタンプ&隠しスタンプを徹底まとめ!スタンプを無料ゲットできる条件や取得するまでの手順、有効期限など


【21.2.0登場】Nintendo Switchのシステムソフトウェアをアップデートする方法 – ニンテンドースイッチおよびスイッチ2本体の現在のバージョン確認&更新手順

Nintendo Switchにももちろんソフトウエアバージョンあり。本体更新データの配信が開始されたらアップデートしよう



最新記事をもっとチェック


usedoorをフォロー


現在開催中の"おトク"なセール、キャンペーン、お買い得アイテムまとめ

【招待コードあり】エアウォレットの友だち招待キャンペーンで最大1,000円分のCOIN+残高をゲットする方法 – 適用条件や招待コードの発行/確認手順など

AirWALLETを始めるなら友だち招待キャンペーンで招待コード(紹介コード)を入力しての利用開始がおトク!2026年3月16日まで最大1,000円分のCOIN+残高がもらえる。


【毎日5%~7%還元!!】Yahoo!ショッピング『PayPay支払いで毎日5%貯まる』キャンペーンでおトクに買い物する方法 – 条件などまとめ

Yahoo!ショッピングで毎日5%還元となるキャンペーンが開催!プレミアム会員などは常時7%還元も。対象となる買い物の条件などまとめ


【楽天モバイル】三木谷氏の紹介キャンペーンで14,000ポイントをもらって回線を契約する方法。超おトクに契約できるけど注意点あり

楽天の社長、三木谷氏のRakuten最強プラン紹介キャンペーンを利用すればのりかえ契約で14,000ポイント、新規契約は11,000ポイントがもらえる!ただし、現在は特典付与は1人1回まで。


Huluを通常よりもおトクに契約する方法、キャンペーンまとめ

動画見放題サービス「Hulu」通常特典は2週間無料だけだけどキャンペーンを利用すれば無料期間が延長されたりポイント還元などでおトクに入会できる!


【最大44,000円割引!!】ドコモが認定中古スマホのセールを開催。docomo CertifiedのiPhone・Androidがかなり安く購入できる!半額以下のスマホもあり

10月25日よりドコモがdocomo Certified(認定中古スマホ)を対象としたセールを開催。新規契約/のりかえで大幅割引が適用される



開催中のキャンペーンをぜんぶ見る