LoginSignup
3
4

More than 5 years have passed since last update.

やりたいこと

  • Google サーチコンソールのタグ埋めたい
  • Google アナリティクスのコード入れたい
  • OGタグをいい感じに出したい
  • xmlサイトマップは自動生成したい
  • Feed もあるといいよね

Feed

Jekyll Feed plugin を使う。
入れておけば自動でフィードを生成してくれる。

xmlサイトマップ

Jekyll Sitemap Generator Plugin を使う。
入れておけば自動でxmlサイトマップを生成してくれる。

Googleアナリティクス

いい感じのプラグインがないので、自作。

参照:https://michaelsoolee.com/google-analytics-jekyll/

1 _config.yml に変数書いておく(なくも2のテンプレートに直接書いてもよい)

google_analytics: UA-XXXXXXXX-X

2 _includes/analytics.html を作る

<script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

    ga('create', '{{ site.google_analytics }}', 'auto');
    ga('send', 'pageview');

</script>

3 </head> の前辺りに include する
例は JEKYLL_ENV=production でビルド実行時に _config.ymlgoogle_analytics が設定されてたときだけソースが書き出される

{% if jekyll.environment == 'production' %}
{% if site.google_analytics %}{% include google-analytics.html %}{% endif %}
{% endif %}
</head>

OG タグとか Google サーチコンソール

Jekyll SEO Tag を使う。
いわゆるSEOに必要そうなタグはこれで。

Googleサーチコンソール

_config.ymlgoogle_site_verification にサーチコンソールの確認方法の「HTML タグ」に出てくる content の値を設定しておく。

<meta name="google-site-verification" content="xxx" />

<title>

テンプレートに <title> がすでにあるとプラグインの出すタグと重複してしまう。
テンプレート側を活かす場合は {% seo title=false %} を書いておく

Description

_config.yml の他、各ドキュメントの Front Matter でも設定できる。

OGタグ、Twittercard

og:image含め一通り対応してる。
Descriptionと同じく _config.yml の他、各ドキュメントのFront Matterでも設定できる。

Canonical URL

Front Matter で canonical_urlを設定する。

CMSでなくてもここまでできますよーということで、現場からは以上です。

3
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
4