ソーシャルボタンのカスタマイズ

投稿者: | 2014年1月9日

えー、本ブログの編集長やってます佐藤(http://cocky.exblog.jp/)です。
元ライターってことで編集長やることになってしまいました。とりあえずよろしくお願いします。

んでまだブログを開設して間もないということで、運営もいろいろ試行錯誤してます。今日はソーシャルボタンのところをカスタマイズしたので、そのあたりの話をば。
#あまり技術レベル高くない話になりますが…(苦笑)

URLを短縮URL化

本ブログのソーシャルボタンはWP Social Bookmark Lightを使って表示してますが、これそのまま使うと、tweetとかのときのURLがやたら長くなってしまうのが問題。
そこで短縮URL使うことになるわけですが、今回はWordPressが元々持ってる短縮URL機能を使ってみました。

同プラグインのcontent.phpの中に wp_social_bookmarking_light_the_content() って関数があるんですが、この中で

$out = wp_social_bookmarking_light_output( $options['services'], get_permalink(), get_the_title() );

ってなってるところをこう変えました。

$out = wp_social_bookmarking_light_output( $options['services'], wp_get_shortlink(), get_the_title() );

元々はパーマネントリンクを get_permalink() で取得しているのに対し、短縮URLを返す wp_get_shortlink() に変えてます。wp_get_shortlink() のところを任意のカスタム関数に変えれば、外部の短縮URLサービスを使うのもそんなに難しくないかと。

Twitterのボタンの問題を修正

これでソーシャル系のサービスに表示されるURLが短縮URLに変わりますが、このままだとTwitterのボタンの横に表示されるカウントが機能しません。Twitterのカウントって、短縮URLではなくリダイレクトされた先にある本来のURLでカウントする仕様のようで。

いろいろ調べたところ、TwitterのTweet Buttonってドキュメントで、本来のURLを「counturl」として食わせればいいということがわかったので、やはり同プラグインのservices.phpの中にある twitter() 関数をこう変えました。

function twitter()
{
    $options = wp_social_bookmarking_light_options();
    $twitter = $options['twitter'];
    $url = str_replace('http%3A%2F%2F', '', $this->encode_url);
    $full_url = rawurlencode(get_permalink());
    return $this->link_raw('<iframe allowtransparency="true" frameborder="0" scrolling="no"'
                          .' src="http://platform.twitter.com/widgets/tweet_button.html'
                          .'?url=%20'
                          .'&text='.$this->encode_title. '%20-%20'. $url
                          .'&counturl='. $full_url
                          .($twitter['via'] != '' ? '&via='.$twitter['via'] : '')
                          .'&lang='.$twitter['lang']
                          .'&count='.$twitter['count']
                          .'" style="width:130px; height:20px;">'
                          .'</iframe>');
}

今回はcounturlの件以外にも、リンクの「http://」を除去してtweetしたいなどの事情もあったので、そのへんの変更も合わせてやってます。
#ちなみに上記の変更済みの状態なので、encode_urlに入っているのは短縮URLのアドレスです。

これでカウントはされるようになったんですが、カウンタの数字をクリックした際に表示される検索結果が本来の長いURLでの結果になってしまうため、URLでのtweet検索が不自由なのが難点。ただここのカスタマイズは今のところ難しそうなので、今日のところはここまでってことで。

今後もいろいろ試行錯誤して変更を加えていく予定なので、すみませんがお付き合いください。

(1/14追記)

その後の調査で、URL encodeされた状態のcounturlで、「%25xx」のxxの部分(16進数)のアルファベットが大文字だときちんと検索に引っかかるということが判明したので、その部分のみ大文字で表示するようにコードを修正しました。

あとはてなブックマークについては短縮URLの使用をやめて、通常のget_permalink()で取得できるパーマネントリンクに戻してます。