Colorless Sight Wiki / Tips/Twitter

概要 †

Twitter に関する事。未整理。

Tweet Button あれこれ †

W3C Markup Validation 対策 †

現象 †

Twitter の Documentation に載っている通りのコードを追加すると、Markup Validation の結果 Invalid と言われてしまう。

<a href="https://twitter.com/share" class="twitter-share-button" data-lang="en">Tweet</a>
<script>（省略）</script>

対策 †

data- attribute of anchor tag とかいう独自属性なんぞを使わせるな、ということで。

<a href="https://twitter.com/share?lang=en" class="twitter-share-button">Tweet</a>
<script type="text/javascript">（省略）</script>

参考 URI †

• Tweet Button | Twitter Developers
• The W3C Markup Validation Service

Double encoding 対策 †

現象 †

このページの URL のように、Percent-encoding された文字を URL に含むページに Tweet Button を設置して、かつ url パラメータの値を指定しない場合、Button をクリックすると Percent-encoding が 2 回実施された URL をツイートすることになってしまう。

期待動作：

http://www.colorless-sight.jp/wiki/?Tips%2FTwitter

実際の動作：

http://www.colorless-sight.jp/wiki/?Tips%252FTwitter

対策 †

url パラメータの値を適切に指定すれば回避できる。

対策 (1)：

<a href="https://twitter.com/share" class="twitter-share-button" data-url="<?php echo $link['reload'] ?>" data-lang="ja">Tweet</a>

対策 (2)：

<a href="https://twitter.com/share?url=<?php echo urlencode($link['reload']) ?>&amp;lang=ja" class="twitter-share-button">Tweet</a>

参考 URI †

• Tweet Button | Twitter Developers
• Issue 2005 - twitter-api - Double URL encodes in count button search string - Twitter's API Issue Tracker - Google Project Hosting
• そなーブログ » Blog Archive » Pukiwikiにツイッター公式「ツイートボタン」を設置する

最新の20件