namaraii.com

最近更新したページ

  • Claude関連用語メモ

    2026年1月22日

    • AI
  • 🛖 Home

    2026年1月22日

    • 竹内仁(TAKEUCHI Hitoshi)

      2026年1月21日

      • 架空のK-POPグループのアルバムを生成AIで制作

        2026年1月21日

        • blog
        • AI
        • music
        • cccccc
      • Macでスクリーンショット

        2026年1月21日

        • mac

      さらに525件 →

      Home

      ❯

      notes

      ❯

      Hugoのテーマをsubmodule管理にする

      Hugoのテーマをsubmodule管理にする

      作成日:2022年12月15日更新日:2022年12月15日

      • hugo
      • git

      Submoduleで管理しているHugoのThemeが更新されているので追随させる(git一般の話)-色々な設定の記録たち

      テーマ配下でsubmodule管理

      git submodule add https://github.com/htakeuchi/hugo-PaperMod.git 

      submoduleを更新してpushする場合

      git submodule foreach git pull origin master
      git add .
      git commit -m "update submodule" .
      git push origin master

      タグリンク

      #hugo

      Hugoで楽譜を描画する(abcjs)

      abcjsというABC記譜法で書いたテキストから楽譜を描画するライブラリを使って、Hugoで作成するページで楽譜を表示できるようにする。 music-abcを指定したコードブロックに対して処理するようにレンダーフックを定義する。 layouts/_default/_markup/render-codeblock-music-abc.html{{- $src := .Inner | safeHTML }} {{- $uuid := md5 $src }} <div id="{{- $uuid }}"></div> <script> wind...

      本サイト向けQuartzカスタマイズ内容

      ページの内容が古くなっています このページは旧バージョン(v3)のQuartzを対象とした内容になっています。 v4からアーキテクチャが大きく変わっていますのでご注意ください。 本サイトはObsidianで管理しているノートをQuartzを使って公開しているが、本サイト向けにカスタマイズした内容をまとめておく。 トップページ 最近更新されたノート一覧の表示 gitのcommit日時を更新日時として取り扱って、新しい順に表示する設定にした。 config.tomlenableGitInfo = true HugoでGit情報を扱うための設定 data/config.yamlenableRece...

      Hugoのショートコードをうまく使い回す方法

      Hugoには他のCMSではよくある、機能を拡張するためのプラグインを提供する仕組みがない。 このため、あるテーマの中に便利なショートコードがあったとして、それを別のテーマで使用しようとした場合、 テーマディレクトリ/layouts/shortcodes配下のショートコードのソースを、別のテーマの/layouts/shortcodes配下、またはルート配下の/layouts/shortcodesへコピーする ショートコードにスタイルが設定されている場合、スタイルシートの中から必要な部分を抜き出し、別のテーマのスタイルシートへコピーする という煩雑な手順が必要となるが、先日、以下のショートコードの...

      TwitterのURLをHugoのショートコードに変換するブックマークレット

      ChatGPT(GPT-4) が書いたもの。 javascript:(function() { function twitterUrlToHugoShortcode(url) { const urlParts = url.split("/"); const userName = urlParts[3]; const tweetId = urlParts[5]; return `{{< tweet user="${userName}" id="${tweetId}" >}}`; } const url = window.lo...

      Hugoのテーマを作成する

      Bookmarklet Maker【ブックマークレット変換サービス】 - Kujipedia hugo new theme bento cd theme/bento gohugoio/hugoBasicExample: Example site to use with Hugo & Hugo Themes git clone github.com/gohugoio/hugoBasicExample.git cd hugoBasicExample hugo serve -t ../.

      Hugoメモ

      静的サイトジェネレータHugoに関するメモです。基本的に公式ドキュメントら抜粋しています。

      Hugoにサイト検索を付ける(Javascriptでの実装)

      Hugoで構築したサイトにサイト検索機能を追加する。 大げさなので外部の検索サービスにクローリングさせたり、ElasticSearchを立てたりはせず、自前でインデックスファイルを作成しJavascriptで検索することとし、以下のページを参考にして実装した。 Hugo に全文検索を取り付けた | the right stuff Hugo に全文検索(インクリメンタルサーチ)の機能を付ける - まくまく Hugo ノート 検索ページ用のコンテンツファイルを作成(content/search.md) --- title: サイト検索 layout: search --- レイアウトにsearch...

      Hugoのローカルサーバでページが表示されないパターン

      Hugoで作成したページがhugo serveしても表示されない場合がある。 timeZoneを指定していない 以下の両条件を満たしていると実行する時刻によっては表示されない config.tomlでtimeZoneを明示していない timeZone = “Japan” ページのFront Matterのdateを日付のみ指定し時刻を省略 date: 2022-12-29 このパターンにハマってしまった。hugo serveのオプションを調べていて--buildFutureを付けてみたら表示され気付いた。 draftフラグを設定している ページのFront Matterがtrueになっている ...

      Hugoで本文の先頭画像をアイキャッチとして使用する

      Hugoでアイキャッチ画像を取り扱う場合、ページのfront matterでアイキャッチ画像を指定し、ページレベルパラメタで取得するのが確実だが、アイキャッチ画像が指定されていない場合、記事内の画像をアイキャッチ画像として扱えれば便利なケースが多い。 layouts/partials/summary.html{{- $image := index (findRE "<img.*?src=([^>]*)?>" .Content 1) 0 }} {{- if $image }} <figure class="ellipsis card_img&...

      Hugoでローカルサーバのみ実行する処理を書く方法

      Hugoでhugo serveで起動するローカルサーバでのみ実行する処理を書きたい場合、.Site.IsServerを参照すれば良い。ローカルサーバの場合Trueが設定されている。 Site Variables |Hugo {{- if .Site.IsServer }} {{- $notes = .Site.RegularPages.ByDate.Reverse}} {{- else }} {{- $notes = .Site.RegularPages.ByLastmod.Reverse }} {{- end }}.

      QuartzにScrapbox的な2ホップリンクを追加する

      ページの内容が古くなっています このページは旧バージョン(v3)のQuartzを対象とした内容になっています。 v4からアーキテクチャが大きく変わっていますのでご注意ください。 Quartzでは標準で各ページのバックリンクが表示されるが、Scrapboxのような2ホップリンクを追加したい。QuartzではHugoを使用しているので、カスタマイズはHugoの知見が必要になる。 バックリンクを生成しているQuartzオリジナルのlayouts/partials/backlinks.htmlのコードを参考partialテンプレートを作成した。 layouts/partials/relatedlin...

      Hugoのテーマをsubmodule管理にする

      Submoduleで管理しているHugoのThemeが更新されているので追随させる(git一般の話)-色々な設定の記録たち テーマ配下でsubmodule管理 git submodule add github.com/htakeuchi/hugo-PaperMod.git submoduleを更新してpushする場合 git submodule foreach git pull origin master git add .

      Hugoで目次(TOC)を表示する

      目次はHugo0.60.0から標準でサポートされています。(デフォルトMarkdownライブラリGoldmarkの機能) config.tomlの設定 config.toml[markup] [markup.tableOfContents] endLevel = 5 # どのレベルまで目次に表示するか (h5) startLevel = 2 # どのレベルから目次に表示する(h2) テンプレートの修正 目次を表示したいテンプレートの任意の場所に以下を追加します。 layouts/_default/single.html {{ .TableOfContents }} スタイルシートの設定 以下の...

      HugoでMermaidを使用したい

      独自構文のテキストから各種のダイアグラムを生成できるライブラリMermaidをHugoで使う方法です。 ここで紹介している方法はHugo 0.93.0からサポートされた機能(codeブロックに対するレンダーフックの設定)を使っているため、v0.93.0以上でご利用ください。 レンダーフックの追加 新しくレンダーフック用のファイルを作成し以下の内容を記述します。 layouts/_default/_markup/render-codeblock-mermaid.html パーシャルテンプレートの追加 新しくパーシャルテンプレートのファイルを作成し以下の内容を記述します。 layouts/part...

      Hugoのレンダーフックを使ったMermaidの利用

      Hugoのコードブロックに対するレンダーフックを用いてMermaid.jsを使えるようにする方法です

      Hugoで写真をリサイズしExif情報を表示する

      以下のページを参考にして、Hugoで写真のリサイズとExif情報を表示するためのshortcodeを書いた。 Displaying Exif Tags with Hugo このShortcodeは画像をページリソースとして扱うことを前提にしているので注意が必要(static/imagesなどにおいてある画像には適用できない) Page Resources | Hugo GRのシャッタースピードが小数点表示されてる。ちょっと、まじめにExifを調べないとだめかな….

      HugoのFront Matterを出力するTextwellのアクション

      最近、iPadの利用頻度が上がっていて、Hugoで作成しているサイトもiPadから更新できるようにしたいと、環境を整えています。 すでにGitHubへpushするとNetlifyへデプロイされる環境はできているので、Working CopyというGitクライアントを使えば、それだけでまぁ、なんとかなります。 ただ、記事のFront Matter部分がちょっと面倒なんですよね。雛形を作っておきコピペして修正してもいいんですが、少しだけ楽できるようTextwellのアクションを書きました。 このアクションは、 編集中テキストの先頭にFront Matterの雛形が挿入される dateが動的に設定さ...

      HugoのRSS feedのURIを変更するのにrssuriを使うのはdeprecatedだった

      いままでHugoのRSS feedのURIはconfig.tomlで、 rssuri: feed.xml のように指定していたのですが、netlifyのdeploy logを見ていたら、 WARNING: Site config's rssURI is deprecated and will be removed in a future release.

      Hugoで作ったサイトをNetlifyでホスティングするまでの手順

      Hugoで作成した、このサイトをNetlifyでホスティングするまでのメモ。 Hugoで新規サイトを作成 使用したHugoは0.31.1 # 新規サイト作成〜Beautiful Hugoテーマのclone $ hugo new site devnull $ cd themes $ git clone github.com/halogenica/beautifulhugo.git beautifulhugo $ cp -r beautifulhugo/exampleSite/* .

      #git

      Gitのコミットを巻き戻してリモートへも反映する

      [git] 戻したい時よく使っているコマンドまとめ - Qiita # どのコミットまで戻れば以下確認 $ git log commit b6544950f49b5987c0598d56da695a4b4e74940e Author: TAKEUCHI Hitoshi <hitoshi@namaraii.com> Date: Sat Dec 3 09:44:10 2022 +0900 テーマを戻した # git logで確認したコミットまで強制的に戻す(その間のコミット情報も消す) git reset --hard b6544950f49b5987c0598d56da695a4b...

      削除したファイルをgitのコミット履歴から復活する

      まずは削除したファイルのファイル名から削除した際のコミットIDを探す。 $ git log --diff-filter=D --summary | less 以下のようにコミットIDとファイル名を指定しファイルを復活させる。 $ git checkout コミットID^ -- ファイル名.

      Gitで直前のコミットとの差分を見る

      $ git diff HEAD~ 一世代前のコミットと比較する。~を2つにすると二世代前になる。 $ git diff HEAD~ quartz/components/Head.tsx ファイルを指定することもできる。.

      Gitのデフォルトのリモートを変更する

      Git でデフォルトのリモートを変更する方法 | gotohayato.com 変更方法1 git pushの-uオプション $ git push -u origin v4 v4ブランチのデフォルトリモートがoriginに変更される。 変更方法2 git branchの-uオプション $ git branch -u origin v4.

      Git Sumbodule

      Gitのサブモジュール(submodules)は、外部のGitリポジトリを現在のリポジトリのサブディレクトリに組み込むための仕組み。これにより、外部のプロジェクトやライブラリを現在のプロジェクト内で使うことができる。 サブモジュールは、親プロジェクトから独立している。つまり、親プロジェクトをクローンしたときにサブモジュールは自動的にはクローンされない。これを行うためには git clone --recursive <project> を使用する必要がある。 サブモジュールの更新は、親プロジェクトの更新とは独立して行われる。したがって、サブモジュールの最新の変更を取得するには、サブモ...

      GitHubパーソナルアクセストークン

      GitHubへHTTPSで接続する際のリモートパスワード認証は2021年8月13日に廃止された パーソナルアクセストークンを使えば、引き続きHTTPSでリポジトリへ接続することができる 個人用アクセス トークンの作成 - GitHub Docs settings - Developer settings - Personal access tokens - Fine-grained tokens - `Generate new toke アクセストーンを使った認証 ユーザIDとアクセストークンを入力して認証する。 $ git push Username for 'github.co...

      Git submodule管理しているリポジトリの更新

      サブモジュールで管理しているディレクトリ配下のファイルの更新について サブモジュールで管理しているディレクトリ配下のファイルの更新は、サブモジュール自体の更新と同様に扱う。 つまり、サブモジュール内で行われた変更を親プロジェクトで反映させるには、サブモジュールに移動してから変更を行い、それをコミットしてプッシュする。 その後、親プロジェクトに戻ってサブモジュールの新しいリビジョンを指すように更新し、それをコミットする。 サブモジュールを使用するときは、それが独立したリポジトリであることを常に念頭に置いて、その更新と親プロジェクトの更新を同期させることが重要 第三者のライブラリをサブモジュールで...

      Hugoのテーマをsubmodule管理にする

      Submoduleで管理しているHugoのThemeが更新されているので追随させる(git一般の話)-色々な設定の記録たち テーマ配下でsubmodule管理 git submodule add github.com/htakeuchi/hugo-PaperMod.git submoduleを更新してpushする場合 git submodule foreach git pull origin master git add .

      作成 Quartz v4.5.2 © 2026

      • About
      • Bluesky
      • Mastodon
      • Threads
      • GitHub
      • Instagram