MetaTagsとは
続いてMetaTagsを紹介します。MetaTagsは、SEO対策で必須であるtitleタグやmetaタグをページごとに設置するための仕組みを提供します。具体的には、RailsのレイアウトファイルとビューファイルにMetaTagsが提供するヘルパーメソッドを使用することで、SEO上必要なタグを簡単に設置することができます。
MetaTagsの導入
SitemapGeneratorに引き続き、同一のRailsアプリケーションにMetaTagsを導入します。
インストール
Gemfileにmeta-tagsを追記します。
…（中略）… gem 'meta-tags' …（中略）…
以下のコマンドを実行しmeta-tagsをインストールします。
bin/bundle
▼
…（中略）… Installing meta-tags 2.10.0 Bundle complete! 20 Gemfile dependencies, 83 gems now installed. Bundled gems are installed into `./vendor/bundle`
記事執筆時点では2.10.0がインストールされました。
設定ファイルを生成
以下のコマンドを実行し、meta-tags用のinitializersファイルを作成します。
bin/rails g meta_tags:install
▼
create config/initializers/meta_tags.rb
設定項目を確認
生成された設定ファイルは、デフォルト設定がコメントアウトされた状態です。
# Use this setup block to configure all options available in MetaTags. MetaTags.configure do |config| # How many characters should the title meta tag have at most. Default is 70. # Set to nil or 0 to remove limits. # config.title_limit = 70 …（中略）…
主な設定項目は以下の通りです。
| 設定項目 | 意味 | デフォルト値 |
|---|---|---|
| title_limit | titleタグの最大文字数 | 70 |
| truncate_site_title_first | trueならサイトタイトルを非表示 | false |
| description_limit | meta description（要約タグ）の最大文字数 | 300 |
| keywords_limit | metaキーワードの最大数 | 255 |
| keywords_separator | metaキーワードに設定する単語間の区切り文字 | , |
| keywords_lowercase | metaキーワードに設定する単語を小文字に | true |
| open_meta_tags | falseならmetaタグをセルフクロージング形式（<meta .../>）に | true |
レイアウトファイルの修正
ここからは実際にMetaTagsのヘルパーメソッドを使用して、metaタグを設定します。
まず、ページごとにmetaタグをセットできるようにするために、レイアウトファイルを以下の通り修正します。
<!DOCTYPE html>
<html>
<head>
<%= display_meta_tags site: 'MetaTagsサンプル' %>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
…（中略）…
あらかじめ固定でセットされていたtitleタグはページごとにセットするため、削除してdisplay_meta_tagsヘルパーメソッド呼び出しに置き換える点に注意が必要です。
display_meta_tagsは、MetaTagsが提供するヘルパーメソッドで、引数のハッシュにさまざまな設定を入れることができます。ここではシンプルにサイト名のみを設定しています。
記事一覧のビューファイルを修正
次に、記事一覧ページ（/articles）に対応するビューファイルを修正し、titleタグとmetaタグを以下のように指定します。
<% title '記事一覧' %> <% description 'このページでは記事を一覧することができます。' %> <% keywords %w(Ruby Rails gem) %> <p id="notice"><%= notice %></p> …（中略）…
このように、MetaTagsが提供するtitle／description／keywordsヘルパーメソッドの引数に値をセットするだけで、ビューファイルに対応するページにtitleタグ／metaタグが出力されるようになります。
なお、keywordsの引数は、提示したコードのように配列を指定することもできますが、単に文字列で「keywords 'Ruby, Rails, gem'」のように指定することもできます。
記事一覧ページの確認
rails sコマンドでpumaサーバーを起動し「http://localhost:3000/artices」にアクセスして、デベロッパーツールでtitleタグ／metaタグがちゃんと出力されていることを確認します。
まとめ
ここまで、SEO対策で重宝するgemであるSitemapGeneratorとMetaTagsの基本的な使い方を紹介しました。
次回は、MetaTagsをActiveRecordと関連付けて使う方法を紹介するとともに、パンくずリストを生成するgretelというgemの使い方も紹介する予定です。
