BlogでTwitterへのリンク紹介時、皆さんどうしてますか?
相手のリンクを調べ、<a>タグで囲い表示確認。なんてしてませんでしたか?
それと下の様に書いていたりしませんでしたか?
自分もまさしくその1人でした。
それとこれ以外の方法を知らなかったというのもあります。
<a href="http://twitter.com/saita_ryouhei" target="_blank">@saita_ryouhei</a>さん
しかし先日、@donpyさんのBlogを見ていた所、謎のツールチップを見つけました。
これがそうです。
これは一体何なんだろうとずーっと気になってました。
自分でも調べてみたのですが、見当付かず。
最終的に@donpyさんに聞いてみた所、Twitter Anywhereというプラグイン?ということが判明。
導入方法をググってみたところ情報はそれなりにあるが、少ない方。
と、言う訳でWordPressへの導入手順を紹介しぁす! (´ー`)
はじめに
Twitter Developers
Twitter Developers
ここにアクセスしTwitterアカウントでSign inします。
次の画面へ
新規作成
Create a new applicationをクリック。
情報を入力
- ①
- アプリ名称を入力。何でもかまいません。
- ②
- 説明を入力。
- ③
- 設置するサイトのURLを入力。
- ④
- ここも③と同じのを。
後は規約に同意、文字キャプチャ?の文字を入力しCreate your Twitter applicationのボタンをクリック
keyの発行
アクセス権限
Settingsをクリック。
Read and Writeを選択。
WordPressに設置
オフィシャルのドキュメントは↓
Welcome to @Anywhere | Twitter Developers
Twitter Anuwhereのドキュメント。全部英語です。
WordPressではテーマを編集することで設置します。
自分の場合はヘッダー (header.php)に設置しています。
設置方法は「テーマ編集」▶「ヘッダー (header.php)」を選択します。
自分の場合、headタグの直後に下記コードを設置してます。
<script src="http://platform.twitter.com/anywhere.js?id=[Consumerkey]&v=1" type="text/javascript"></script> <script type="text/javascript"> twttr.anywhere(function(twitter) { twitter.hovercards(); }); </script>
[Consumerkey]に先程コピーしておいたkeyを指定します。
[](括弧)は不要です。
問題が無ければファイルの更新を行います。
完成 (≧∀≦)
全て問題が無ければ完成です。
もし、WordPressのプラグインでWP Super Cacheを導入されている場合、キャッシュの削除が必要になるかと思うのでキャッシュを削除の上、ブラウザーをリロードして下さい。
↑が完成のキャプチャです。
これからは
<a href="http://twitter.com/saita_ryouhei" target="_blank">@saita_ryouhei</a>さん
と、書かずに。
@saita_ryouheiさん
と書くだけて後は勝手にリンク表示してくれます \(^o^)/
参考サイト
参考にさせて貰いました。有り難う御座います。
Twitter@Anywhereの使い方WordPress編 | wpxtreme
Twitterの機能をJSで簡単に導入できる「@Anywhere」の使い方メモ – Rewish
参考にさせて頂きました。ありがとうございます。