The Essential Meta Tags For Social Media | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! These days, almost every website encourages visitors to share its pages on social media. We’ve all seen the ubiquitous Facebook and Twitter icons, among others, just begging to be clicked. This comes as no surprise as sharing via social media, the internet incarnation of word-of-mouth, is on
SNSボタンをオリジナル画像で設置する方法
TwitterやFacebookへのボタンは公式サイトでボタンを作れますが、そのボタンはそれぞれオリジナルのボタンで設置することもできます。 ボタンの仕組みが変わると動かなくなるかもしれませんが、以下の方法で設置できます。今回紹介しているのはTwitter・Facebookシェア・mixiチェック・Google+です。 Twitter コードは以下になります。 <a href="http://twitter.com/share?count=horizontal&original_referer=ページのアドレス&text=ツイートさせたいテキスト&url=ページのアドレス&via=Twitterアカウント" onclick="window.open(this.href, 'tweetwindow', 'width=550, height=450,personalbar=0,toolbar=
Facebook、mixi両サービス向けに最適なOGP og:imageサムネイル画像のサイズとは。 | Outrageous Optimism
Facebook、mixiともにOGPに対応していて、「Facebookいいね」や「mixiイイネ」をした時には、サイトに書かれているOGPタグに沿って各種情報を引き抜こうとするわけですが、ひとつ、og:image に書くサムネイル画像の仕様について、「Facebook、mixi両方にイイように出すにはどういう仕様の画像を作ればいいの?」と思い調べてみました。 最低1枚指定しておけばよい〜5枚程度複数枚有る場合は選択できる。ただし最大5枚まで (mixi)複数枚有る場合は選択できる。(FB)JPEG, PNG, GIF（アニメーション GIF 除く）に対応"画像フォーマットは JPEG, PNG, GIF（アニメーション GIF 除く）に対応しています。" (mixi)1KB以上、最大400KBまで"画像の容量が 400 KB を超える画像は無視されます。" (mixi)"画像の容量が 1
ソーシャルボタン設置のソースコードサンプルあれこれ。 | バシャログ。
今日は2011/11/11、やたら「1」の並ぶ日付です。 11時11分にスクリーンショット撮り損ねてちょっとorzなhakoishiです。 いっそその時間に更新までしてしまいたかった！後の祭り。 さて、今回はソーシャルボタン設置のソースサンプルをいくつかご紹介。 今回取り上げるサービスは、「はてなブックマーク」「twitter」「facebook」「addthis」の4つです。 (2011/11/22)その2、アップしました。「google+」「mixiチェック」「mixiイイネ！」「evernote」編です。 引き続き、ソーシャルボタン設置のソースコードサンプルあれこれ。 はてなブックマーク <a href="【URL】" class="hatena-bookmark-button" data-hatena-bookmark-title="【サイト名】" data-hatena-book
Youtubeの動画を背景に
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
Facebookなどで使われている「OGP」の一覧
FacebookなどのSNSで自分のサイトを紹介する際に使うOGPを一覧にしてみました。 特に絶対に指定しなければいけないものではないですが、どのテキストや画像が紹介した先で使われるかわかりませんので、 できれば指定しておきたいものです。 だいたい基本情報の「タイトル」「表示される画像のパス」「概要を説明する文章」を指定する事が多いかなと思います。 基本情報 <meta property="og:title" content="タイトル" /> <meta property="og:type" content="オブジェクトのタイプ" /> <meta property="og:url" content="このページのURL" /> <meta property="og:image" content="表示される画像のパス" /> <meta property="og:descriptio
Open Graph protocol
Introduction The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to allow any web page to have the same functionality as any other object on Facebook. While many different technologies and schemas exist and could be combined together, there isn't a single technology which provides enough information to richly represent any
13 jQuery SelectBox/Drop-down Plugins — SitePoint
There are several ways to define a block of JavaScript functionality. Learn which is the most appropriate one for your particular use case.
フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か - IT戦記
みなさん、こんにちは お元気ですか？僕は元気です。 さて 最近よく、「いいね！」ボタンや「ミクシィチェック」ボタンによって、ウェブページを紹介し合う文化が少しずつ定着してきたなーと思います。 そんな中で、今後重要になってくるんじゃないかと思われる OGP （Open Graph Protocol）と言われる仕様があります。今日はそのことについて書いてみたいと思います。 OGP? おーじーぴー？？とはなんでしょうか。 OGP とは 簡単に言うと「このウェブページは何のことを書いているか」という情報を、プログラムから読める形で HTML に付加する記述方法のことです。 まあ、普通のウェブページは人間が読めばだいたい何のことが書いてあるか分かりますよね。 ですが、プログラムは人間ほど頭が良くないので、そのウェブページ内の文章だけではそのページが何のことについて書かれているページなのか正確に識別す
FBMLではstyle要素内にハイフンをかいちゃいけないっぽい
と、思ったのですがlist-styleなんかは普通に使えるのでダメってこともないみたいです。 Facebookでファンページを作ったさいには、FBMLというアプリケーションを追加してやればオリジナルなコンテンツを設けることが可能です。HTMLとCSSをササっと書けば自分好みのデザインにすることも可能ということで実際に触ってみました。弊社のファンページは以下になります。 Facebook | まぼろし また、「Facebookのファンページを自由にカスタマイズする方法 | Webクリエイターボックス」にあるように、style要素内にスタイルを書いてしまうとIEでダメな感じみたいですし、そもそもhead要素外にstyle要素を書くのはどうなの？ってのもあるのですが、いちいちインラインにするのは面倒なのでstyle要素内にスタイルを書いています。 各要素がどうなっているのかな FBML内にHTM
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Mobile Slide-in menu
http://aext.net/2010/10/20-amazing-fbml-tutorials/