タグ

OGPに関するandreryuのブックマーク (3)

  • Twitter カード 7タイプの使い方をカード種別ごとに解説するよ

    Twitter カード 7タイプの仕様を Twitter の公式ドキュメントから翻訳して解説します。公式ドキュメントから抜粋して日語で書き直していますので完全な翻訳ではありません。 Twitter Cards (Twitter カード)、この Blog でもかなり前から指定して使っていますが、7種類のカードから選択できたり、それぞれに指定できる値が異なってたりしてわかりにくいっていう声を聞きましたので (公式な日語ドキュメントも今のところないし)、簡単に各カード種類別の仕様をまとめてみました。 Twitter Cards は、Facebook や Google+ などが採用している、OGP (Open Graph Protocol) を利用して、ウォールやタイムラインにリンクを投稿する際の表示内容を指定するのと同じ。それの Twitter 版です。タイムラインに URL が投稿されたと

    Twitter カード 7タイプの使い方をカード種別ごとに解説するよ
  • 超簡単!OGPにサムネイル画像やカスタムフィールドの画像を自動表示させる方法

    OGPにサムネイル画像やカスタムフィールドの画像を反映する ソーシャル化には欠かせないOGP (Open Graph Protocol)をようやく反映しました。 facebookでいいねボタンを押されるとサムネイル画像とタイトル名、説明文が表示されるというものです。 そこで、OGPをプラグインなしで、記事内の画像を自動表示したいという方法を探しておりました。しかも、希望の画像を表示させたいなあというのが要望です。 以下のような内容です。 トップページは任意の画像を表示 固定ページ、投稿記事にはカスタムフィールドの画像を表示 もしカスタムフィールドの画像がない場合は、サムネイル画像を表示 それ以外は、任意の画像を表示 うまくHEADタグ内で条件分岐されている記事があったので、 それを参考に挿入してみたところ問題なく表示されるようになりました。 よかったら参考にしてください^^ <!-- OG

    超簡単!OGPにサムネイル画像やカスタムフィールドの画像を自動表示させる方法
  • 【WordPress】OGPとTwitterCardsの設置方法!プラグイン不要でコピペでOK

    OGPとは?設置メリットは? 主にFacebookのシェアやいいね!の時に表示される記事情報を、ブログ・ウェブ制作者が設定できる機能の事です。「Open Graph Protocol」の略称です。 Facebook以外でも、Facebookページ、Google+、Twitter(設定が必要。下で説明)、mixiなどにシェアされた時にも使われているようです。 OGPは設定しなくても、タイトルやURLなどは問題なく表示されます。しかし写真や説明文は記事と関係のない内容になる場合もあるため、OGP設定が重要になります。 具体的には、記事ページのヘッダーなど上部で、下のコードのように設定します。有名ブログや大手メディアでも、設定内容に力を入れてる場合が多いです。 [html] [/html] OGP設置のメリット 主に次の3つだと思っています。 シェアされる情報(画像や説明文など)を制作者がコント

    【WordPress】OGPとTwitterCardsの設置方法!プラグイン不要でコピペでOK
  • 1