Skip to content

非公式本サイトは非公式の日本語ドキュメントであり、Cloudflare 公式サイトではありません。最新情報はdevelopers.cloudflare.comをご確認ください。

Zola

最終更新 Markdown で表示Agent セットアップ

Zola ↗ は、必要な機能がすべて入った単一バイナリの、高速な静的サイトジェネレーターです。このガイドでは、新しい Zola アプリケーションを作成し、Cloudflare Pages でデプロイします。新しい Zola サイトの作成には zola CLI を使います。

Zola をインストールする

まず、お使いの OS 向けの手順で zola CLI を インストール ↗ します。

macOS (Homebrew)

パッケージマネージャー Homebrew ↗ を使っている場合は、ターミナルで brew install を実行して Zola をインストールします。

brew install zola

Windows (Chocolatey)

パッケージマネージャー Chocolatey ↗ を使っている場合は、ターミナルで choco install を実行して Zola をインストールします。

choco install zola

Windows (Scoop)

パッケージマネージャー Scoop ↗ を使っている場合は、ターミナルで scoop install を実行して Zola をインストールします。

scoop install zola

Linux (pkg)

お使いの Linux ディストリビューションのパッケージマネージャーに Zola が入っている場合があります。その場合は、ディストリビューションのパッケージマネージャーで直接インストールできます。たとえば pkg では、ターミナルで次のコマンドを実行します。

pkg install zola

パッケージマネージャーに Zola が含まれていない場合や、リリースを直接ダウンロードしたい場合は、次の 手動インストール を参照してください。

手動インストール

Zola の GitHub リポジトリには、各種 OS 向けの Zola コマンドラインツールのビルド済みバージョンがあります。Releases ページ ↗ で確認できます。

これらのリリースのインストール手順は、Zola のインストールガイド ↗ を参照してください。

新しいプロジェクトを作成する

Zola をインストールしたら、デフォルトテンプレートで zola init をターミナルで実行し、新しいプロジェクトを作成します。

zola init my-zola-project

zola init を実行すると、次の質問が表示されます。

  1. What is the URL of your site? (https://example.com ↗): 今は空のままで構いません。

  2. Do you want to enable Sass compilation? [Y/n]: Y

  3. Do you want to enable syntax highlighting? [y/N]: y

  4. Do you want to build a search index of the content? [y/N]: y

続ける前に

すべてのフレームワークガイドは、Git ↗ の基本的な理解があることを前提としています。Git を初めて使う場合は、この Git ハンドブックの要約 ↗ で、ローカルマシンへの Git のセットアップ方法を確認してください。

SSH でクローンする場合は、GitHub に対して push または pull する各コンピューターで SSH キーを生成 ↗ する必要があります。

詳細は GitHub のドキュメント ↗ と Git のドキュメント ↗ を参照してください。

GitHub リポジトリを作成する

repo.new ↗ にアクセスして、新しい GitHub リポジトリを作成します。作成後、新しく作ったプロジェクトディレクトリに移動します。次のコマンドをターミナルで実行して、ローカルアプリケーションを GitHub へプッシュします。

git remote add origin https://github.com/<your-gh-username>/<repository-name>
git branch -M main
git push -u origin main

Cloudflare Pages でデプロイする

設定項目値
本番ブランチmain
ビルドコマンドzola build
ビルドディレクトリpublic

Zola は Cloudflare Pages のビルド環境にあらかじめ入っているため、追加の設定は不要です。特定のバージョンに固定する場合は、Environment Variables (advanced) で環境変数 ZOLA_VERSION を任意で設定できます。

例: ZOLA_VERSION: 0.19.2

サイトの設定が終わったら、最初のデプロイを開始できます。Cloudflare Pages が Zola でサイトをビルドしてからデプロイする様子が表示されます。

サイトをデプロイすると、プロジェクト専用の *.pages.dev サブドメインが割り当てられます。

このサブドメインを、config.toml の base_url に設定できます。

例:

# The URL the site will be built for
base_url = "https://my-zola-project.pages.dev"

Zola サイトに新しいコードをコミットするたびに、Cloudflare Pages はプロジェクトを自動で再ビルドしてデプロイします。新しいプルリクエストでは プレビューデプロイ も利用できるので、本番に出す前に変更後の見た目を確認できます。

プレビューデプロイの扱い

Cloudflare Pages では、main ブランチへマージする前にプレビューデプロイで変更を確認することがあります。ただし、プレビューデプロイは https://your-branch-name.my-zola-project.pages.dev のような別 URL を使うため、base_url がハードコードされているとアセットの読み込みで問題が起きることがあります。

これを避けるには、Cloudflare Pages の設定でビルドコマンドを変更し、環境に応じてベース URL を動的に設定します。

if [ "$CF_PAGES_BRANCH" = "main" ]; then zola build; else zola build --base-url $CF_PAGES_URL; fi

このコマンドの動作は次のとおりです。

  • main ブランチからのビルドでは、config.toml の base_url を使います
  • その他のブランチでは、プレビューデプロイの URL（Cloudflare Pages が $CF_PAGES_URL として自動で渡します）を使います

さらに学ぶ

このガイドを完了すると、Zola サイトを Cloudflare Pages にデプロイできています。ほかのフレームワークを始めるには、Framework ガイドの一覧 を参照してください。

役に立ちましたか？