楽天モバイルが「OPPO A3 5G」を一括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ページよりご連絡ください。

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

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

キャンペーン

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

【誰でもOK!!】『ドコモオンラインショップ限定 機種購入割引』でiPhone・Androidスマホを大幅割引で購入する方法&対象機種まとめ – 機種のみ購入でもOK!

携帯電話

ドコモオンラインショップ限定機種購入割引で対処機種が大幅割引!機種単体(白ロム)購入も対象。割引の条件、対象機種は?

DAZN(ダゾーン)をお得に契約する方法

スポーツ

DAZNをおトクに利用する方法をご紹介!サッカーW杯アジア最終予選のアウェーはDAZN独占配信。2025年6月にアメリカで開催される「FIFAクラブワールドカップ2025」全63試合を無料で独占配信。

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

スマホアプリ

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

【紹介コードあり】みんなの銀行アプリで口座開設して最大1,000円をゲットする方法

銀行

紹介コードを入力して口座開設すると、紹介する人・紹介された人それぞれに現金500円が貰える「お友だち紹介プログラム」キャンペーン開催中!「新規口座開設限定!サービス体験プログラム」にも参加して合計1,000円ゲット!


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

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

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

usedoor Twitter
usedoor facebook
usedoor feedly
usedoor RSS


新着ニュース&記事

ワイモバイルで認定中古品「iPhone SE(第3世代)」「iPhone 12」が値下げ

ニュース

ワイモバイルオンラインストアでソフトバンク認定中古品のiPhone SE(第3世代)とiPhone 12が一括9,800円!

Appleギフトカードをおトクに購入する方法・キャンペーン【2026年3月】

キャンペーン

Appleのあらゆる製品やサービスの購入に使える「Appleギフトカード(Apple Gift Card)」をキャンペーンやセールでおトクにゲット!

Amazonで対象のギフトカードが9%OFF、さらにAmazonポイント1%還元

ニュース

Amazonで「Uber ギフトカード」や「U-NEXT ギフトコード」が9%OFF&Amazonポイント1%還元のキャンペーンが開催!キャンペーン期間は3月3日~16日まで。

Uber ギフトカードをおトクに購入する方法・キャンペーン【2026年3月】

キャンペーン

Uber、Uber Eatsを利用する際に利用できる「Uber ギフトカード」をキャンペーンやセールでおトクにゲット!

Android 16へのアップデート予定機種・開始日まとめ【ドコモ・au・ソフトバンク・ワイモバイル・楽天モバイル・UQモバイル】アップデート出来るか調べる方法

Androidスマホ

2025年のメジャーアップデート『Android 16』ドコモ、au、ソフトバンク、楽天モバイルなどキャリアから販売されているスマホはアップデート対象?


新着記事をもっと見る

usedoorをフォロー


注目・おすすめ記事

Kindle Unlimitedにおトクに登録できるキャンペーンまとめ – Amazonの本・雑誌読み放題をおトクに契約する方法

Amazonの読み放題サービス「Kindle Unlimited」のキャンペーンをまとめています。12月1日までブラックフライデー連動キャンペーンで3ヵ月間99円!


クレジットカードなしで格安SIMと契約する方法 – 口座振替、引き落とし、デビットカード、その他決済に対応したMVNOまとめ

クレカなしでも契約できる、口座振替やポイント支払いに対応している格安SIM(MVNO)の会社とプランをまとめ&比較しました


【実質30,405円】「AirPods Pro」をおトクに購入する方法 – 予約開始日や発売日、価格、第1世代/第2世代のスペックの違い・比較、販売店などまとめ

USB-C充電機能を搭載した新モデル「AirPods Pro(第2世代)」が2023年9月22日に発売!価格は39,800円(税込)。第1世代と第2世代の違い・比較も


Amazonの音楽聴き放題「Music Unlimited」をおトクに登録する方法 – 入会キャンペーンまとめ

Amazonの音楽聞き放題サービス「Music Unlimited」が4ヵ月無料で利用できる激アツのプライム感謝祭連動キャンペーン開催中!10月10日(金)まで


楽天カードを1つの名義で国際ブランドの異なる2枚のカードを発行する方法 – 2枚持ちでも年会費無料!

楽天カードの『2枚目のカード』サービスで、異なる国際ブランドやデザインの楽天カードがもう1枚作成できる!



注目の記事をぜんぶ見る


最新記事&ニュース

ワイモバイルで認定中古品「iPhone SE(第3世代)」「iPhone 12」が値下げ

ワイモバイルオンラインストアでソフトバンク認定中古品のiPhone SE(第3世代)とiPhone 12が一括9,800円!


Appleギフトカードをおトクに購入する方法・キャンペーン【2026年3月】

Appleのあらゆる製品やサービスの購入に使える「Appleギフトカード(Apple Gift Card)」をキャンペーンやセールでおトクにゲット!


Amazonで対象のギフトカードが9%OFF、さらにAmazonポイント1%還元

Amazonで「Uber ギフトカード」や「U-NEXT ギフトコード」が9%OFF&Amazonポイント1%還元のキャンペーンが開催!キャンペーン期間は3月3日~16日まで。


Uber ギフトカードをおトクに購入する方法・キャンペーン【2026年3月】

Uber、Uber Eatsを利用する際に利用できる「Uber ギフトカード」をキャンペーンやセールでおトクにゲット!


Android 16へのアップデート予定機種・開始日まとめ【ドコモ・au・ソフトバンク・ワイモバイル・楽天モバイル・UQモバイル】アップデート出来るか調べる方法

2025年のメジャーアップデート『Android 16』ドコモ、au、ソフトバンク、楽天モバイルなどキャリアから販売されているスマホはアップデート対象?



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


usedoorをフォロー


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

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

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


【紹介コードあり】みんなの銀行アプリで口座開設して最大1,000円をゲットする方法

紹介コードを入力して口座開設すると、紹介する人・紹介された人それぞれに現金500円が貰える「お友だち紹介プログラム」キャンペーン開催中!「新規口座開設限定!サービス体験プログラム」にも参加して合計1,000円ゲット!


ahamo、LINEMO、povoどれにする?開催中キャンペーンの特典と条件を比較してみた – キャッシュバックやポイント還元などまとめ

ドコモのahamo、ソフトバンクのLINEMO、auのpovo、。大容量低価格プランを今契約するならどこが一番おトクにキャンペーンで契約できる?を比較してみた


ワイモバイルを通常よりおトクに契約する方法 – SIMのみで26,000円相当還元!!

ワイモバイルオンラインストアでワイモバイルのSIMカードを契約すると最大26,000円相当の還元がもらえる!


【GUで全額還元!!】ペイペイジャンボとは?開催中のキャンペーン、還元条件、対象ショップまとめ – 当たらない?当選の確認手順や本人確認などの参加条件など

最大1,000%還元や全額還元などが当たる「ペイペイジャンボ」開催!対象となる条件や特典をまとめました。楽しいしおトク。だけどなかなか当たらない…



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