Jekyll を使用して GitHub Pages サイトを作成する

新規または既存のリポジトリ内に、GitHub Pages Jekyll を使用してサイトを作成できます。

People with admin permissions for a repository can create a GitHub Pages site with Jekyll.

GitHub Pagesは、GitHub Free及びOrganizationのGitHub Freeのパブリックリポジトリ、GitHub Pro、GitHub Team、GitHub Enterprise Cloud、GitHub Enterprise Serverのパブリック及びプライベートリポジトリで利用できます。

ノート: Organizationのオーナーは、Organizationが所有しているリポジトリからのGitHub Pagesサイトの公開を制限できます。 詳しい情報については「GitHub Pagesサイトの公開の管理」を参照してください。

必要な環境

Jekyll を使用して GitHub Pages サイトを作成する前に、Jekyll と Git をインストールする必要があります。 詳しい情報については、Jekyll ドキュメンテーションの Installation および「Git のセットアップ」を参照してください。

Jekyll をインストールし動作させるのには Bundler を使うようおすすめします。 Bundler は、Ruby gem の依存関係を管理し、Jekyll ビルドのエラーを減少させ、環境に関係するバグを防止します。 以下はBundlerのインストール手順です。

  1. Rubyをインストールしてください。 詳しい情報については、Rubyのドキュメンテーションの「Rubyのインストール」を参照してください。
  2. Bundlerをインストールしてください。 詳しい情報については「Bundler」を参照してください。

参考: Bundler を使って Jekyll をインストールしようとしている時に Ruby のエラーがある場合、Ruby のインストールをマネージするために、RVM または Homebrew などのパッケージマネージャーが必要になる可能性があります。 詳しい情報については、Jekyllのドキュメンテーションの「トラブルシューティング」を参照してください。

サイト用にリポジトリを作成する

サイトが独立プロジェクトなら、サイトのソースコードを保存するために新しいリポジトリを作成できます。 サイトが既存のプロジェクトと関連しているなら、ソースコードをそのサイトのプロジェクトのリポジトリのデフォルトブランチの/docs、もしくは他のブランチに追加できます。たとえば、すでにGitHub Enterprise Server上にあるプロジェクトのためのドキュメンテーションを公開するサイトを作成しているなら、そのサイトのソースコードをプロジェクトと同じリポジトリに保存したいでしょう。

既存のリポジトリにサイトを作成したいのなら、サイトの作成セクションまでスキップしてください。

  1. ページの右上角で ドロップダウンメニューを使い、New repository(新規リポジトリ)を選択してください。 新しいリポジトリを作成する選択肢を持つドロップダウン
  2. Owner(オーナー)ドロップダウンメニューを使い、リポジトリを所有したいアカウントを選択してください。 [Owner] ドロップダウンメニュー
  3. リポジトリの名前と、任意で説明を入力してください。 ユーザもしくはOrganizationのサイトを作成しているなら、リポジトリは<user>.github.ioもしくは<organization>.github.ioという名前でなければなりません。 If your user or organization name contains uppercase letters, you must lowercase the letters. 詳しい情報については「GitHub Pagesについて」を参照してください。 リポジトリ作成フィールド
  4. リポジトリの可視性を選択してください。 For more information, see "About repositories." リポジトリの可視性を選択するラジオボタン

サイトを作成する

サイトを作成する前には、GitHub Enterprise Server上にサイトのためのリポジトリを持っていなければなりません。 既存のリポジトリ内にサイトを作成しようとしているのではないなら、「サイトのためのリポジトリの作成」を参照してください。

警告: サイト管理者がPublic Pagesを有効化したなら、GitHub Pagesサイトは、サイトのリポジトリがプライベートもしくはインターナルであっても、インターネット上で公開利用できます。もしセンシティブなデータがサイトのリポジトリにあるなら、公開前にそのデータを削除しておくとよいでしょう。 For more information, see "Configuring GitHub Pages for your enterprise" and "About repositories."

  1. ターミナルターミナルGit Bashを開いてください。

  2. リポジトリのローカルコピーがまだない場合、サイトのソースファイルを保存したい場所に移動します。PARENT-FOLDER は、リポジトリを保存したいフォルダの名前に置き換えてください。

    $ cd PARENT-FOLDER
  3. ローカルの Git リポジトリをまだ初期化していない場合は、初期化します。 REPOSITORY-NAME は、リポジトリの名前に置き換えてください。

    $ git init REPOSITORY-NAME
    > Initialized empty Git repository in /Users/octocat/my-site/.git/
    # Creates a new folder on your computer, initialized as a Git repository
  4. ディレクトリをリポジトリに変更します。

    $ cd REPOSITORY-NAME
    # Changes the working directory
  5. どの公開ソースを使いたいか、判断してください。 詳しい情報については「GitHub Pagesについて」を参照してください。

  6. サイトの公開ソースにアクセスしてください。 公開元に関する詳しい情報については、「GitHub Pages について」を参照してください。 たとえば、デフォルトブランチの docs フォルダからサイトを公開することを選択した場合は、ディレクトリを作成して docs フォルダに変更します。

    $ mkdir docs
    # Creates a new folder called docs
    $ cd docs

    サイトを gh-pages ブランチから公開する場合には、gh-pages ブランチを作成してチェックアウトします。

    $ git checkout --orphan gh-pages
    # Creates a new branch, with no history or contents, called gh-pages and switches to the gh-pages branch
  7. 新しい Jekyll サイトを作成するには、jekyll new コマンドを使用します。

    $ jekyll new --skip-bundle .
    # Creates a Jekyll site in the current directory
  8. Jekyll が作成した Gemfile を開きます。

  9. gem "jekyll" で始まる行の先頭に「#」を追加して行をコメントアウトします。

  10. # gem "github-pages" で始まる行を編集して github-pages を追加します。 行を次のように変更します。

    gem "github-pages", "~> GITHUB-PAGES-VERSION", group: :jekyll_plugins

    GITHUB-PAGES-VERSION をサポートされている最新バージョンの github-pages gem に置き換えます。 このバージョンについては、「依存関係バージョン」を参照してください。

    正しいバージョンの Jekyll は、github-pages gem の依存関係としてインストールされます。

  11. Gemfile を保存して閉じます。

  12. From the command line, run bundle install.

  13. あるいは、_config.ymlファイルに必要な編集を加えてください。 これは、リポジトリがサブディレクトリでホストされている場合に相対パスに対して必要です。 詳しい情報については「サブフォルダを分割して新しいリポジトリにする」を参照してください。

    domain: my-site.github.io       # HTTPSを強制したいなら、ドメインの先頭でhttpを指定しない。例: example.com
    url: https://my-site.github.io  # サイトのベースのホスト名とプロトコル。例: http://example.com
    baseurl: /REPOSITORY-NAME/      # サイトがサブフォルダで提供されるならフォルダ名を置く
    
  14. 必要に応じて、サイトをローカルでテストします。 詳しい情報については、「Jekyll を使用して GitHub Pages サイトをローカルでテストする」を参照してください。

  15. 作業内容を追加してコミットしてください。

    git add .
    git commit -m 'Initial GitHub pages site with Jekyll'
  16. GitHub Enterprise Server リポジトリをリモートとして追加します。HOSTNAME は Enterprise のホスト名に、USER はリポジトリ所有者のアカウントに、そして REPOSITORY はリポジトリの名前に置き換えてください。

    $ git remote add origin https://HOSTNAME/USER/REPOSITORY.git
    
  17. リポジトリを GitHub Enterprise Server にプッシュします。 BRANCH は、作業を行なっているブランチの名前に置き換えてください。

    $ git push -u origin BRANCH
  18. 公開ソースを設定してください。 詳しい情報については「GitHub Pages サイトの公開元を設定する」を参照してください。

  19. GitHub Enterprise Serverで、サイトのリポジトリにアクセスしてください。

  20. リポジトリ名の下で Settings(設定)をクリックしてください。 リポジトリの設定ボタン

  21. 左のサイドバーでPages(ページ)をクリックしてください。 左のサイドバーのPageタブ

  22. 公開されたサイトを見るには、"GitHub Pages"の下で、サイトのURLをクリックしてください。 公開されたサイトのURL

    メモ: サイトに対する変更は、その変更をGitHub Enterprise Serverにプッシュしてから公開されるまでに、最大20分かかることがあります。 1時間経っても変更がブラウザーに反映されなければ、「GitHub PagesサイトのJekyllビルドエラーについて」を参照してください。

ノート: サイトが自動的に公開されない場合は、管理権限と認証済みメールアドレスを持つ人が公開ソースにプッシュしていることを確認してください。

次のステップ

サイトに新しいページを追加したり、投稿したりするには、「Jekyll を使用して GitHub Pages サイトにコンテンツを追加する」を参照してください。

JekyllのテーマをGitHub Pagesサイトに追加して、サイトのルックアンドフィールをカスタマイズできます。詳しい情報については、「Jekyll を使用して GitHub Pages サイトにテーマを追加する」を参照してください。

このドキュメントは役立ちましたか?

プライバシーポリシー

これらのドキュメントを素晴らしいものにするのを手伝ってください!

GitHubのすべてのドキュメントはオープンソースです。間違っていたり、はっきりしないところがありましたか?Pull Requestをお送りください。

コントリビューションを行う

OR, コントリビューションの方法を学んでください。

問題がまだ解決していませんか?