arianpg / gitalk

gitalk repository
MIT License
0 stars 0 forks source link

Hugo + Netlify CMSでサイト構築 備忘録 - arianpg note #5

Open arianpg opened 1 year ago

arianpg commented 1 year ago

https://www.arianpg.com/post/2019-12-14/

JAMstackの記事とかみて、この辺気になったから試してみた。 参考リンク HugoとNetlify CMSでブログを構築する Hugo + gitlab + netlifyのブログにNetlify CMSを設定する方法 お名前ドットコムで取得したドメインをNetlifyで使う HugoTheme m10c NetlifyCMSのサイトからぽちぽち進めていくと、Githubのリポジトリと、Netlifyのサイト設定(ホスティングからデプロイまで)が自動で進んだ。 デフォルトだとコーヒー紹介サイトになってるので、ここをひな形に色々いじっていく。 まず、生成されたリポジトリはpublicなので、privateに変えておく。 githubのrepository -> settings -> Make this repository private 念の為、変更後はnetlify側のgit連携を再設定。 netlify site -> settings -> Itentity -> Git Gateway -> Edit settings\ 次はテーマの切り替え。 Hugoの仕組みがわかっていなかったせいで、テーマの設定に手間取った。 結局ローカルにcloneして、ローカルで色々試すことにした。 git clone https://github.com/arianpg/*****.git cd *****/site hugo server これでローカルサーバが立つので、localhost:1313を見つつ直接ファイル修正しながら、何がどう影響してるのかを探り探りチェック。 ポイントは、site/layouts を削除しないとconfig.tomlでテーマを指定してもうまく適用されない点。 あとNetlifyCMSとの連携のため、ヘッダにscriptタグの追加が必要とのこと。 今回のテーマだと、layouts/_default/baseof.html が修正対象。 これに対して入れた変更は下記の通り。 NetlifyCMS Scriptタグ追加 twitterウィジェットの配置 Portrait表示のデザイン修正 ついでに、NetlifyCMSの設定ファイル site/static/admin/config.