はてブとかツイッターとかFacebookのボタンをプラグインを使わずに付ける

Wordpress

はてブとかツイッターとかFacebookのボタンをプラグインを使わずに付ける

Facebook Like Button by FindYourSearch タイトルそのまんま、記事の上と下にこれらボ […]

最終更新日:2012年4月15日

Facebook Like Button
Facebook Like Button by FindYourSearch

タイトルそのまんま、記事の上と下にこれらボタンを付けてみました。

昔はWordpressのプラグインとかに頼ってこのボタンを付けたりしていたのですが、プラグインを使うと「とりあえず付ける」のはちょー簡単なのに、ちょっとだけカスタマイズ仕様とすると途端にちょー大変になってしまう。

てことで、これらは「自力」に変更。Twitterボタンは@isloopに教えてもらってちょー簡単に設置していましたが、実はFacebookもはてなもちょー簡単です。

どれも公式サイトに簡単に設置するページがある

意外と「検索」に頼って、どうやって設定すればいいんだろうなんて調べたりするんですが、どれもちゃんと「公式ツール」が存在しております。

そこ行ってちょろっといじってやれば、驚くほどあっけなくコードが取得出来るので、あとはブログのテンプレートに貼り付けるのみ。

簡単な解説を書かせて頂きますが、もちろん自己責任でお願いいたします。可能性が低いとはいえ、バックアップを忘れたりするとWordpress死ぬとかありますんで。

Twitterボタンの設置

「公式」ボタンのコードは以下から取得出来ます。

Twitter / Tweet Button

3ステップで完了です。

まずは3種類の中からデザインを一つ選ぶ

アカウントを設定しておくと便利です。つぶやいてもらった後、フォローしますか?って表示が出る。これならフォロワー10万人もすぐですね。すごい。

あとは、このコードをコピペすりゃ完了です。

ね?かんたんでしょ?

はてなブックマークカウンターの設置

はてなブックマークカウンターは、これもだいたい簡単なんですけど、ちょっとだけ違うのが、URLとタイトルは「ページごと」に入力しないといけないという事。

まず、以下のページで、デザインを選んでコードの取得。

使いやすくなりました! はてなブックマークボタン

そこからはWordPressの出番。

この部分をWordPressのPHPコードで置き換える。

URLのところは「<?php the_permalink() ?>」タイトルのところは「<?php the_title(); ?>」でおk

ね?かんたんでしょ?

Facebookボタンの設置

Facebookもシンプル。このページに行けばおk。

Like Button – Facebook開発者

THERMAE ROMAEURL to Likeの所は、ブログの個別ページに貼るのであれば空欄でおk。

これをブログに貼るだけ。

ね?かんたんでしょ?

手動のメリット

こういうの実現するプラグインとかいっぱいあるのに、なんでわざわざ手動でメンドクサイ事をして付けるのか。それはとにかく「自由」だから。

基本的に、プラグインを導入すると「プラグインの枠の中」でしかカスタマイズ出来ません。以前こういうボタンを付けたりしたときも「ここに欲しいんじゃね−!」ってなった事しばしば。もちろん、もっと深い知識があれば、プラグインを改造して自分の好きなように出来るわけですが、それだったら「ボタン」程度は直接テンプレに入れてしまった方が早い。

そんな風に考えた次第であります。

セール・特価情報

Wordpressカテゴリーの記事を全部見る