【激熱】DMMプレミアム新規登録&2ヶ月継続でDMMポイント3,000ptプレゼントキャンペーン

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ページよりご連絡ください。

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

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

銀行

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

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

セール

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

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

キャンペーン

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

【3ヵ月無料!!】Amazonの音楽聴き放題「Music Unlimited」をおトクに登録する方法、開催中のキャンペーンまとめ

キャンペーン

Amazonの音楽聞き放題サービス「Music Unlimited」が3ヵ月間無料で利用できる激アツキャンペーン開催!2025年5月8日(木)まで。非プライム会員でもOK!

【楽天モバイル】初めて20GB超過利用して1,500ポイントをゲットする方法 – 毎月開催&必ずもらえる!最強プランにピッタリのキャンペーン。特典増額中!

キャンペーン

楽天モバイル契約者限定で過去に一度も20GBを超過したことがなく20GBを超過しそうな人は必見!エントリーと利用だけで1,500ポイントがもらえちゃう


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

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

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

usedoor Twitter
usedoor facebook
usedoor feedly
usedoor RSS


新着ニュース&記事

ファミペイ翌月払いの新規申込みと同時にファミペイカードも申込み可能に

ニュース

2025年5月20日から、ファミペイ翌月払いの新規申込みと同時にファミペイカード(リアルカード)も申込み可能になりました。

【エアウォレット】15%還元キャンペーンを開催 – 既存ユーザーもOK!ローソンや無印良品、キャンドゥetc…での支払いが対象。参加条件などまとめ

キャンペーン

AirWALLETがローソンやミニストップなどの対象店舗でCOIN+でお支払いすると15%を還元するキャンペーンを5月20日~6月19日に開催。既存ユーザーも対象!新規ユーザーは登録&チャージでさらに2,000Pontaポイントもらえる!

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

LINE

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

【最大20,000dポイント】運試しに。ドキドキキーワードあみだくじでdポイントをゲットする方法 – 毎週火曜日更新。今週のキーワードは?

キャンペーン

超簡単に参加できるクジ。当たればラッキー!dアカウント+ポイントカード持っている人は是非!今週のキーワードも紹介しています

ソフトバンクが「すみっコぐらしスマホ」にAndroid 14のアップデートの提供を開始

ニュース

ソフトバンクのあんしんファミリースマホがベースとなっている3,000台限定モデル「すみっコぐらしスマホ」にAndroid 14のアップデートが配信開始


新着記事をもっと見る

usedoorをフォロー


注目・おすすめ記事

【ポケモンGO】アプリを起動しなくても距離をカウントする『いつでも冒険モード』の設定方法 – Pokemon GO Plusとの違い、比較

ついにアプリ画面を開いていなくてもポケモンGO内の距離がカウントされるモードが登場!ポケモンGOプラスユーザーも設定しておくことをオススメします


【裏技?】ahamoを契約して最大20,000dポイントをもらう方法 – ドコモSIMのみ契約⇒即ahamoへのプラン変更でポイントが付与された

ドコモのSIMを単体契約⇒即ahamoにプラン変更で最大20,000dポイントがもらえる!直接ahamoで契約するよりもかなりおトクに


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

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


【ドコモ】『5G WELCOME割』で5Gスマホをおトクに購入する方法 – 契約別の割引金額、適用条件と対象機種まとめ。iPhone&人気Androidも対象!

ドコモの5G対応スマホが割引価格で購入できる「5Gウェルカム割」をまとめてみた。割引対象拡大!Androidの他、iPhone 14シリーズやSEも対象!


「iPhone 15 / Plus / Pro / Pro Max」の価格&割引キャンペーン、スペック、予約開始&発売日などまとめ – キャリア版/SIMフリー版をおトクに購入する方法

2023年モデルのiPhone 15シリーズがApple Storeや日本の4キャリアから発売!Amazonや家電量販店などの各ショップ、キャリア版の販売価格や割引キャンペーンをまとめました



注目の記事をぜんぶ見る


最新記事&ニュース

ファミペイ翌月払いの新規申込みと同時にファミペイカードも申込み可能に

2025年5月20日から、ファミペイ翌月払いの新規申込みと同時にファミペイカード(リアルカード)も申込み可能になりました。


【エアウォレット】15%還元キャンペーンを開催 – 既存ユーザーもOK!ローソンや無印良品、キャンドゥetc…での支払いが対象。参加条件などまとめ

AirWALLETがローソンやミニストップなどの対象店舗でCOIN+でお支払いすると15%を還元するキャンペーンを5月20日~6月19日に開催。既存ユーザーも対象!新規ユーザーは登録&チャージでさらに2,000Pontaポイントもらえる!


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

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


【最大20,000dポイント】運試しに。ドキドキキーワードあみだくじでdポイントをゲットする方法 – 毎週火曜日更新。今週のキーワードは?

超簡単に参加できるクジ。当たればラッキー!dアカウント+ポイントカード持っている人は是非!今週のキーワードも紹介しています


ソフトバンクが「すみっコぐらしスマホ」にAndroid 14のアップデートの提供を開始

ソフトバンクのあんしんファミリースマホがベースとなっている3,000台限定モデル「すみっコぐらしスマホ」にAndroid 14のアップデートが配信開始



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


usedoorをフォロー


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

【紹介コードあり】Yahoo!フリマの「友達紹介キャンペーン」でPayPayポイント500円相当をゲットする方法(2025年4月)

Yahoo!フリマ(旧PayPayフリマ)を始めるなら「友達紹介キャンペーン」の紹介コード入力で500円分のPayPayポイントがもらえる。2025年4月30日まで


dマガジンをおトクに契約する方法 – 必ず400dポイントもらえる、実質最大3ヵ月ほぼ無料キャンペーンなど

dマガジンはWEBから入会すれば400dポイントがもらえる!初回31日無料とあわせて実質2ヵ月無料で利用できる。エントリーはお忘れなく!


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

AirWALLETを始めるなら友だち招待キャンペーンで招待コード(紹介コード)を入力しての利用開始がおトク!2025年3月28日まで500円分の現金がもらえる。


【業界最安値!!】月額290円~!HISモバイルの『自由自在プラン』で毎月の携帯電話料金をおトクにする方法 – eSIMにも対応!

HISモバイルが2022年5月より新プラン『自由自在プラン』を提供開始!ドコモ回線で格安SIMの中でも最安値クラスの音声通話付きで月額290円~!


【ソフトバンクオンラインショップ限定】「web割」で機種代金を最大21,600円割引する方法

オンライン限定!MNP(のりかえ)なら最大21,600円割引!販売しているほとんどのiPhone、Androidスマホがキャンペーン対象。



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