Hugo

Google Search Consoleに追加された新たな指標値 Google Search Consoleに新たな指標が追加されました。すべて、ウェブに関する主な指標レポートに記載の通りです。必ずしも早急な対処が必要なものではありません。ただし、これらの指標に対応することで、必然的にUI/UXの向上が期待できます。 LCP (Largest Contentful Paint) FID (Fist Input Delay) CLS (Cumulative Layout Shift) LCP (Largest Contentful...
静的サイトの悩みの種、サイト内検索をNetlify Functions+Hugoで実装してみました。ポイントは、以下の通りです。 クライアントであるブラウザにとって負荷の低い実装方法とする 記事の更新の都度、インデックス等の更新にかかる運用が発生しないようにする(自動的に行う) Hugoの機能、ある程度の月...
HugoのMarkdownで数式組版ライブラリであるKaTeXをサポートするで、Hugoに\(KaTeX\)を組み込みました。\(KaTeX\)は、MathJaxより高速にレンダリングできる、ブラウザで動作する数式組版ライブラリです。 今回は、Netlify CMSのプレビューで、リアルタイムで\(Ka...
Hugoで、\(KaTeX\)というブラウザで数式を表現するためのライブラリをサポートする方法です。Hugo 0.70.0(Extended)で正常に表示されることを確認していますが、今後のバージョンアップ等により、以下の方法がサポートされなくなる可能性がありますので、ご注意ください。特に、Markd...
Netlify上でのデプロイ結果を、Discordへ通知する方法をご紹介します。Slack連携とほぼやり方は同一ですが、GitHub同様に1点のみ注意点があります。 Discordのウェブフックを準備 チャンネルの編集画面から、ウェブフックを追加します。ウェブフック作成時に生成されるURLをコピーしてお...
Hugo | Netlify CMS | Open-Source Content Management Systemに沿って構築した、Netlify CMSのテンプレートを、Page Bundles | Hugoに対応させる方法です。 最終的なディレクトリ構成は以下の通りです。Page Bundlesに無関係な項目は割愛、一部名称の変更を行っています。 . ├── archetypes ├── assets ├── config.yml ├── content │ ├── posts │ │ └── 2020 │...
Hugoは静的サイトジェネレーターですが、テンプレート(Go Template)を使用することで、比較的自由にカスタマイズ可能です。このブログも以前はWordPressを使用していましたが、現在はHugoを使用しています。 WordPressからHugoへ移行する場合、色々考慮点はあると思いますが、頭を...
静的サイトにおけるサイト内全文検索の実装例をご紹介します。個人ブログにおける趣味の範囲内です。また、個人ブログのため、料金を抑える方針で検討します。 WordPressなどのCMSは標準で検索機能を有しています。しかし、静的サイトではビルド時にすべてのページが生成されます。そのため、WordPress...
Go 言語製の静的サイトジェネレータ Hugo で Netlify に構築したホストで、独自ドメインメールによる安価な送受信環境を整備する方法をご紹介します。 ドメインは「お名前.com」等のレジストラですでに取得済み、DNS サービスは「Netlify DNS」を使用することを前提とします。ただし、「Netlify DNS」は記事執筆...
これまでGo言語の静的サイトジェネレータであるHugoを使用してNetlifyにホスティングする方法をご紹介してきました。今回は、FaaS(Function as a Service)であるNetlify Functionsをご紹介します。また、改めてご紹介しますが、HugoとNetlify Functions...
Hugo のオリジナルテーマ作成を勝手に応援する企画、記念すべき第 1 弾はテンプレート構文の基本となる「template」「partial」「block」「define」の違いについてです。以下のバージョンで確認しています。 Hugo Static Site Generator v0.53/extended darwin/amd64 BuildDate: unknown Hugo のテンプレート構文 Hugo にはさまざまなテンプレート構文が用意されています...
Hugo には、記事執筆時点において、WordPress のような便利なプラグインはありません。しかし、Shortcode やテンプレートの構文を工夫することで、WordPress と同等のプラグイン機能を実現できます。 Hugo Static Site Generator v0.52/extended darwin/amd64 BuildDate: unknown たとえば、WordPress にはアイキャッチ画像という概念があります。Hugo...
Netlify CMS(Hugo)で Markdown で記述可能な無料ブログを構築する(構築編)で、Netlify 上に静的サイトを構築する方法をご紹介しました。今回は、Hugo(Go 言語の静的サイトジェネレーター)のスターターキットで構築したテーマをカスタマイズして、GitHub 上のソースコードの修正、Netlify による自動デ...