Twitterでつぶやいて☆コメント機能を強化しました♪

お知らせ

Twitterの認証機構を組み込んだので、Twitterのアカウントを持っている方は簡単にコメントでき、アバター画像も表示されるようになりました。

コンテンツの目次

※現在はTwitterとFacebookの両方に対応し、連携もスマートになっています。

今朝から体調が悪くて、お布団にくるまってiPhoneをいじっては寝、いじっては寝を繰り返してました。MHFにも朝方にインしたまま放置しっぱなしになってしまいました(;・∀・)

やっと元気になってきましたので、昨日やり残したコメントシステムの機能強化、Twitterアカウントでのログイン機能の実装を行いました。

Twitterで接続するには

記事ページの下部にあるコメント入力フォームに、「Twitterで接続する」というボタンを追加しました。

もしTwitterのアカウントを持ってなくて、今後も取得するつもりがないなら、このボタンは無視して通常通り「お名前」や「メールアドレス」欄に記入してコメントを送信してください。

※Gravatarにも対応していますので、そちらに登録してあれば、メールアドレスに対応したアバター画像が表示されます。

「Twitterで接続する」ボタン

Twitterの認証を使ってこれらの入力欄をパスし、かつTwitterのアバター画像も表示したいなら、「Twitterで接続する」ボタンをクリックしてください。

Twitterにログインしている場合

既にブラウザでTwitterにログインしている状態であれば、以下のような接続承認ページが表示されます。

Twitterでの接続承認画面

ブラウザのアドレス欄を見ればわかるように、このページは当サイトではなくTwitterにより提供されています。

ここで「許可する」を選択すると、当サイトのコメントシステムがあなたのTwitterアカウントに連携アプリとして登録され、Tiwtterのアカウントを使って当サイトに自動ログインしたような感じになります。

※実際にはユーザーが直接 当サイトにログインしたのではなく、「Twitterが代わりにログインした」状態になります。

Twitterにログインしていない、またはアカウントがない場合

Twitterのアカウントを持っていない場合、またはTwitterのアカウントを持っていてもブラウザでTwitterにログインしていない場合には、以下のようなページが表示されます。

Twitterのログイン要求画面

既にアカウントを持っているなら、入力して「ログイン」ボタンをクリックしてください。これで前述の「許可する」ボタンをクリックしたのと同じことになります。

もしTwitterのアカウントを持っていないなら(あらかじめアカウントを取得しておくことをおすすめしますが)、「ついったーに参加しましょう」のリンクから新規アカウントを取得することができます。

Twitterでの接続が完了したら

上記いずれかの方法で、もしかしたら数秒かかるかもしれませんが、以下のようにコメント入力フォームが変化します。

Twitterに接続成功!

これで、お名前やメールアドレスの入力、及びGravatarのようなアバター画像の設定を、Twitterが肩代わりしてくれました。

あとはコメント本文を記入してコメントを送信してください♪(*´∀`)ノラクチン!

ちなみに「コメントしたことをTwitterでつぶやく」にチェックを入れておくと、「MHFみお☆ちゃんねるのエントリーにコメントしました」というメッセージを記事ページへのリンク付きで自動ツイートします。

Twitterでのつぶやき取得にも対応しました

上記のように当サイトのコメントシステムを使わず、Twitter上で当サイトの記事へのリンク付きでツイートをした場合も、(たまに漏れがありますが)自動的に拾ってきてコメント一覧に表示します。

※この仕組みにはBackTypeというサイトの提供するWordPress用プラグインを利用してます。

そして、右側のサイドバーにある「最近のコメント」へも、同じようにTwitterのアバター画像が表示され、またTwitter上でのリンク付きツイートも拾ってきて表示します。コレ結構大変でした…。

皆さんからのコメントやツイートを励みに、がんばって更新しますので、お越しの際はぜひ一言くださいね(*´∀`)♪