Jekyllの導入方法

本テンプレートを使うにはターミナルからjekyllコマンドを使えるようにする必要があります。 Jekyllの導入については、Jekyll公式のインストールガイドをご覧ください。公式にはMacに対応しているようですが、Windowsで動かす方法もあるようです。

テンプレートのセットアップ

ダウンロード

Semimaroのリポジトリはこちら。

このリポジトリをローカルにクローンします。 _username_は適宜自分のユーザネームに変更してください。

$ git clone https://github.com/simics-ja/semimaro.git _username_.github.io
$ cd _username_.github.io

GitHub Pagesにアップする前にサイト設定を行いましょう。 HTMLテンプレートに埋め込まれる変数などが_config.ymlの中に定義されているので、適宜変更してください。

# Semimaro is a simple, responsive Jekyll theme for researchers.
# This config file is used for site settings.
# These are used to personalize your new site. If you look in the HTML files,
# you will see them accessed via Semimaro, email "at" example.com, and so on.
# You can create any custom variable you would like, and they will be accessible
# in the templates via .

title: Semimaro
copyright: (c) 2018 Hiroshi Yamada
lang: ja-JP

# Please comment out url variables when you upload the files in _site directory to a web server other than GitHub Pages.
# If you upload your site to https://your-domain.com/site-root, it is as follows:
# url: https://your-domain.com
# baseurl: /site-root

# profile variables are used in About page.
profile:
  name: 山田浩史
  name_en: Hiroshi Yamada
  position: PhD student
  picture: assets/images/profile.jpg
  affiliation: Ruby大学 工学研究科 知能情報学専攻 Jekyll研究室
  affiliation_en: Jekyll Lab. Graduate School of Engineering, Ruby University
  email: email "at" example.com
  # social account setting
  # dribbble: username
  facebook: FacebookJapan
  # flickr: username
  github: github
  # instagram: username
  # linkedin: username
  # pinterest: usename
  twitter: &twitter_username TwitterJP
  # googleplus: username

# Post-url format setting
# Usage: https://jekyllrb.com/docs/permalinks/
permalink: /blog/posts/:categories/:year/:month/:day/:hour-:minute-:second:output_ext

# Navbar item setting
# Nested items make dropdown menu.
navitem:
  - 
    - about-ja.md
    - about-en.md
  - blog.md
  - publication.md

# If you enable google analytics, comment out the following line:
# google_analytics_tracking_id: xx-xxxxxxxxx-x

# If you enable Disqus comment system, comment out the following line:
# disqus_shortname: your_shortname

# SEO settings by jekyll-seo-tag
# Usage: https://github.com/jekyll/jekyll-seo-tag/blob/master/docs/usage.md
twitter: 
  username: *twitter_username
  card: summary

defaults:
  - scope:
      path: ""
    values:
      image: assets/images/default-card.jpg # This image is shown in social media posting.

# Build settings
# If you show the excerpts of your posts in top page, please set "show_excerpts: true".
show_excerpts: true
markdown: kramdown

plugins:
  - jekyll-feed
  - jekyll-seo-tag
  - jekyll-sitemap

jekyll serveコマンドでサーバーが起動し、ローカルで動作確認ができます。ブラウザからhttp://localhost:4000にアクセスし、動作確認を行ってください。

動作確認を行ったら、ブラウザからhttps://github.com/newにアクセスし、_username_.github.ioというリポジトリを作成します。次に、以下のコマンドでリモートのURLを変更し、先ほど作ったGitHubリポジトリにpushします。

$ git remote set-url origin  https://_username_@github.com/_username_/_username_.github.io.git
$ git push origin master
Passwrord:

https://_username_.github.io/にアクセスするとサイトが動いています。

参考にさせていただいたURL

https://atarukodaka.github.io/software/jekyll-bootstrap.html