2010年11月12日

Rails 3でタグクラウドを実装してみる

タグクラウドを実装したいと思いRails 3 で利用できるプラグインを探していたところacts-as-taggable-onというのを見つけたので実装してみました。
そのメモを残しておきます。


最初にacts-as-taggable-onを使えるようにインストールとマイグレーションを実行します。
 インストール:
 Gemfileに以下のように追加
   gem 'acts-as-taggable-on'
 インストールを実行
   bundle install
 マイグレーション:
   rails generate acts_as_taggable_on:migration
   rake db:migrate


今回はEntriesを作って、それにタグを付けられるようにします。
とりあえずscaffoldでジェネレートしておきます。
  rails g scaffold entry name:string
  rake db:migrate

Entryのヘルパーにinclude ActsAsTaggableOn::TagsHelper を追加します。
  module EntriesHelper
    include ActsAsTaggableOn::TagsHelper
  end

Entryモデルにacts_as_taggable_on :tagsを追加します。
  class Entry < ActiveRecord::Base
    acts_as_taggable_on :tags
  end
  ※:tagsの部分は他の文字列でも良いようです。また複数指定できるようです。

フォームを編集しタグを入力できるようにします。
  entries\_form.html.erbに以下のように追加します。
    <div class="field">
      <%= f.label :tag_list, 'タグ' %><br />
      <%= f.text_field :tag_list %>
    </div>

コントローラーのindexメソッドを編集します。
  entries_controller.rbのindexメソッドを以下のように書き換えます。
    def index
     if params[:tag]
       @entries = Entry.tagged_with(params[:tag])
     else
       @entries = Entry.all
     end
  end
 おそらくもっと素敵な書き方があると思うのですが、動いたので今のところはこれで良しとします。
 なお、:tagとしているのは、Entryモデルにacts_as_taggable_on の後に:tagsとして追加しているためです。

ビューを編集してタグクラウドを表示するようにします。
entries\index.html.erbに以下のように追加します。
  <h3>タグクラウド:</h3>
  <% @tags = Entry.tag_counts %>
    <% tag_cloud(@tags, %w(css1 css2 css3 css4)) do |tag, css_class| %>
    <%= link_to tag.name, {:action=>'index', :tag=>tag.name}, :class => css_class%>
  <% end %>

最後にCSSにタグクラウドで文字サイズが変更されるように定義します。
  .css1 { font-size: 1.0em; }
  .css2 { font-size: 1.2em; }
  .css3 { font-size: 1.4em; }
  .css4 { font-size: 1.6em; }

以上で殺風景ですけど、基本的なタグクラウドが実装できました。
タグ:Rails
posted by まーつん at 22:25| Comment(0) | TrackBack(0) | Ruby on Rails | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
この記事へのトラックバックURL
http://blog.seesaa.jp/tb/169189619

この記事へのトラックバック
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。