Drupal 8でのOGP設定

こんにちは!

10月に入り少し肌寒い日もあれば、30度近くの日もあり気温の変化が激しい季節になりましたね。

個人的には10月は好きな月でして、何故かと言うと競馬が東京で開催されるからです。笑

ここから約２ヶ月ほど東京で行われるので、個人的には１年の中で毎年楽しみにしている２ヶ月間となります。

特に天皇賞秋・ジャパンカップというレースが好きなレースなのですが、それがこの時期にあるので今からワクワクしております！

さて、競馬愛を語るのはこのぐらいにして本題に入っていきたいと思います。

OGP設定について

今回はDrupal 8 でのOGP設定についての記事を記載させていただきます。

今回サイトの改修作業にてOGP設定を行う機会がありました。この業界に入ってまだ半年程度な自分は、OGPという言葉を聞いたことがなかったため、OGPはということから調べはじめました。

この業界に携わっている人たちなら当然のことだとは思うのですが、自分にとってはSNSでシェアした際に出てくるリンクや画像はこの設定が行われていたのかとびっくりしました。

今回OGP設定を行うにあたり、Drupal 8ではどのように設定されているのかと調べてみたのですが、記事が古いものが多かったです。ですので、良い機会だと思い今回ブログにて掲載しようと思いました。Drupal 7と特に変わらない為知ってるよって方もいらっしゃるかとは思いますが、自分の復習も兼ねていますのでご了承ください。

使用するモジュール

まず使用するモジュールは2つになります。

• Tokenモジュール
• metatagモジュール

になります。

これらを使い合わせることでOGP設定が行えます。厳密に言うとOGP設定を行うだけであればmetatagモジュールだけで良いのですが、設定とかの幅が広がるのでTokenモジュールも使用しています。

設定方法

2つのモジュールをインストールしたら、拡張機能から

矢印の箇所を有効化します。これでOGPの設定ができるようになります。

次に環境設定から検索とメタタグという箇所にあるメタタグというのをクリックしてページを開きます。

するとメタタグのグローバルな設定や、またコンテンツタイプ毎にメタタグの設定が行えます。

設定したいメタタグの編集ボタンを押すと画像のようなのが表示されるかと思います。

そのOPEN GRAPHをクリックしてもらえれば、OGP設定が行なえます。

例えば以下のようにToken等を使用したり、パスの指定もできます。また画像はwidth,heightなどを調整することも可能です。

---

以上のことが行えましたら、保存してキャッシュクリアなど行います。

そしてFacebook for developersやTwitter CardでテストしたいURLなどを入力して検証してみてください。

設定が行えていましたら、シェアされたときにどのように表示されるかなどが確認できると思います。

---

以上、Drupal 8でのOGP設定でした。

個人的には今回実施してみて、上記でも述べましたが身近に活用していたSNSのシェアはOGP設定でできているという新しい発見ができてすごく面白かったです。

また一つ勉強になりました。

これからももっと色々な知識を吸収していき、提供していけるように頑張りたいと思っています。

ちなみにお気づきでしょうか？

弊社のホームページがリニューアルされて、すごくかっこよくなっています！！！

いつか自分もこのようなものを作ってみたいなと夢見ておりますので、これからも日々邁進していく所存です。