Rails3でタグ付けの実装

Rails3でタグ付けをしたくて、探してみたところacts-as-taggable-onって
gemが良さそうだったので使ってみました。実装手順をメモっておきます。

インストール

Gemfile

gem 'acts-as-taggable-on'

タグ関連テーブルを作るマイグレーションを生成します。

$ rails g acts_as_taggable_on:migration

タグ付けするモデル（Memo）

$ rails g scaffold Memo title:string content:text
$ rake db:migrate

app/models/mome.rb

class Memo < ActiveRecord::Base
  acts_as_taggable
  
  (以下、省略)  
end

動作確認

コンソール(rails c)から確認しました。

> @memo = Memo.new(:title => 'hoge', :content => :fuga)
> @memo.tag_list = "tag_1, tag_2" #=> "tag_1, tag_2" 
> @memo.save!

> @memo.tags #=> [#<ActsAsTaggableOn::Tag id: 1, name: "tag_1">, #<ActsAsTaggableOn::Tag id: 2, name: "tag_2">] 
> @memo.tag_list #=> ["tag_1", "tag_2"]

タグクラウド

タグ付けできるようになったら、タグクラウドを表示できるようにしてみます。

app/helpers/memo_helper.rb

module MemosHelper
  include ActsAsTaggableOn::TagsHelper
end

app/views/momos/index.html.erb

<h1>Listing memos</h1>

<%= link_to '全て表示', [:memos] %>
<% tag_cloud(Memo.tag_counts_on(:tags), %w(css1 css2 css3 css4)) do |tag, css_class| %>
  <%= link_to tag.name, { :action => :tag, :name => tag.name }, :class => css_class %>
<% end %>

public/scaffold.css(デザインは必要であれば変更してください)

/* タグクラウド */
.css1 { font-size: 1.0em; }
.css2 { font-size: 1.2em; }
.css3 { font-size: 1.4em; }
.css4 { font-size: 1.6em; }

app/controllers/momos_controller.rb

class MemosController < ApplicationController

  # GET /memos
  # GET /memos.xml
  def index
    @memos = Memo.all
    @tags = Memo.tag_counts_on(:tags)

    respond_to do |format|
      format.html # index.html.erb
      format.xml  { render :xml => @memos }
    end
  end

  def tag
    @memos = Memo.tagged_with(params[:name])
    @tags = Memo.tag_counts_on(:tags)
    
    render 'index'
  end
  
  (以下、省略) 
end

config/routes.rb

Memotter::Application.routes.draw do
  # resources :memos
  resources :memos do # => tagアクションを追加しました。
    collection do
      get 'tag'
    end
  end