CocoaSpace

Drupalでウェブサイト構築

TwitterのつぶやきをDrupalに表示

Feb 02 2010
Drupalバージョン: 
Drupal 6.x
カテゴリ: 
他のアプリケーションとの統合
モジュール: 
Twitter
Views

drupal.orgにはTwitterのつぶやきをインポートするのに使えそうなモジュールがいくつかあリますが、CocoaSpaceではTwitterというモジュールを使用しています。マルチユーザのサイトではないので、Twitterモジュールをインストールしなくても、Twitterが提供するウィジェット(?)や、サードパーティのJavaScriptライブラリなどで、より手軽につぶやきを表示させることも可能です。でも、せっかく高機能で設定も簡単なモジュールがあるのですから導入してみました！

Twitterモジュールの設定は本当にシンプルですし、Viewsモジュールをインストールしてあれば、つぶやきの表示がデフォルトで設定されますので、迷うことなく使用できると思います。ですのでここではちょっとヒネリを加えて、CocoaSpaceの設定を例にとり、Viewsを使ってのシングルユーザのサイト用の設定をご提案したいと思います。今回使用したのはTwitter 6.x-2.6です。

Twitterモジュールの設定

Twitterモジュールをインストールしたら、まずTwitter setup(admin/settings/twitter)ページで設定を行います。割とシンプルな設定項目ですが、英語ですのでわかりにくいかもしれませんので、簡単に項目ごとにご紹介したいと思います。

Global account

グローバルアカウントはサイトワイドでのデフォルトのアカウントらしいです。説明にはシングルユーザのブログや多くのユーザが共有のTwitterアカウントに投稿する場合などに便利と書いてありますが、シングルユーザのサイトの場合には、設定してもしなくてもよいでしょう。CocoaSpaceでは空欄にしました。

Twitter import

Twitterのつぶやきを表示という本投稿のメインテーマを達成するためには、Import Twitter statusesにチェックが入ったままにしてください。Delete old statusesをNeverにすることで古いつぶやきを削除せずに、ずっとDrupalサイトに保存しておくことができます。

Twitter posting

ここではDrupalサイトでの投稿をTwitterアカウントに自動的に通知するかどうかを設定します。この機能を使用するにはTwitter actionsモジュールを有効にしなければなりません。ここでの設定は個々のノードの作成画面で変更することが可能です。この投稿はTwitterに通知しなくてもいいなという場合には、チェックを外せばいいようになっています。

"Default format string： New post: !title !tinyurl"については、これも好みの問題ですが、"New post"よりもサイトの名前にしたほうが良いと思うのですがいかがでしょうか？CocoaSpaceではこの機能を利用していないので、これ以上詳しいことはわかりません。

Alternate API URL

Twitterモジュールは、Twitter以外にidenti.caでも同じように利用できるようです。最後のSet source to Drupal when updating Twitter statusというのは、Twitterのつぶやきの下に『Webから』とか書いてあるのが『Drupalから』となるのではないかと思います。これについても、申し訳ありませんが詳しいことはわかりません。

ユーザアカウントでTwitterアカウントを登録

その後、user/ユーザID/edit/twitterで、ご自分のTwitterアカウントのユーザ名とパスワードの情報を入力します。Importにチェックが入ったままになっていることを確認してください。

cronの実行

ユーザアカウントでTwitterアカウントを登録しても、cronが実行されるまでつぶやきはインポートされませんのでご注意ください。すぐにインポートしたい場合は、admin/reports/statusからCronを手動で実行するか、ブラウザからexample.com(DrupalのURL)/cron.phpにアクセスして、cronを実行してください。インポートが成功していれば、user/ユーザID/tweetsでつぶやきを見ることができます。

Viewsの設定

user/ユーザID/tweetsからtweetsにURLを変更

Viewsモジュールをインストールしていれば、Twitterのページやブロックでの表示が自動的に設定されます。Viewsでのページ表示のURLはuser/ユーザID/tweetsになっています。これは好みの問題かもしれませんが、シングルユーザのサイトの場合、example.com/tweetsのほうがいいのかなと思い、CocoaSpaceではそのような設定にしました。CocoaSpaceのページviewの設定を項目ごとに見ていきますと以下のようになります。

  1. Page settings
    • Path: user/%/tweets を tweets に変更
    • Menu: Tab: Twitter から No menu に変更
  2. Arguments
    • User: Uid を取り外す
  3. Basic settings
    • Title: None から (ユーザ名)のつぶやき などに変更

＊Uidには『(ユーザ名)'s tweets』というように、ユーザ毎にページタイトルが入るように設定されています。ですので、これを取り外すとページのタイトルがなくなります。代わりにページのBasic settingのTitleでタイトルを設定します。

Twitterの各つぶやきへのリンクを表示

上記の設定の他、FieldsにTwitter: Status IDを追加し、Rewrite the output of this fieldで下の例のように設定すると、各つぶやきへのリンクを作成できます。

<a href="http://twitter.com/ユーザ名/status/[twitter_id]">リンクText</a>

つぶやきを検索可能にする

Twitterの一般的な利用法ではあまり検索の意味がないかもしれませんが、CocoaSpaceではTwitterのつぶやきを検索できるようにしてみたいと思いました。ところがインポートされたつぶやきはノードではないので、コアのSearchモジュールでは検索することができません。そこで苦肉の策として、ViewsのExposed Filtersで検索ボックスを作成することにしました。他にも検索を可能にする方法はあるでしょうが、Viewsをインストールしている環境では、これが一番手軽な方法ではないでしょうか？CocoaSpaceのページviewでの設定法は以下の通りです。

Twitterのつぶやきを検索するためのViews Exposed Filtersの設定Twitterのつぶやきを検索するためのViews Exposed Filtersの設定

Filters

上図の設定を項目ごとに見ましょう。

  1. Twitter: Message textを追加
  2. Operator: Contains、Contains any word、Contains all words のいずれかを選択
  3. Case sensitive のチェックを外す(大文字と小文字を区別しないように)
  4. ページviewだけに検索ボックスを表示させたい場合は[Override]ボタンをクリック
  5. [Expose]ボタンをクリック
  6. Filter identifier: text をCocoaSpaceでは search に変更(検索結果画面のURLに表示されます)
  7. Label: Twitter: Message text を取り外し、空欄にする
  8. [更新] -> [保存] を忘れずに！

Views Exposed Filtersの調整

ViewsのExposed Filtersの送信ボタンは[Apply]と表示されるので、変更したいところです。CSSも調整する必要がありますが、Firebugなどを利用すると、どこをどのように変更すればよいかわかります。Views Exposed Filtersのフォームは、hook_form_alter()でカスタマイズ可能です。下に例を掲載しておきます。MODULENAMEのところをご自分のモジュール名に置き換えてください。カスタムモジュールの作成方法についてはシンプルなカスタムモジュールの作成をご参照ください。

/**
 * Implementation of hook_form_alter(). 
 */
function MODULENAME_form_alter(&$form, $form_state, $form_id) {
  if($form_id == 'views_exposed_form' && $form_state['view']->name == 'tweets') {
    $form['search'] = array(
      '#type' => 'textfield',
      '#size' => 22,
    );
    $form['submit'] = array(
      '#name' => '', // prevent from showing up in $_GET.
      '#type' => 'submit',
      '#value' => t('Search tweets'), // original value of button text
    );
  }
}

インターフェイスの翻訳の検索画面(admin/build/translate/search)で”Search tweets”を検索し、日本語訳を"つぶやきを検索"とすると、検索ボタンが[つぶやきを検索]になります。

Twitterモジュールについての参考ページ

＊CocoaSpaceの設定の多くは、GotDrupal.comで紹介されている方法を参考にさせてもらっています。

Drupalノート

コメントを追加

Powered by Drupal + Linux