【DAZNとDMMプレミアムが利用できるのにDAZN単体契約より安い!!】DAZNとDMMの最強プラン「DMM×DAZNホーダイ」の提供開始

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%還元や全額還元などが当たる「ペイペイジャンボ」開催!対象となる条件や特典をまとめました。楽しいしおトク。だけどなかなか当たらない…

LYPプレミアムにおトクに登録する方法&会員が使える機能まとめ – 3ヵ月無料&LINEやYahooで会員限定で使える機能が多数

キャンペーン

LYPプレミアムが3月31日まで激アツな入会キャンペーンを開催!基本料金3ヵ月無料+4,000円分のPayPayポイント+Yahoo!ショッピングの3,000円割引クーポン×2枚という超豪華特典を用意!

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

スポーツ

DAZNをおトクに利用する方法をご紹介!2月23日よりABEMAでもDAZNが視聴できる新プラン『ABEMA de DAZN』の提供開始。

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

webサービス

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

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

携帯電話

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


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

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

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

usedoor Twitter
usedoor facebook
usedoor feedly
usedoor RSS


新着ニュース&記事

プライムビデオで『ゴジラ-1.0』が独占配信決定!5月3日より見放題作品として配信。Amazonプライム会員は追加料金なしで視聴できる!!

ニュース

あのゴジラ-1.0が早速プライムビデオに登場!ゴールデンウィーク後半はゴジラ!見放題作品なのでプライム会員は追加料金なし。すでに視聴ページも公開中

ワイモバイルの20GBプランが最大6ヵ月間実質900円で利用できるオンラインストア限定キャンペーンが開催

キャンペーン

ワイモバイルオンラインストア限定で、PayPayポイント3,115円相当が6ヵ月間還元(合計18,690円相当)される「SIM契約でPayPayもらえるキャンペーン」が開催

JCBがコンビニで最大+20倍還元となる「JCBポイントアップ祭2024 ~第1弾~」を開催。オリジナルシリーズが対象でセブンイレブンなどで最大10%還元

キャンペーン

JCBオリジナルシリーズが「JCBポイントアップ祭」を開催。第1弾はコンビニで最大+20倍(10%)還元!カードによって還元率が異なる&コンビニ毎にエントリーが必要

ワイモバイルを通常よりおトクに契約する方法 – SIMのみで24,690円相当還元!!【2024年4月】

キャンペーン

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

ソフトバンクが「新トクするサポート(プレミアム)」の提供を4月18日より開始

ニュース

ソフトバンクが高価格機種でも機種代金の支払いが1年間(最短)の短期間でお得に新しい機種に買い替えることができるプログラム「新トクするサポート(プレミアム)」の提供を開始


新着記事をもっと見る

usedoorをフォロー


注目・おすすめ記事

ふるさと納税で返礼品&Amazonギフトカードなどの特典がもらえるキャンペーンまとめ – 最大20%還元などが開催中

ふるさと納税サイト毎に開催している返礼品とは別に寄付金額に応じたAmazonギフトカードなどがもらえるキャンペーンをまとめてみた


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

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


楽天カードでSuicaにチャージしてポイントを貯める方法(iPhone・Android対応)

楽天カードからiPhone、AndroidのモバイルSuicaに条件を満たした上でチャージすればポイントが貯まる!還元率は0.5%


【キャリア最安値!!】楽天モバイル『iPhone対象機種特価キャンペーン』で割引&ポイント大幅還元でおトクにiPhoneを購入する方法 – 対象モデルや条件まとめ

7月22日より楽天モバイルがiPhoneを最大12,000円割引する「iPhone対象機種特価キャンペーン」を開始!Apple Storeと同額&大幅ポイント還元で買える!


ドコモのiPhone・AndroidスマホのSIMロックを解除する方法 – WEBからやれば無料!白ロム、中古端末も解除できる。契約条件によってはロックなしも

自分ではドコモから購入していない白ロム、中古端末も条件を満たしていれば解除できる!ドコモのSIMロック解除は自分でやれば無料です



注目の記事をぜんぶ見る


最新記事&ニュース

プライムビデオで『ゴジラ-1.0』が独占配信決定!5月3日より見放題作品として配信。Amazonプライム会員は追加料金なしで視聴できる!!

あのゴジラ-1.0が早速プライムビデオに登場!ゴールデンウィーク後半はゴジラ!見放題作品なのでプライム会員は追加料金なし。すでに視聴ページも公開中


ワイモバイルの20GBプランが最大6ヵ月間実質900円で利用できるオンラインストア限定キャンペーンが開催

ワイモバイルオンラインストア限定で、PayPayポイント3,115円相当が6ヵ月間還元(合計18,690円相当)される「SIM契約でPayPayもらえるキャンペーン」が開催


JCBがコンビニで最大+20倍還元となる「JCBポイントアップ祭2024 ~第1弾~」を開催。オリジナルシリーズが対象でセブンイレブンなどで最大10%還元

JCBオリジナルシリーズが「JCBポイントアップ祭」を開催。第1弾はコンビニで最大+20倍(10%)還元!カードによって還元率が異なる&コンビニ毎にエントリーが必要


ワイモバイルを通常よりおトクに契約する方法 – SIMのみで24,690円相当還元!!【2024年4月】

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


ソフトバンクが「新トクするサポート(プレミアム)」の提供を4月18日より開始

ソフトバンクが高価格機種でも機種代金の支払いが1年間(最短)の短期間でお得に新しい機種に買い替えることができるプログラム「新トクするサポート(プレミアム)」の提供を開始



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


usedoorをフォロー


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

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

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


【2024年4月】PayPayで開催中のキャンペーンまとめ – 特典や適用条件など。ワクワクペイペイ、クーポンや地域限定etc…

ほぼ常時様々なお店やエリアで開催されるPayPayのおトクなキャンペーンやクーポンを徹底まとめ。特典や参加条件、今月対象のお店は?


【割引クーポンあり】1Password(有料版)をおトクに契約する方法 – ソースネクストの3年版がコスパよし!価格比較してみた

1Password3年版がソースネクストに登場!公式で購入するより安く1Passwordが使える&ソースネクストから割引クーポンもらいました


【5月9日まで】Amazon「Audible」を2ヵ月無料で登録する方法 – 本の朗読サービスが通常よりもおトクに利用できるキャンペーン、条件などまとめ

Amazonの朗読サービス「Audible」が2ヵ月無料で利用できるおトクなキャンペーンが2月29日まで開催中!


【割引増額中】au「5G機種変更おトク割」でiPhone・Androidをおトクに購入する方法 – 適用条件と対象機種、割引金額まとめ。キャッシュバックも

5G対応端末への機種変更が割引されるauの『5G機種変更おトク割』条件を満たすことでiPhoneやAndroidスマホにおトクに機種変更できる。対象機種まとめ



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