【リアルタイム更新】安い!キャリア版iPadの在庫状況をチェックする方法 - ドコモ・au・ソフトバンク

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





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キャッシュを削除する方法


< この記事をシェア >






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

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

【5月13日まで】Amazonで最大7.5%還元!「タイムセール祭り」&「ポイントアップチャンスキャンペーン」でお得にお買い物する方法 – 目玉アイテムまとめ

セール

63時間限定のビックセール!今回は5月11日9:00~5月13日23:59まで。ポイントアップチャンスキャンペーンも同時開催!

【5月14日9:59まで】ポイント最大25%還元!『wowma!還元祭』でおトクにお買い物をする方法 – クーポンあり

セール

事前エントリー受付中でセールは5月10日10時からです。ポイントが最大25%還元されるwowmaの中でも熱いセールですよ~


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

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

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





新着記事

【現金9.6万円還元】ソフトバンクのiPhone 8を購入して高額キャッシュバックをGETする方法

携帯電話

MNPでソフトバンクのiPhone 8買うならここがいいかも!高額キャッシュバックがもらえるぞ!

【予約開始】「AQUOS R3」の価格や予約・発売日、スペックまとめ – 各キャリアでおトクに予約・購入する方法

Androidスマホ

2019年夏モデルとして、ドコモ・au・ソフトバンクの3キャリアが「AQUOS R3」を発売すると発表!気になる価格は?

【一括0円+現金1万円還元】ソフトバンクのiPhone 8を一括0円でGETする方法

携帯電話

のりかえならソフトバンクのiPhone 8が一括0円+1万円の現金キャッシュバック!

LINE無料スタンプまとめ – 現在ダウンロードできる無料&隠し&ディズニースタンプをゲットする方法

LINE

LINEスタンプショップ、ストアのイベントで無料でダウンロードできるスタンプ&隠しスタンプをまとめています。会員制のディズニースタンプも登場!


≫ 新着記事をもっと見る



usedoorTOPへ戻る

usedoorをフォロー


  • 注目の使い方

    【5月版】ソフトバンクのキャッシュバッククーポンをWEB上からゲットする方法 – スマホ購入前に要確認!

    Tポイントまたは現金でキャッシュバック!もちろん最新のiPhoneにも使えるソフトバンクのクーポン


    【新規受付中止!!】ドコモ回線のiPhone、Androidスマホを月額280円(税込302円)で維持する方法 – docomo with×シンプルプラン

    もしかしたら廃止になるかも。。永年-1,500円/月で長く使えば使うほどおトクになるdocomo withの料金詳細です


    【重い…】iOS 11の動作を軽くする(体感速度を上げる)方法まとめ – 特に旧iPhoneなどにオススメ

    iPhone 6 Plus×iOS 11がやっぱり重く感じる。。そんな時はこの設定をできるところまでやってみて


    緊急地震速報やJアラートなど『緊急速報』をスマホで受け取る方法&届かない、非対象機種の対処方法

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


    超便利!パスワード入力を省略してWi-Fiに接続できる『Wi-Fi共有機能』の使い方、使えない時の対処方法(iOS⇔iOS、iOS⇔macOS対応)

    iOS 11&macOS High Sierraからの新機能。新端末追加時や友だちを自宅のWi-Fiに接続してあげる時などにマジ便利!


    注目の記事をぜんぶ見る

  • 最新記事

    【現金9.6万円還元】ソフトバンクのiPhone 8を購入して高額キャッシュバックをGETする方法

    MNPでソフトバンクのiPhone 8買うならここがいいかも!高額キャッシュバックがもらえるぞ!


    【予約開始】「AQUOS R3」の価格や予約・発売日、スペックまとめ – 各キャリアでおトクに予約・購入する方法

    2019年夏モデルとして、ドコモ・au・ソフトバンクの3キャリアが「AQUOS R3」を発売すると発表!気になる価格は?


    【一括0円+現金1万円還元】ソフトバンクのiPhone 8を一括0円でGETする方法

    のりかえならソフトバンクのiPhone 8が一括0円+1万円の現金キャッシュバック!


    LINE無料スタンプまとめ – 現在ダウンロードできる無料&隠し&ディズニースタンプをゲットする方法

    LINEスタンプショップ、ストアのイベントで無料でダウンロードできるスタンプ&隠しスタンプをまとめています。会員制のディズニースタンプも登場!


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

  • usedoorをフォロー


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

    【機種変更でも実質10,368円~】ドコモの第6世代iPad(2018年モデル)をおトクに購入する方法 – GO!GO!iPad割終了で4月から値上げ。。

    Apple Pencil対応の第6世代iPadをドコモが再度値下げ!Proなどは対象外なのでお間違いなく!


    【寄付受付中!!】ふるさと納税で『リンガーハットグループ共通商品券(ちゃんぽん&とんかつで利用可)』+Amazonギフト券の返礼品に寄付する方法

    長崎ちゃんぽんリンガーハットや浜勝で使える使い勝手のいい商品券がふるさと納税で復活!還元率30%


    Amazon Music Unlimitedを90日間無料で利用する方法 – 通常の30日から90日に延長!非プライム会員も対象

    Amazonの音楽聞き放題サービス「Music Unlimited」が90日間も無料で体験できちゃう!


    【7月1日まで】楽天Payの還元率を5%にアップする方法 – 第1弾キャンペーンの概要と参加条件、注意点など

    楽天カード支払いを設定すれば楽天ペイのコード支払いで還元率が5%にアップする!


    【2ヶ月無料】DAZN(ダゾーン)をお得に契約する方法

    期間限定で2ヶ月無料!ハピタスで2,000円分還元!PayPalではクーポンを配布中。DAZNを契約するならこの方法がおすすめ!


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

  • あわせて読みたい記事