twitterのシェアボタン設置で「上吹き出し」にしたかったのにつまづいた

2012年8月1日 - テクノロジー

スポンサーリンク

Larry si è tagliato i capelli e guarda in alto: vi piace?
Creative Commons License photo credit: paz.ca

 

おはようございますです。

成長する為にすることの第一歩は「真似る」ことだと思ってるナカジです。

 

先日、拝読させてもらってるブロガーの方々をまねして

シェアボタンの設置方法を変更しました。

 

ですが

twitterのシェアボタンを「上吹き出し」

にしたかったのにつまづいたのでその部分を共有したいと思います。

スポンサーリンク

以下のシェアボタン作成ページで作成すると

https://twitter.com/about/resources/buttons#tweet

上記の画像のように「横吹き出し」になります。

 

これを上記のように「上吹き出し」にする方法は

Twitter Developers サイト

に詳しく書いてありますが、英語です...

ではやり方を説明します。

 

やり方は簡単!!

シェアボタン作成ページで生成した「コードの1行目」に

data-count=”vertical”

を付け加えます。

<a href=”https://twitter.com/share” data-lang=”ja” data-count=”vertical”>ツイート</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);</script>

コレだけです。

 

ただ、落とし穴が...

シェアボタン作成ページで作成する時に

ボタン(大)

にチェックを入れると

<a href=”https://twitter.com/share” data-lang=”ja” data-size=”large”>ツイート</a>

とコードがでてくるのですが、なぜか

data-size=”large”」があると

「上吹き出し」にならなかったんです!!

 

【OK版】

<a href=”https://twitter.com/share” data-lang=”ja” data-count=”vertical”>ツイート</a>

 

【NG版】

<a href=”https://twitter.com/share” data-lang=”ja” data-count=”vertical” data-size=”large”>ツイート</a>

 

わたしだけかも知れませんが、共有しておきたいと思います。

スポンサーリンク


サイト運営者

運営者:ナカジ
電子音楽家・クリエイティブコーダー・ブロガー

>>運営者プロフィール&当サイトの詳細

記事を検索


スポンサーリンク