逆引きマニュアル: Netlify CMS + Hugo + GitLabの導入方法

投稿日: Netlify Netlify CMS Hugo

やりたいこと

one-click-hugo-cmsを使った、Netlify CMSの導入方法です。 静的サイトジェネレータはHugo、リポジトリはGitLabを使用しています。

前提条件

以下で確認しています。

概要

Netlify CMSの導入には、Netlify Identityのセットアップが必要です。 公式のドキュメントにはこの方法が載ってませんでした・・・

あと、GitHubを使った例は多いですが、GitLabを使った例がなかなかありませんでした。

手順

以下の流れで行います。

サイトの作成

  1. https://headlesscms.org/projects/netlify-cms/ に移動
  2. 一番下のDeploy to netlifyのボタンを押す。
  3. Connect to GitHub を選択
    • GitLabの場合は connect to GitLab. リンクをクリックする(自分はこちらを選択)。
  4. リポジトリ名を入力(デフォルトは one-click-hugo-cms)して、Save & Deployボタンをクリック。
    • この時点でGitHub or GitLabにリポジトリが作られ、Netlifyでビルドが始まります。もしビルドに失敗したときは何度かリトライしてください1

Netlify Identityの設定

  1. 上部から Identity タブを選択し、Enable Identity ボタンを押す。
    • メインのメールアドレスに [Netlify] You’ve started using Identity on サイト名 というメールが来ます。
  2. Settings and usage ボタンをクリックする。設定画面に移動する。
  3. 以下の設定をする。
    • Registration preferences: Invite Only
    • External providers: GitHub
      • 自分はNetlifyのログインにGitHubを使っているため。
      • 選択画面ではUse default configurationで構わない(下の方はProフィーチャー)
    • Services: Enable Git Gateway ボタンを押す。

ユーザの追加

  1. Identityタブを選択し、Invite users ボタンをクリックし、自分のメールアドレスを入れ、Send ボタンを押す。
  2. 自分のメールアドレスにメールが来るので、メール中の Accept the invite リンクをクリックする。
  3. Continue with GitHubを選択してログイン

補足

設定ファイルは site/static/admin/config.yml のようです。


  1. 自分はネットワークエラーで2度失敗したことがあります。 [return]

外部サイト

マニュアル



ページトップへ戻る