KUNISAN.JPブログコメント書き込み

1年前に本ブログで「Twitterで共有」ボタンの説明を書きましたが、その後Twitterの仕様が変わり、1ヶ月程前から従来の方法ではリンク(URL)やコメントがTwitterのコメント欄に反映されなくなってしまいました。

従来は以下のようなリンクを設置していました。

<a href="http://twitter.com/home?status=XXXX">Twitterで共有</a>
※XXXXのところにURIエンコード(UTF-8)したリンク(URL)＋文章を入れる形。URIエンコードは、 http://kunisan.jp/uri_encode_decode/ を参照。

今ではこのような形のリンクをクリックしてもTwitterのトップページに行くだけで、コメント欄は空の状態になってしまいます。

そのため解決方法を探していたところ、以下のページ(Twitter公式)でちゃんと紹介されていました。

http://dev.twitter.com/pages/tweet_button

このページには公式のリンクボタンを設置する方法も掲載されていますが、私としてはブログやホームページの見た目を変えたくないので、リンク先のURLを変更する形で対応してみました。具体的にはこんな感じの記述になります。
※Twitter上でKUNISAN.JPのホームページを「このページは楽しい！」と紹介する形。

■ HTML
<a href="http://twitter.com/share?url=http://kunisan.jp/kuni/&text=%E3%81%93%E3%81%AE%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%AF%E6%A5%BD%E3%81%97%E3%81%84%EF%BC%81" target="_blank">Twitterで共有</a>

さらにこれをPHP、Perl、JavaScriptで記述すると、こんな感じになります。

■ PHP(SJIS記述の場合)
$tword = 'このページは楽しい！';
$tword = urlencode(mb_convert_encoding($tword,"UTF-8","SJIS"));
$url = 'http://kunisan.jp/kuni/';
print '<a href="http://twitter.com/share?url='.$url.'&text='.$tword.'" target="_blank">Twitterで共有</a>';

■ Perl(SJIS記述の場合※Jcode.pmが必要)
$tword = 'このページは楽しい！';
&Jcode::convert($tword, "utf8", "sjis");
$tword =~ s/([^0-9A-Za-z_ ])/'%'.unpack('H2',$1)/ge;
$url = 'http://kunisan.jp/kuni/';
print '<a href="http://twitter.com/share?url='.$url.'&text='.$tword.'" target="_blank">Twitterで共有</a>';

■ JavaScript
tword = 'このページは楽しい！';
tword = encodeURIComponent(tword);
turl = 'http://kunisan.jp/kuni/';
document.write('<a href="http://twitter.com/share?url='+turl+'&text='+tword+'" target="_blank">Twitterで共有</a>');

変数のところの記述を変更すれば色々と応用できると思うので、興味がある方は試してみてください。

ちなみに今までと違って、リンクをクリックすると確認用のウインドウが出てきます。ここで「ツイート」ボタンを押すとツイートされる形になります。

Web管理関連記事(リンク一覧): SPF、DKIM、DMARCの設定とネームサーバー(DNS)設定のトラブル / さくらレンタルサーバーのアクセス履歴をPHPで表示 / PHPで画像のアップロード(さくらレンタルサーバーのPHPでImageMagick) / KUNISAN.JPサイトのメンテナンス(2018) / Webサーバー引っ越し(さくらインターネット スタンダード)とHTTPS(常時SSL)化 / ...(記事連続表示)

関連カテゴリー: Web管理関連記事, PHP関連記事

できるポケット Twitterをスマートに使いこなす基本＆活用ワザ100 ［できる100ワザ ツイッター 改訂新版］ をAmazon.co.jpでチェック