HTML5でOGPの設定をする時にhtmlタグにxmlnsは不要
概要 ▶ HTML5はXHTMLではありません。このためOGPの設定で必要とされるxmlnsは不要なのです。代わりに「prefix」という記述を行います。 Geek_Tatoo by Massimo Valiani HTML5でウェブサイトを作成していて、気になったことがありました。 気になった瞬間はFacebookやGoogle+で使用されるOGP（Open Graph protocol）のためのメタタグを設定していた時のことです。 ネットで検索すると必ずと言っていいほど「xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml" を<html>のタグに追加しましょう」みたいなことが書いてあります。 こんな感じですね。 <html xmlns:og="http://ogp.me/ns#" xmlns:
BloggerをOGPに対応させるときのog:imageをなんとかする : たき備忘録
BloggerをOGP(Open Graph Protocol)に対応させるときに問題になるのが「og:image」です。この「og:image」には、記事内で使われている画像や、記事のサムネイルを指定するのが一般的です。しかし、Bloggerには利用できそうなデータタグが存在しないので、静的画像ファイルへのリンクを指定することしかできません。 そこで、記事のRSSから画像ファイルが使用されているかをチェックし、使用されていれば一番最初に見つかった画像にリダイレクトするWEBアプリケーションを作ってみました。以下のようなURLで取得が可能です。 BloggerSpice http://bloggerspice.appspot.com/postimage/[記事のURL] たとえば、この記事に使用されている画像を取得する場合は以下のように指定します。 http://bloggerspice.
知っておきたいFacebookのOGPをBloggerに対応させる活用法 - Will feel Tips Blogger
前回の記事『自分の指定した任意の場所でJavascriptを実行させる Tipsまとめ』の中で、Javascriptを活用したSNSシェアボタンの設置を紹介しました。簡単でスピーディな情報拡散ツールとしてのSNSの利用を考えるのであれば、Facebookのいいね！ボタンもアクセス数を伸ばす一つの要素になっています。 但し、そのままボタンを設置しただけでは殆ど意味は無く、OGPを設定してあげることで本来の機能を引き出すことが出来るようになります。今回は現状での最善策と考えられる、BloggerをFacebookのOGPに対応させる方法を紹介致します。 OGP (Open Graph Protocol) とは何か 基本的な内容は下記Linkページにて詳しく解説されており、分かりやすく参考になります。 フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protoco
Twitter Cardsを設定して自社サイト情報をツイートに出す2つの手順（OGP済みなら10分でOK） | 初代編集長ブログ―安田英久
今日は、Twitterが本格的に展開を進めている「Twitter Cards（ツイッターカード）」を表示するための、サイトの変更方法を解説します。Facebookでシェアされたときの表示を指定する「OGP」を設定しているサイトなら、10分で完了するような内容です。 2012-09-06： 申請後しばらくしたら、自分のアカウントでカードが表示されるようになり、Web担のサイトのURLでカードが表示されるようになりました。 Twitter Cards（カード）とは？Twitter Cardとは、Twitterが進めているツイート表示のリッチ化の仕組みのこと。ツイート内にURLが含まれている場合に、ツイートの詳細表示でそのページのタイトルや概要、アイコン写真などを表示するものです。 このカード表示は6月にスタートしたのですが、まだすべてのTwitterアカウントで有効になっているわけではなく、カ
ブログのTwitter Cardsが有効になりました - F.Ko-Jiの「一秒後は未来」
Twitter CardsはTwitter独自の仕様で、ツイートにURLが含まれているとそのURLのタイトルや概要、サムネイル、そのサイトのTwitterアカウントなどの情報がTwitterのWebサイトや公式クライアントアプリに表示されます。Facebookなどで利用されるいわゆるOGPみたいなものです。 この機能を有効にするにはまずサイトのほうにTwitter Cards用のmetaタグを記述する必要があります。さらにTwitter Cardsを有効にするために申請が必要です。申請が通ったらメールが送られてきます。 うちのブログはMTなので<head>タグ内に以下のような記述をしました。参考までに。 <!-- Twitter Cardsの種類。ブログ記事ならsummaryで。 --> <meta name="twitter:card" content="summary"> <!-- パ
シェアデバッガー - 開発者向けFacebook
シェアデバッガーでは、コンテンツがFacebookでシェアされたときの表示をプレビューし、Open Graphタグの付いた問題をデバッグできます。
Facebook の Open Graph キャッシュをこっちからクリアしてやる – へんな柳生
FacebookのOpen Graphは、Facebook側にキャッシュが残っているらしく、元のページのほうで設定を変更してもしばらくはその設定が反映されません。 例えばog:imageを変更していいね！させたときなんかはお客さんにつっこまれがちです。 そのキャッシュをクリアする裏技。 Facebookの公式Linterで設定を変更したページをLintする。 これだけ。 0. 似たようなコンテンツで下記の実験を行いました。 ページA → 先に設定（og:image）を変更して公開する ページB → その後で設定を変更して公開する 1. この直後に「いいね！」すると、、、 ページA → ウォールに表示される画像が、変更前のまま ページB → ウォールに表示される画像が、変更前のまま 2. ページBのみLintしてから「いいね！」すると、、、 ページA → ウォールに表示される画像が、変更前の
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
