投稿一覧

はじめに Hugoでブログを書いていて、頻出するようなHTMLを自動で簡単に出力できるようにしたいと思いました。 そこで使用できるのがShortcodeの機能です。 今回はAmazonのアフィリエイトリンクを作成するためのShortcodeを作成します。 Shortcodeの基本 Shortcodeは、事前に定義した小さな処理を呼び出すための仕組みです。 ここでは書き方を整理します。 /layouts/shortcodes/以下にSHORTCODE.htmlをファイルを作成すると SHORTCODEがショートコード名になる Shortcodeを呼び出す場合は {{< ショートコード名 "値" >}} {{< ショートコード名 パラメータ名="値" >}} パラメータを取り出す場合は {{ .Get 0 }}（0はパラメータのインデックス） {{ .Get パラメータ名 }} 間に文字を挟み込める {{< highlight go >}} A bunch of code here {{< /highlight >}} 挟み込んだ文字を取り出す場合は {{ .Inner }} 挟み込んだ文字は書き方によって処理のされ方が異なる {{< >}} -> HTML {{% %}} -> Markdown Built-inショートコードが存在する。 Figure Youtube Tweet Instagram etc. ShortcodeのサンプルをMarkdownで表示したい場合は {{</* shortcode */>}} Amazonのショートコードを作成 サンプルにAmazonのアフィリエイトリンク用のショートコードを作成します。...

はじめに Git submoduleとは外部のGitリポジトリを、自分のリポジトリのサブディレクトリとして登録する仕組みです。 コマンドの使い方 頻出するコマンドをまとめます。 今回はサンプルとして、MainroadというHugoのテーマを使います。 ローカルワークスペースのthemes/mainroadディレクトリ以下に追加していきます。 追加 git submodule add <リポジトリのURL> <ローカルのサブディレクトリ> git submodule add https://github.com/Vimux/Mainroad.git themes/mainroad themes/mainroad以下にmainroadがクローンされます。 更新 git submodule update 削除 git submodule deinit -f <サブモジュール>: submoduleを削除 git rm -f <サブモジュール>: gitの管理から削除 rm -rf .git/modules/<サブモジュール>: .gitからgit情報を削除 git submodule deinit themes/mainroad git rm -f themes/mainroad rm -rf .git/modules/themes/mainroad submoduleを追加したときに起こっていること submoduleを理解するために、どんなことが起こっているのかを整理しておきましょう。 追加されたファイルを確認 $ git status On branch master Changes to be committed: (use "git restore --staged <file>..." to unstage) new file: ....

はじめに いい家計簿アプリが見つからなかったので、GASを使って家計簿アプリを作成してみました。 この記事では全ての手順は解説せず、注意点だけを備忘録的に記載します。 LINEの設定 LINE Developersアカウントを作成 以下からアカウントを作成する。 https://developers.line.biz/ja/ プロバイダー作成 LINE Developersの画面から、プロバイダーを作成する。 プロバイダーとはサービスを提供する組織や個人のこと。 Webhookの利用を有効化 Webhookの利用が初期状態では無効なので有効化する。 GASのウェブアプリがデプロイ済みであれば、URLも設定して検証を行う。 グループ・複数人チャットへの参加を許可する PUSH_MESSAGEのAPIを利用する場合、そのLINEグループのGroupIDが必要となる。 LINEグループへBotを追加するには、Botが承認を有効にする必要があるので、「グループ・複数人チャットへの参加を許可する」を有効にしておく。 GASの設定 ログの設定 LINE Botを作成するに当たり、GASのdoPost関数を利用します。 しかし、doPostはログを確認できません。 正確に言うと、エディタから実行した場合はログが見れますが、外部から実行された場合そのログは確認できません。 外部から実行された場合でもログを確認するためには、Google Cloud Platform (GCP) と紐付ける必要があります。 裏技的に、スプレッドシートをログ代わりにすることも可能です。...

はじめに Hugoでページのデータを取得する方法をまとめました。 取得方法 サイト内の全記事数 {{ len .Site.RegularPages }} サイト内の全ページ数 {{ len .Site.Pages }} ホームページから下層のページ、そして、カテゴリやタグページも含まれる。 現在の階層の記事数 {{ len .RegularPages }} 現在の階層のページ数 {{ len .Pages }} ページにはセクションページも含まれる。 現在の階層以下の全ての記事数 {{ len .RegularPagesRecursive }} ただし、listページでのみ使用できる。 現在の階層のセクション数を取得 {{ len .Sections }} サイト内の全カテゴリ数 {{ len .Site.Taxonomies.categories }} サイト内の全タグ数 {{ len .Site.Taxonomies.tags }} ...

はじめに 私はHugoでテーマを作成していますが、よく探さないと記載されていなかったり、あやふやなまま使っていた書き方がありました。 そこでそれらをまとめてみました。 Hugoのテンプレートのハイフンの有無 以下のように、{{}}内に-を書いていたり、いなかったりするテーマを見かけます。 <div> {{- .Title -}} </div> この出力結果は以下です。 <div>Hello, World!</div> <div> {{ .Title }} </div> このようにハイフンがない場合は以下のようになります。 <div> Hello, World! </div> なので、前後のwhitespaceが消えます。 Whitespace 参考 Introduction to Hugo Templating ...

はじめに 404ステータスとは、ページが見つからない場合に返すステータスのことです。 Hugoでは存在しないページ用のHTMLも独自定義できます。 作成方法 /layouts/404.htmlにページを作成します。 {{ define "main"}} <main id="main"> <div> <h1 id="title"><a href="{{ "/" | relURL }}">Go Home</a></h1> </div> </main> {{ end }} 動作確認 http://localhost:1313/404.html にアクセスして確認します。 ローカルでの確認の注意点として、ローカルは上記のリンクを直接開く必要があります。 GitHubPagesなどのサービスを利用している場合は、存在しないURLにアクセスされた場合は、404.htmlにリダイレクトしてくれます。 参考 Custom 404 Page ...

はじめに ページ毎の変数は、 フロントマター で定義されるか、コンテンツのファイルの場所から生成されるか、コンテンツ本体から生成されます。 この記事では、ページレベル変数のリストの一部をまとめました。 ページ変数 多くの変数は、 フロントマター で定義されている変数です。 その中の一部を説明します。 .Kind: page、home、section、taxonomy、term、RSS、sitemap、robotsTXT、404などページの種類 .LinkTitle: ページのリンクを設定。設定されていれば、titleより優先的に使用される .Next: 次のregular page .Prev: 前のregular page .Site: Site Variables .Type: Content Types タイプが未設定ならcontent/<TYPE>のフォルダ名がタイプになる .Pages変数 regular pageはpostページかcontentページです。 一方、list pageはregular pageか他のlist pageを一覧化します。 （例: homepage、section page、taxonomy term page、taxonomypage） 記事をツリー状にした場合、末端がregular page、幹がlist pageです。 .Site.Pages: サイト内の全ページ。セクションやtaxonomyページも含む .Site.RegularPages: サイト内の全通常ページ 以下の変数は、現在のスコープだけを返します。 .Pages: 現在のページのスコープのregular pageとセクションページ。.Data.Pagesのエイリアスです。(第一階層のみ) .RegularPages: 現在のページのスコープのregular page。入れ子になっているものは除く .RegularPagesRecursive: 現在のページ以下の全てのregular page。入れ子になっているものを含む regular pageから.Pagesや.RegularPagesを使用しても、空が返ります。 セクション変数と関数 .Parent: ページのセクションや、セクションの親セクション .Section: 現在の記事が属するセクション ....