【Rails】meta-tagsを使ってogやtwitterのtitleを動的に変える方法

結論

  def default_meta_tags
    {
      title: 'デフォルトのタイトル',
      description: 'デフォルトの要約',
      og: {
        title: :title,
        description: :description
      },
      twitter: {
        title: :title,
        description: :description
      }      
    }
  end

オプションの :title や :description を使うとページに設定されているそれぞれの内容を引き継いでくれます。

概要

default_meta_tags を使って「デフォルトのタイトルを設定しつつ、ページごとの指定があればそちらを使う」というmetaタグの設定をしていました。しかし og や twitter の方にページごとの設定が反映されなかったので修正しました。

修正前

  def default_meta_tags
    {
      title: 'デフォルトのタイトル',
      description: 'デフォルトの要約',
      og: {
        title: 'デフォルトのタイトル',
        description:  'デフォルトの要約'
      },
      twitter: {
        title: 'デフォルトのタイトル',
        description:  'デフォルトの要約'
      }      
    }
  end

修正方法

og や twitter の方はデフォルトの内容をそのまま書いてしまうと、書いた内容で固定されてしまいます。ページごとの設定を反映させるには、 :title や description を使用して下さい。

詳しくは公式のGitHubをご参照ください↓
https://github.com/kpumuk/meta-tags?tab=readme-ov-file#using-metatags-in-view

修正後

  def default_meta_tags
    {
      title: 'デフォルトのタイトル',
      description: 'デフォルトの要約',
      og: {
        title: :title,
        description: :description
      },
      twitter: {
        title: :title,
        description: :description
      }      
    }
  end

このようにしておけば、viewファイルの方で設定したページごとのtitleやdescriptionが反映されます。

# viewファイル

- title 'このviewファイル固有のタイトル'
- description 'このviewファイル固有の要約'