Repository files navigation

Language: English |简体中文

A minimal, portfolio, sidebar, bootstrap Jekyll theme with responsive web design and focuses on text exhibition. It will help you easily record, manage and share your knowledge and experience.

You will get the following features:

• Auto Dark Mode
• Posts' Last Modified Date
• Table of Contents
• Automatically Recommend Related Posts
• Syntax highlighting
• Two Level Categories
• Search
• Atom Feeds
• Disqus Comments
• Google Analytics
• GA Pageviews (Advanced)
• SEO Tag
• Performance Optimization

Live Demo »

• Installing
• Usage
• Contributing
• Credits
• Support
• License

Follow theJekyll Docs to complete the installtion of basic environment (Ruby,RubyGems andBundler). In order to use the script tools to save time, we also need to installPython(version 3.5 or abover) andruamel.yaml.

In addition, if your machine is running Debian or macOS, make sure theGNU coreutils is installed. Otherwise, get it by:

• Debian

$sudo apt-get install coreutils

• macOS

$brew install coreutils

ForkChirpy from GitHub, then clone your forked repo to local:

$git clone git@github.com:USER/jekyll-theme-chirpy.git

replace theUSER above to your GitHub username.

The first time you run or build the project on your machine, perform the installation of Jekyll plugins. Go to the root of repo and run:

$ bundle install

bundle will automatically install all the dependent Jekyll Plugins that listed in theGemfile.

The main files and related brief introductions are listed below.

jekyll-theme-chirpy/├── _data├── _includes      ├── _layouts├── _posts# posts stay here├── _scripts├── .travis.yml# remove it├── .github# remove this, too├── assets      ├── tabs│   └── about.md# the ABOUT page├── .gitignore├── 404.html├── Gemfile├── LICENSE├── README.md├── _config.yml# configuration file├── tools# script tools├── docs├── feed.xml├── index.html├── robots.txt└── sitemap.xml

As mentioned above, some files or directories should be removed from your repo:

• .travis.yml
• .github

Basically, go to_config.yml and customize the variables as needed, some of them are typical options:

• url

  Set to your website domain and there should be no slash symbol at the tail.

• avatar

  It defines the image file location of avatar. The sample image is/assets/img/sample/avatar.jpg, and should be replaced by your own one(a square image). Notice that a huge image file will increase the load time of your site, so keep your avatar image size as samll as possible(may behttps://tinypng.com/ will help).

• timezone

  To ensure that the posts' release date matches the city you live in, please modify the fieldtimezone correctly. A list of all available values can be found onTimezoneConverter orWikipedia.

• theme_mode

  There are three options for the theme color scheme:

  • dual - The default color scheme will follow the system settings, but if the system does not support dark mode, or the browser does not supportMedia Queries Level 5, the theme will be displayed aslight mode by default. Anyway, the bottom left corner of the Sidebar will provide a button for users to switch color schemes.

  • dark- Always show dark mode.

  • light- Always show light mode.

You may want to preview the site before publishing, so just run the script tool:

$ bash tools/run.sh

Open a modern brower and visit athttp://localhost:4000.

Few days later, you may find that the file modification(e.g. edits to a post) does not refresh in real time by usingrun.sh. Don't worry, the advanced option-r (or--realtime) will solve this problem, but it requiresfswatch to be installed on your machine. Type-h for more information.

Before the deployment begins, ensure theurl in file_config.yml has been set tohttps://<username>.github.io(or the custom domain, if you have. e.g.https://yourdomain.com). What's more, if you prefer to theProject site, changebaseurl of file_config.yml to your project name, starting with a slash. e.g./project.

By deploying the site in this way, you're allowed to push the source code directly to the remote.

Note: If you want to use any third-party Jekyll plugins that not inthis list, stop reading the current approach and go toOption 2: Build locally.

1. Rename the repository to:

2. Commit the changes of the repo first, then run the initialization script:

$ bash tools/init.sh

Note: TheRecent Update requires the posts' latest git-log date, so make sure the changes in_posts have been committed before running this command.

it will automatically generates theLatest Modified Date andCategories / Tags page for the posts and submit a commit. Its output is similar to the following log:

[INFO] Success to update lastmod for 4 post(s).[INFO] Succeed! 3 category-pages created.[INFO] Succeed! 4 tag-pages created.[Automation] Updated the Categories, Tags, Lastmod for post(s). 11 files changed, 46 insertions(+), 3 deletions(-) ...Updated the Categories, Tags, Lastmod for post(s).

3. Push the changes toorigin/master then go to GitHub website and enable GitHub Pages service for the repo.

4. Check it out:

For security reasons, GitHub Pages runs onsafe mode, which means the third-party Jekyll plugins or custom scripts won't work. If you want to use any another plugins that not in thewhitelist,you have to generate the site locally rather than on GitHub Pages.

1. Browse to GitHub website, create a brand new repo named:

and clone it.

2. In the root of the source project, build your site by:

$bash tools/build.sh -d /path/to/local/project/

The generated static files will be placed in the root of/path/to/local/project. Commit and push the changes to themaster branch on GitHub.

3. Go to GitHub website and enable Pages service for the new repository.

4. Visit at:

and enjoy!

For more details and the better reading experience, please check out thetutorial in demo site. In the meanwhile, a copy of the tutorial is also available on theWiki.

The old saying: "Tow heads are better than one. Five heads are better than two." So, welcome to report bugs, improve code quality or submit a new feature. For more information, seecontributing guidelines.

This theme is mainly built withJekyll ecosystem,Bootstrap,Font Awesome and some other wonderful tools(their copyright information can be found in the relevant files).

🎉Thanks to all the volunteers who contributed to this project, their GitHub IDs are onthis list. Also, I won't forget those guys who submitted the issues or unmerged PR because they reported bugs, shared ideas or inspired me to write more readable documentation.

If you enjoy this theme or find it helpful, please consider becoming my sponsor, I'd really appreciate it! Click the button❤️Sponsor at the top of theHome Page and choose a link that suits you to donate. This will encourage me and help me maintain this project.

This work is published underMIT License.