【現金5,000円がもらえる!!】U-NEXT×三井住友銀行『Olive』コラボキャンペーンが開催

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

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

【毎日参加!!】Yahoo!オークション「全員あたるくじ」でPayPayポイントをゲットする方法 – 開催中は毎日くじを引こう!

キャンペーン

Yahoo! JAPAN IDがあれば誰でも毎日参加できるYahoo!オークション(旧:ヤフオク)の「全員あたるくじ」必ずPayPayポイントがもらえるので開催中は毎日参加がオススメ

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

Apple Watch

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

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

携帯電話

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

【2025年1月】ahamoのキャンペーンまとめ – SIMのみ契約で20,000dポイント還元、アゲちゃうWeeeek、お年玉、ポイ活、ahaクエストなど

携帯電話

ahamoと新規契約でdポイントがもらえたり、既存ユーザーでも対象の開催中のキャンペーンをまとめてみました。ドコモSIM経由のちょっと裏技っぽいおトクな契約方法も

【2025年1月】ドコモのiPhone、Androidスマホが機種変更で5,500円割引となるクーポンをWEB上からゲットする方法 – 対象機種、条件など

携帯電話

2025年1月もドコモがiPhoneやAndroidスマホの機種変更が5,500円割引となるクーポンをウェブ上で配布中!iPhone 16 / Pixel 9シリーズも対象。対象者限定なので取得できるかをチェック!


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

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

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

usedoor Twitter
usedoor facebook
usedoor feedly
usedoor RSS


新着ニュース&記事

【1.3万円OFF】「AirPods Max」を予約・購入する方法 – スペックや価格、予約開始日、発売日、販売ショップなどまとめ

iPhone / iPad

「AirPods Max」に5つの新しいカラーが登場!USB-Cコネクタも新しく搭載。発売日は2024年9月20日。

【毎月18日限定】楽天市場『ご愛顧感謝デー』でおトクに買い物する方法 – 18日=イチバの日!簡単な条件を満たせばポイント最大+3倍

ショッピング

楽天市場で毎月18日の24時間限定で「ご愛顧感謝デー」が開催!エントリー&買い物でポイント最大+3倍とおトクに買い物ができる

【X(旧Twitter)】Grokの設定が表示されない、グレーアウトして設定が変更できない時の対処方法

X(Twitter)

Xのアカウント内のGrokの設定が表示されなくなった、表示されてもグレーアウト状態で設定が変更できなくなった… これアカウントの設定を見直せば直ります

「Nintendo Switch 2」がついに発表!予約・発売日や価格、進化したポイントなどを解説。体験イベントも開催!!

ゲーム

ついに待望の「Nintendo Switch 2」が発表!予約・発売日・価格は?一足先に体験できるイベント「Nintendo Switch 2 体験会 TOKYO」が2025年4月26日・27日に開催。

楽天モバイルが「Rakuten Turbo 5G」の新モデルを発表。1月23日に発売、最大6ヵ月無料&20,000ポイント還元キャンペーンも

ニュース

楽天モバイルのコンセントに挿すだけで自宅にWi-Fiが構築できる「Rakuten Turbo 5G」にスリム化した新しいルーターが登場。1月23日より販売開始


新着記事をもっと見る

usedoorをフォロー


注目・おすすめ記事

【メルペイ】メルカリの売上金、ポイントをSuica残高にチャージする方法 – 1円もロスなしにそのまま交換できる

メルペイをApple PayのiDとして登録すれば、売上金やポイントがそのままSuica残高に交換できちゃう


【楽天モバイル】2回線目以降を契約して3,000ポイントをゲットする方法 – 「もう1回線」申込キャンペーンがスタート

楽天モバイルが2回線目以降を契約する人向けのキャンペーンを開始!2回線目契約で3,000ポイントがもらえる。要エントリーなのでご注意を


結局、楽天モバイルって普通に使える?メイン回線として日本のいろんなところで最強プランをガチで使いまくってみた。電波状況や通信速度の検証結果を紹介

メイン回線を楽天モバイル『最強プラン』に変更して日本の色んなところに行って通信状況などを調査してみた。結局エリアってどうなの?圏外にならない?


【2025年1月】ドコモのiPhone、Androidスマホが機種変更で5,500円割引となるクーポンをWEB上からゲットする方法 – 対象機種、条件など

2025年1月もドコモがiPhoneやAndroidスマホの機種変更が5,500円割引となるクーポンをウェブ上で配布中!iPhone 16 / Pixel 9シリーズも対象。対象者限定なので取得できるかをチェック!


【第3弾開始!!】ワイモバイル「10周年大感謝祭」まとめ – 誰でも参加OK!PayPay大還元、紹介、スマホ安売り、抽選会などで構成される大型キャンペーン開催!

ワイモバイルが10周年を記念した大型キャンペーン~第3弾~を12月19日から開催!ワイモバを契約中の人もしてない人も参加できてPayPayが当たるなど特典多数!



注目の記事をぜんぶ見る


最新記事&ニュース

【1.3万円OFF】「AirPods Max」を予約・購入する方法 – スペックや価格、予約開始日、発売日、販売ショップなどまとめ

「AirPods Max」に5つの新しいカラーが登場!USB-Cコネクタも新しく搭載。発売日は2024年9月20日。


【毎月18日限定】楽天市場『ご愛顧感謝デー』でおトクに買い物する方法 – 18日=イチバの日!簡単な条件を満たせばポイント最大+3倍

楽天市場で毎月18日の24時間限定で「ご愛顧感謝デー」が開催!エントリー&買い物でポイント最大+3倍とおトクに買い物ができる


【X(旧Twitter)】Grokの設定が表示されない、グレーアウトして設定が変更できない時の対処方法

Xのアカウント内のGrokの設定が表示されなくなった、表示されてもグレーアウト状態で設定が変更できなくなった… これアカウントの設定を見直せば直ります


「Nintendo Switch 2」がついに発表!予約・発売日や価格、進化したポイントなどを解説。体験イベントも開催!!

ついに待望の「Nintendo Switch 2」が発表!予約・発売日・価格は?一足先に体験できるイベント「Nintendo Switch 2 体験会 TOKYO」が2025年4月26日・27日に開催。


楽天モバイルが「Rakuten Turbo 5G」の新モデルを発表。1月23日に発売、最大6ヵ月無料&20,000ポイント還元キャンペーンも

楽天モバイルのコンセントに挿すだけで自宅にWi-Fiが構築できる「Rakuten Turbo 5G」にスリム化した新しいルーターが登場。1月23日より販売開始



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


usedoorをフォロー


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

【紹介リンクあり】JCBカードの『お友達紹介キャンペーン』でもれなく1,500円分のキャッシュバックをもらって入会する方法

JCBカード入会時に友だち紹介のリンクから申し込むともれなく1,500円分のキャッシュバックがもらえる『お友達紹介キャンペーン』開催。紹介リンクあり


【楽天モバイル】割引拡大!iPhone 16(128GB)をおトクに購入する方法 – Appleよりも安い価格で購入可能に。割引とポイント還元で実質109,700円

楽天モバイルでiPhone 16(128GB)がAppleよりも安く購入できる。のりかえで20,000円オフの一括121,700円、さらに12,000ポイント還元で実質109,700円に


【2025年1月】ahamoのキャンペーンまとめ – SIMのみ契約で20,000dポイント還元、アゲちゃうWeeeek、お年玉、ポイ活、ahaクエストなど

ahamoと新規契約でdポイントがもらえたり、既存ユーザーでも対象の開催中のキャンペーンをまとめてみました。ドコモSIM経由のちょっと裏技っぽいおトクな契約方法も


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

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


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

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



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