ドキュメントには頻繁に更新が加えられ、その都度公開されています。本ページの翻訳はまだ未完成な部分があることをご了承ください。最新の情報については、英語のドキュメンテーションをご参照ください。本ページの翻訳に問題がある場合はこちらまでご連絡ください。

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のパブリック及びプライベートリポジトリで利用できます。 詳しい情報については「GitHubの製品」を参照してください。

ノート: 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のドキュメンテーションの「トラブルシューティング」を参照してください。

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

サイトが独立プロジェクトなら、サイトのソースコードを保存するために新しいリポジトリを作成できます。 If your site is associated with an existing project, you can add the source code to that project's repository, in a /docs folder on the default branch or on a different branch. たとえば、すでにGitHub上にあるプロジェクトのドキュメンテーションを公開するサイトを作成しているなら、そのサイトのソースコードはプロジェクトと同じリポジトリに保存したいでしょう。

リポジトリを所有しているアカウントがGitHub FreeもしくはOrganization用のGitHub Freeを使用しているなら、そのリポジトリはパブリックでなければなりません。

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

  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上にサイトのためのリポジトリを持っていなければなりません。 既存のリポジトリ内にサイトを作成しようとしているのではないなら、「サイトのためのリポジトリの作成」を参照してください。

Warning: GitHub Pages sites are publicly available on the internet by default, even if the repository for the site is private or internal. プロジェクトサイトがGitHub Enterprise Cloudを使用するOrganizationが所有するプライベートもしくはインターナルリポジトリから公開されるなら、そのサイトのアクセス制御を管理できます。 In an enterprise with managed users, all GitHub Pages sites are privately published. Otherwise, if you have sensitive data in your site's repository, you may want to remove the data before publishing. For more information, see "About repositories" and "Changing the visibility of your GitHub Pages site."

  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. Decide which publishing source you want to use. 詳しい情報については「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. Add your repository on GitHub.com as a remote, replacing USER with the account that owns the repository and REPOSITORY with the name of the repository.

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

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

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

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

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

  22. あるいは、プロジェクトサイトをGitHub Enterprise Cloudを使用するOrganizationが所有しているプライベートもしくはインターナルリポジトリから公開している場合、サイトの可視性を選択してください。 "GitHub Pages"の下で、GitHub Pages visibility(GitHub Pagesの可視性)ドロップダウンメニューを選択し、可視性をクリックしてください。 詳しい情報については「GitHub Pagesサイトの可視性の変更」をクリックしてください。 サイトの可視性を選択するドロップダウンメニュー

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

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

Note: If your site has not published automatically, make sure someone with admin permissions and a verified email address has pushed to the publishing source.

次のステップ

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

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

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

プライバシーポリシー

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

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

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

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

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