1
0
mirror of https://github.com/cotes2020/jekyll-theme-chirpy.git synced 2025-12-21 15:12:59 +00:00

Compare commits

..

30 Commits
v2.4 ... v2.5

Author SHA1 Message Date
Cotes Chung
ad7d8ac1c9 Merge branch 'release/2.5' 2020-08-03 03:44:13 +08:00
Cotes Chung
adff74b27b Update docs for v2.5 2020-08-03 03:28:53 +08:00
Cotes Chung
1c3c22bb68 Merge branch 'feature/improve-typography' into develop 2020-08-03 02:24:12 +08:00
Cotes Chung
628d4de095 Merge branch 'feature/build-by-gh-actions' into develop 2020-08-03 02:19:13 +08:00
Cotes Chung
48b3df2ea7 Added new tools and workflow. 2020-08-03 02:05:15 +08:00
Cotes Chung
3b0cf90f5c Improved the build tool.
Allows to specify an empty base-url.
2020-08-02 01:48:47 +08:00
Cotes Chung
544f72efff Optimized font colors. 2020-07-30 05:28:16 +08:00
Cotes Chung
112091cbf6 Improved the posts layout. 2020-07-30 05:12:36 +08:00
Cotes Chung
b04bb847b1 Merge branch 'hotfix/2.4.2' 2020-07-30 02:50:19 +08:00
Cotes Chung
a71bade6eb Merge tag 'v2.4.2' into develop
Fix the CI workflow
2020-07-30 02:50:19 +08:00
Cotes Chung
6ef97f1fad Fixed CI workflow. 2020-07-30 02:48:08 +08:00
Cotes Chung
4675d42f90 Merge branch 'feature/improve-pv-fetching' into develop 2020-07-26 22:25:39 +08:00
Cotes Chung
a624b9a472 Update pv fetching tool. 2020-07-26 22:25:26 +08:00
Cotes Chung
ad48a9ab06 Fixed empty PV issue. 2020-07-26 22:25:26 +08:00
Cotes Chung
18bd1a91ef Merge branch 'hotfix/2.4.1' 2020-07-26 18:31:56 +08:00
Cotes Chung
4cff8879ac Merge tag 'v2.4.1' into develop
use git-flow to improve development
2020-07-26 18:31:56 +08:00
Cotes Chung
4dd4915bed Update issues template 2020-07-26 18:30:12 +08:00
Cotes Chung
a227ae386d Updated the contribution guide. 2020-07-26 17:06:33 +08:00
Cotes Chung
32bd36f016 Updated the CI/CD scripts. 2020-07-25 23:08:37 +08:00
Cotes Chung
aa23becd14 Split post date format code snippets.
Code improvement
2020-07-24 04:15:38 +08:00
Cotes Chung
b2f0b4cb1b Improved post date display. 2020-07-23 20:57:11 +08:00
Cotes Chung
209058b84a Code improvement.
Passing parameters to includes
2020-07-22 23:02:11 +08:00
Cotes Chung
562fcd4fd8 Fixed posts' base-url on cache list. 2020-07-17 16:27:11 +08:00
Cotes Chung
22115f3797 Optimized update list & fixed sw cache list. 2020-07-16 21:00:19 +08:00
Cotes Chung
9f3619e54a Fixed last-mod display for non-English named posts. 2020-07-16 21:00:19 +08:00
Cotes Chung
5b0aaa5403 Improved script tools.
- Allows posts to be placed in subdirectories (#41, #87).
- Identify posts file with the suffix ‘.markdown’.

**Page creator**
- Pass the posts without any categories or tags.
- Omit the YAML comments for categories/tags.

**Lastmod**
- compatible with one-digit month or day post files.
2020-07-14 23:16:43 +08:00
Cotes Chung
733bb0fbfa Updated the PR template. 2020-07-14 12:03:23 +08:00
Cotes Chung
0d47beba97 Improved the tool scripts.
- Avoid the empty lastmod file.
- Check if there is no post.
- Fixed the prompt message.
2020-07-14 03:24:25 +08:00
Cotes Chung
c0ba181246 Improved the PV fetching.
Discard some of the old permalink PV records.
2020-07-14 03:24:25 +08:00
Cotes Chung
313c44f238 Update Docs. 2020-07-12 01:30:55 +08:00
44 changed files with 767 additions and 721 deletions

View File

@@ -2,15 +2,21 @@
I want to thank you for sparing a time to improve this project! Here are some guidelines for contributing I want to thank you for sparing a time to improve this project! Here are some guidelines for contributing
To ensure that the blog design is not confused, this project does not accept suggestions for design changes, such as color scheme, fonts, typography, etc. If your request is about an enhancement, it is recommended to first submit a `Feature Request` type issue to discuss whether your idea fits the project. To ensure that the blog design is not confused, this project does not accept suggestions for design changes, such as color scheme, fonts, typography, etc. If your request is about an enhancement, it is recommended to first submit a [`Feature Request`](https://github.com/cotes2020/jekyll-theme-chirpy/issues/new?labels=enhancement&template=feature_request.md) issue to discuss whether your idea fits the project.
Generally, contribute to the project by: Generally, contribute to the project by:
1. Fork this project. 1. Fork this project on GitHub and clone it locally.
2. Create a new branch `my-new-feature`(or `fix-a-bug`), then complete the development, commit and push. 2. Create a new branch named `feature/my-feature` (or `feature/fix-a-bug`), which branch from `develop`:
3. Submit a new `Pull Request`.
```console
$ git checkout -b feature/<my-feature> develop
```
> Please note that the new branch name must include the prefix `feature/`.
3. After completing the development, commit and push to remote.
4. Submit a new **pull request** to the `develop` branch of upstream, i.e., `cotes2020/jekyll-theme-chirpy:develop`.
--- ---
:tada:Your volunteering will make the open source world more beautiful, thanks again!:tada: :tada: Your volunteering will make the open source world more beautiful, thanks again! :tada:

View File

@@ -11,7 +11,7 @@ labels: enhancement
- [ ] I have read the [contributing guidelines](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/.github/CONTRIBUTING.md). - [ ] I have read the [contributing guidelines](https://github.com/cotes2020/jekyll-theme-chirpy/blob/master/.github/CONTRIBUTING.md).
- [ ] There are no similar request on existing issues (including closed ones). - [ ] There are no similar request on existing issues (including closed ones).
- [ ] I have read the [project progress](https://github.com/cotes2020/jekyll-theme-chirpy/projects) and know the current progress of the project. - [ ] I have read the [project progress](https://github.com/cotes2020/jekyll-theme-chirpy/projects) and know the current progress of the project.
- [ ] I was in the `master` branch of the latest code. - [ ] I was in the `develop` branch of the latest code.
## Is your feature request related to a problem? Please describe ## Is your feature request related to a problem? Please describe

View File

@@ -7,20 +7,14 @@ labels: question
<!-- Note: Please follow the template to open a new issue, otherwise your question will probably be ignored. --> <!-- Note: Please follow the template to open a new issue, otherwise your question will probably be ignored. -->
## Checklist ## Checklist
<!-- Please complete the following list of tasks, and then check it by change the "[ ]" to "[x]" --> <!-- Please complete the following list of tasks, and then check it by change the "[ ]" to "[x]" -->
- [ ] I have read the [tutorials](https://chirpy.cotes.info/categories/tutorial/) and know the correct effect of the functional design. - [ ] I have read the [tutorials](https://chirpy.cotes.info/categories/tutorial/) and know the correct effect of the functional design.
- [ ] There are no similar question on existing issues (including closed ones). - [ ] There are no similar question on existing issues (including closed ones).
- [ ] I searched the Internet for related problems, but still couldn't solve it. - [ ] I searched the Internet for related problems, but still couldn't solve it.
- [ ] My question is based on the latest code of `master` branch. - [ ] My question is based on the latest code of `master` branch.
## I don't understand what the ReadMe/Wiki says ## Description
<!-- <!-- Please describe your question. -->
Point out the parts that are hard for you to understand.
-->
## I have other questions
<!--
Please describe your question.
-->

View File

@@ -1,11 +1,10 @@
# Description ## Description
<!-- <!--
Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change. Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change.
--> -->
Fixes #(issue) e.g. Fixes #(issue)
## Type of change ## Type of change
@@ -17,7 +16,7 @@ Please select the desired item checkbox and change it to "[x]", then delete opti
- [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected) - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
- [ ] Documentation update - [ ] Documentation update
# How Has This Been Tested? ## How has this been tested?
<!-- <!--
Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration
@@ -26,16 +25,16 @@ Please describe the tests that you ran to verify your changes. Provide instructi
- [ ] I have run `bash ./tools/build.sh && bash ./tools/test.sh` (at the root of the project) locally and passed - [ ] I have run `bash ./tools/build.sh && bash ./tools/test.sh` (at the root of the project) locally and passed
- [ ] I have tested this feature in the browser - [ ] I have tested this feature in the browser
## Test Configuration **Test Configuration**
* Browerser type & version: * Browerser type & version:
* Operating system: * Operating system:
* Bundler version: * Bundler version:
* Ruby version: * Ruby version:
* Jekyl version: * Jekyll version:
# Checklist: ## Checklist:
<!-- Select checkboxes by change the "[ ]" to "[x]" --> <!-- Select checkboxes by change the "[ ]" to "[x]" -->
- [ ] My code follows the [Google style guidelines](https://google.github.io/styleguide/) - [ ] My code follows the [Google style guidelines](https://google.github.io/styleguide/)
- [ ] I have performed a self-review of my own code - [ ] I have performed a self-review of my own code

View File

@@ -1,8 +1,8 @@
name: 'Continuous Integration' name: 'Continuous Integration'
on: on:
push: push:
branches-ignore: branches:
- stable - '*'
tags-ignore: tags-ignore:
- '*' - '*'
paths-ignore: paths-ignore:
@@ -15,7 +15,7 @@ on:
- 'LICENSE' - 'LICENSE'
pull_request: pull_request:
paths: paths:
- "**" - '**'
jobs: jobs:
ci: ci:

99
.github/workflows/pages-deploy.yml.hook vendored Normal file
View File

@@ -0,0 +1,99 @@
name: 'Automatic build'
on:
push:
branches:
- master
paths-ignore:
- '.gitignore'
- 'README.md'
- 'LICENSE'
jobs:
build-n-test:
runs-on: ubuntu-latest
steps:
- uses: actions/setup-ruby@v1
with:
ruby-version: '2.6.x'
- name: Checkout
uses: actions/checkout@v2
with:
fetch-depth: 0
- name: Bundle Caching
id: bundle-cache
uses: actions/cache@v1
with:
path: vendor/bundle
key: ${{ runner.os }}-gems-${{ hashFiles('**/Gemfile') }}
restore-keys: |
${{ runner.os }}-gems-
- name: Bundle config
run: |
bundle config path vendor/bundle
- name: Bundle Install
if: steps.bundle-cache.outputs.cache-hit != 'true'
run: |
bundle install
- name: Bundle Install locally
if: steps.bundle-cache.outputs.cache-hit == 'true'
run: |
bundle install --local
- name: Build Site
run: |
bash tools/build.sh -b ""
- name: Test Site
run: |
bash tools/test.sh
deploy:
needs: build-n-test
runs-on: ubuntu-latest
steps:
- uses: actions/setup-ruby@v1
with:
ruby-version: '2.6.x'
- name: Checkout
uses: actions/checkout@v2
with:
fetch-depth: 0
- name: Bundle Caching
id: bundle-cache
uses: actions/cache@v1
with:
path: vendor/bundle
key: ${{ runner.os }}-gems-${{ hashFiles('**/Gemfile') }}
restore-keys: |
${{ runner.os }}-gems-
- name: Bundle config
run: |
bundle config path vendor/bundle
- name: Bundle Install
if: steps.bundle-cache.outputs.cache-hit != 'true'
run: |
bundle install
- name: Bundle Install locally
if: steps.bundle-cache.outputs.cache-hit == 'true'
run: |
bundle install --local
- name: Build site
run: |
bash tools/build.sh
- name: Deploy
run: |
bash tools/deploy.sh

View File

@@ -23,7 +23,7 @@ script:
- bash _cibuild.sh - bash _cibuild.sh
branches: branches:
only: stable only: master
git: git:
depth: false # for posts lastmod depth: false # for posts lastmod

198
README.md
View File

@@ -13,7 +13,7 @@ A minimal, sidebar, responsive web design Jekyll theme, focusing on text present
## Table of Contents ## Table of Contents
* [Features](#features) * [Features](#features)
* [Installing](#installing) * [Installation](#installation)
* [Usage](#usage) * [Usage](#usage)
* [Contributing](#contributing) * [Contributing](#contributing)
* [Credits](#credits) * [Credits](#credits)
@@ -37,143 +37,112 @@ A minimal, sidebar, responsive web design Jekyll theme, focusing on text present
* GA Pageviews reporting (Advanced) * GA Pageviews reporting (Advanced)
* SEO and Performance Optimization * SEO and Performance Optimization
## Installing
### Prerequisites ## Installation
Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of basic environment (`Ruby`, `RubyGems` and `Bundler`). [Fork **Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/fork) on GitHub, and clone the fork to local by:
To improve the writing experience, we need to use some script tools. If your machine is running Debian or macOS, make sure that [GNU coreutils](https://www.gnu.org/software/coreutils/) is installed. Otherwise, install by: ```terminal
$ git clone git@github.com:<username>/jekyll-theme-chirpy -b master --single-branch
* Debian
```console
$ sudo apt-get install coreutils
``` ```
* macOS ### Setting up the local envrionment
```console If you would like to run or build the project on your local machine, please follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of `Ruby`, `RubyGems` and `Bundler`.
$ brew install coreutils
```
Before running or building for the first time, please complete the installation of the Jekyll plugins. Go to the root directory of project and run:
### Jekyll Plugins
[Fork **Chirpy** from GitHub](https://github.com/cotes2020/jekyll-theme-chirpy/fork), then clone your forked repo to local:
```console
$ git clone git@github.com:USER/jekyll-theme-chirpy.git -b master
```
and replace the `USER` above to your GitHub username.
The first time you run or build the project on local machine, perform the installation of Jekyll plugins. Go to the root of repo and run:
```terminal ```terminal
$ bundle install $ bundle install
``` ```
`bundle` will automatically install all the dependent Jekyll Plugins that listed in the `Gemfile`. `bundle` will automatically install all the dependencies specified by `Gemfile`.
What's more, in order to generate some extra files (*categories*, *tags* and *last modified list*), we need to use some tool scripts. If your machine is running Debian or macOS, make sure that [GNU coreutils](https://www.gnu.org/software/coreutils/) is installed. Otherwise, install by:
* Debian
```console
$ sudo apt-get install coreutils
```
* macOS
```console
$ brew install coreutils
```
## Usage ## Usage
Running [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/) requires some extra files, which cannot be generated by Jekyll native commands, so please strictly follow the methods mentioned below to run or deploy your website.
### Directory Structure ### Initialization
The main files and related brief introductions are listed below. Go to the root directory of the project and start initialization:
```sh ```console
jekyll-theme-chirpy/ $ bash tools/init.sh
├── _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
``` ```
> If you not intend to deploy it on GitHub Pages, append parameter option `--no-gh` at the end of the above command.
As mentioned above, some files or directories should be removed from your repo: What it does is:
- .travis.yml 1. Remove some files or directories from your repository:
- .github - `.travis.yml`
- everything under `.github/`
- files under `_posts/`
- folder `docs/`
2. Unless the option `--no-gh` was enabled, setup the GitHub action workflow by renaming `pages-deploy.yml.hook` of directory `.github/workflows/` to `pages-deploy.yml`.
3. Automatically create a commit to save the changes.
### Configuration ### Configuration
Generally, go to `_config.yml` and configure the variables as needed. Some of them are typical options: Generally, go to `_config.yml` and configure the variables as needed. Some of them are typical options:
* `url` * `url`
Set to your website url and there should be no slash symbol at the tail. Format: `<protocol>://<domain>`.
* `avatar` * `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 small as possible(may be *<https://tinypng.com/>* will help).
* `timezone` * `timezone`
To ensure that the posts' release date matches the city you live in, please modify the field `timezone` correctly. A list of all available values can be found on [TimezoneConverter](http://www.timezoneconverter.com/cgi-bin/findzone/findzone) or [Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones).
* `theme_mode` * `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 support `Media Queries Level 5`, the theme will be displayed as `light` 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.
### Run Locally ### Run Locally
You may want to preview the site content before publishing, so just run the script tool: You may want to preview the site contents before publishing, so just run it by:
```terminal ```terminal
$ bash tools/run.sh $ bash tools/run.sh
``` ```
Open a modern browser and visit at <http://localhost:4000>. Then open a browser and visit to <http://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 using `run.sh`. Don't worry, the advanced option `-r` (or `--realtime`) will solve this problem, but it requires [**fswatch**](http://emcrisostomo.github.io/fswatch/) to be installed on your machine. Type `-h` for more information. Few days later, you may find that the file changes does not refresh in real time by using `run.sh`. Don't worry, the advanced option `-r` (or `--realtime`) will solve this problem, but it requires [**fswatch**](http://emcrisostomo.github.io/fswatch/) to be installed on your machine.
### Deploying to GitHub Pages ### Deployment
Before the deployment begins, checkout the file `_config.yml` and make sure that the `url` has been configured. What's more, if you prefer the [Project site on GitHub](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and also use the default domain `<username>.github.io`, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`. Before the deployment begins, checkout the file `_config.yml` and make sure the `url` is configured correctly. Furthermore, if you prefer the [_project site_](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and don't use a custom domain, or you want to visit your website with a base url on a web server other than **GitHub Pages**, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`.
#### Option 1: Built by GitHub Pages Assuming you have already gone through the [initialization](#initialization), you can now choose any of the following methods to deploy your website.
By deploying the site in this way, you're allowed to push the source code directly to the remote. #### Deploy on GitHub Pages
> **Note**: If you want to use any third-party Jekyll plugins that not in [this list](https://pages.github.com/versions/), stop reading the current approach and go to [*Option 2: Build locally*](#option-2-build-locally). For security reasons, GitHub Pages build runs on `safe` mode, which restricts us from using tool scripts to generate additional page files. Therefore, we can use GitHub Actions to build the site, store the built site files on a new branch, and use that branch as the source of the Pages service.
**1**. Rename the repository to: 1. Push any commit to `origin/master` to trigger the GitHub Actions workflow. Once the build is complete, a new remote branch called `gh-pages` will appear, which is used to store the built site files.
|Site Type | Repo's Name| 2. Unless you prefer to project sites, rename your repository to `<username>.github.io` on GitHub.
|:---|:---|
|User or Organization | `<username>.github.io`|
|Project| Any one except `<username>.github.io`, let's say `project`|
**2**. Commit the changes of the repo first, then run the publish script: 3. Choose branch `gh-pages` as your GitHub Pages source.
4. Visit your website at the address indicated by GitHub.
#### Deploy on Other Platforms
On platforms other than GitHub, e.g. GitLab, we cannot enjoy the convenience of **GitHub Actions**. However, we have a tool to make up for this shortcoming.
Commit the changes of your repository first, then run the publish script:
```console ```console
$ bash tools/publish.sh $ bash tools/publish.sh
@@ -181,7 +150,7 @@ $ bash tools/publish.sh
> Please note that the *Recent Update* list requires the latest git-log date of posts, thus make sure the changes in `_posts` have been committed before running this command. > Please note that the *Recent Update* list requires the latest git-log date of posts, thus make sure the changes in `_posts` have been committed before running this command.
it will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts and submit a commit, and then push to `origin/master`. Its output is similar to the following log: It will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts and submit a commit, then push to `origin/master`. Its output is similar to the following log:
```terminal ```terminal
[INFO] Success to update lastmod for 4 post(s). [INFO] Success to update lastmod for 4 post(s).
@@ -190,54 +159,21 @@ it will automatically generates the *Latest Modified Date* and *Categories / Tag
[INFO] Published successfully! [INFO] Published successfully!
``` ```
**3**. Go to GitHub website and enable GitHub Pages service for the repo. Lastly, enable the pages service according to the instructions of the platform you choose.
**4**. Check it out: #### Deploy on Private Server
|Site Type | Site URL | In the root of the source project, build your site by:
|:---|:---|
|User or Organization | `https://<username>.github.io/`|
|Project| `https://<username>.github.io/project/`|
#### Option 2: Build Locally
For security reasons, GitHub Pages runs on `safe` 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 the [whitelist](https://pages.github.com/versions/), **you have to generate the site locally rather than on GitHub Pages**.
**1**. Browse to GitHub website, create a brand new repo named:
|Site Type | Repo's Name|
|:---|:---|
|User or Organization | `<username>.github.io`|
|Project| Any one except `<username>.github.io`, let's say `project`|
and clone it.
**2**. In the root of the source project, build your site by:
```console ```console
$ bash tools/build.sh -d /path/to/local/project/ $ bash tools/build.sh -d /path/to/site/
``` ```
The generated static files will be placed in the root of `/path/to/local/project`. Commit and push the changes to the `master` branch on GitHub. The generated site files will be placed in the root of `/path/to/site/`. Now you should upload those files to your web server, such as Nginx.
**3**. Go to GitHub website and enable Pages service for the new repository.
**4**. Visit at:
|Site Type | Site URL |
|:---|:---|
|User or Organization | `https://<username>.github.io/`|
|Project| `https://<username>.github.io/project/`|
#### Finishing work
No matter which way you choose to deploy the website on GitHub, please enforce the `HTTPS` for it. See official docs: [Securing your GitHub Pages site with HTTPS](https://help.github.com/en/github/working-with-github-pages/securing-your-github-pages-site-with-https).
### Documentation ### Documentation
For more details and the better reading experience, please check out the [tutorial in demo site](https://chirpy.cotes.info/categories/tutorial/). In the meanwhile, a copy of the tutorial is also available on the [Wiki](https://github.com/cotes2020/jekyll-theme-chirpy/wiki). For more details and the better reading experience, please check out the [tutorials on demo site](https://chirpy.cotes.info/categories/tutorial/). In the meanwhile, a copy of the tutorial is also available on the [Wiki](https://github.com/cotes2020/jekyll-theme-chirpy/wiki).
## Contributing ## Contributing
@@ -246,14 +182,14 @@ The old saying, "Two heads are better than one." Consequently, welcome to report
## Credits ## Credits
This theme is mainly built with [Jekyll](https://jekyllrb.com/) ecosystem, [Bootstrap](https://getbootstrap.com/), [Font Awesome](https://fontawesome.com/) and some other wonderful tools(their copyright information can be found in the relevant files). This theme is mainly built with [Jekyll](https://jekyllrb.com/) ecosystem, [Bootstrap](https://getbootstrap.com/), [Font Awesome](https://fontawesome.com/) and some other wonderful tools (their copyright information can be found in the relevant files).
:tada:Thanks to all the volunteers who contributed to this project, their GitHub IDs are on [this list](https://github.com/cotes2020/jekyll-theme-chirpy/graphs/contributors). 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. :tada: Thanks to all the volunteers who contributed to this project, their GitHub IDs are on [this list](https://github.com/cotes2020/jekyll-theme-chirpy/graphs/contributors). 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.
## Support ## Support
If you enjoy this theme or find it helpful, please consider becoming my sponsor, I'd really appreciate it! Click the button <kbd>:heart:Sponsor</kbd> at the top of the [Home Page](https://github.com/cotes2020/jekyll-theme-chirpy) and choose a link that suits you to donate; this will encourage and help me better maintain the project. If you enjoy this theme or find it helpful, please consider becoming my sponsor, I'd really appreciate it! Click the button <kbd>:heart: Sponsor</kbd> at the top of the [Home Page](https://github.com/cotes2020/jekyll-theme-chirpy) and choose a link that suits you to donate; this will encourage and help me better maintain the project.
## License ## License

View File

@@ -6,4 +6,6 @@
tooltip: "%a, %b %e, %Y, %l:%M %p %z" tooltip: "%a, %b %e, %Y, %l:%M %p %z"
post: "%b %e, %Y" post:
long: "%b %e, %Y"
short: "%b %e"

View File

@@ -7,8 +7,10 @@
MIT License MIT License
--> -->
<div id="disqus" class="pt-2 pb-4"> <div id="disqus" class="pt-2 pb-2">
<p class="font-italic text-center text-muted small">Comments powered by <a href="https://disqus.com/">Disqus</a>.</p> <p class="font-italic text-center text-muted small">
Comments powered by <a href="https://disqus.com/">Disqus</a>.
</p>
</div> </div>
<script src="{{ site.baseurl }}/assets/js/lib/jquery.disqusloader.min.js"></script> <script src="{{ site.baseurl }}/assets/js/lib/jquery.disqusloader.min.js"></script>

View File

@@ -3,7 +3,10 @@
https://github.com/penibelst/jekyll-compress-html/issues/101 https://github.com/penibelst/jekyll-compress-html/issues/101
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901 https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901
--> -->
{% if _content contains '<pre class="highlight">' %} {% if include.content contains '<pre class="highlight">' %}
{% assign _content = _content | replace: '<pre class="highlight"><code', '<code' %} {% assign content = include.content | replace: '<pre class="highlight"><code', '<code' %}
{% assign _content = _content | replace: '</code></pre>', '</code>' %} {% assign content = content | replace: '</code></pre>', '</code>' %}
{{ content }}
{% else %}
{{ include.content }}
{% endif %} {% endif %}

View File

@@ -8,18 +8,10 @@
{% if page.layout == 'home' %} {% if page.layout == 'home' %}
{% if site.google_analytics.pv.cache and site.google_analytics.pv.enabled %}
<script src="{{ '/assets/js/data/pv-cache.js' | relative_url }}"></script>
{% endif %}
<script src="{{ '/assets/js/home.min.js' | relative_url }}" async></script> <script src="{{ '/assets/js/home.min.js' | relative_url }}" async></script>
{% elsif page.layout == 'post' %} {% elsif page.layout == 'post' %}
{% if site.google_analytics.pv.cache and site.google_analytics.pv.enabled %}
<script src="{{ '/assets/js/data/pv-cache.js' | relative_url }}"></script>
{% endif %}
<script src="{{ '/assets/js/post.min.js' | relative_url }}" async></script> <script src="{{ '/assets/js/post.min.js' | relative_url }}" async></script>
{% if page.math %} {% if page.math %}

View File

@@ -1,12 +1,14 @@
{% comment %} {% comment %}
Remove line numbers from code snippets. Remove the line number of the code snippet.
v2.2 v2.2
https://github.com/cotes2020/jekyll-theme-chirpy https://github.com/cotes2020/jekyll-theme-chirpy
© 2020 Cotes Chung © 2020 Cotes Chung
Published under the MIT License Published under the MIT License
{% endcomment %} {% endcomment %}
{% if _content contains '<td class="rouge-gutter gl"><pre class="lineno">' %} {% assign content = include.content %}
{% assign _content = _content | replace: '<td class="rouge-gutter gl"><pre class="lineno">', '<!-- <td class="rouge-gutter gl"><pre class="lineno">'%}
{% assign _content = _content | replace: '</td><td class="rouge-code">', '</td> --><td class="rouge-code">' %} {% if content contains '<td class="rouge-gutter gl"><pre class="lineno">' %}
{% assign content = content | replace: '<td class="rouge-gutter gl"><pre class="lineno">', '<!-- <td class="rouge-gutter gl"><pre class="lineno">'%}
{% assign content = content | replace: '</td><td class="rouge-code">', '</td> --><td class="rouge-code">' %}
{% endif %} {% endif %}

View File

@@ -23,17 +23,12 @@
<ul class="post-content pl-0 pb-1 ml-1 mt-2"> <ul class="post-content pl-0 pb-1 ml-1 mt-2">
{% for item in update_list %} {% for item in update_list %}
{% assign post_url = item | split: "::" | last | prepend: "/posts/" | append: "/" %} {% assign post_url = item | split: "::" | last | url_encode | prepend: "/posts/" | append: "/" %}
{% assign post = site.posts | where: "url", post_url | first %} {% assign post = site.posts | where: "url", post_url | first %}
{% if post %} {% if post %}
{% assign url = post.url | relative_url %} {% assign url = post.url | relative_url %}
<li><a href="{{ url }}">{{ post.title }}</a></li> <li><a href="{{ url }}">{{ post.title }}</a></li>
{% assign sum = sum | plus: 1 %}
{% if sum >= MAX_SIZE %} {% break %} {% endif %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}

View File

@@ -84,7 +84,7 @@
{% if index_list.size > 0 %} {% if index_list.size > 0 %}
<div id="related-posts" class="mt-4 mb-2 mb-sm-4 pb-2"> <div id="related-posts" class="mt-5 mb-2 mb-sm-4">
<h3 class="pt-2 mt-1 mb-4 ml-1" data-toc-skip>{{ site.data.label.post.relate_posts }}</h3> <h3 class="pt-2 mt-1 mb-4 ml-1" data-toc-skip>{{ site.data.label.post.relate_posts }}</h3>
<div class="card-deck mb-4"> <div class="card-deck mb-4">
{% for entry in index_list %} {% for entry in index_list %}
@@ -93,15 +93,13 @@
<div class="card"> <div class="card">
<a href="{{ post.url | relative_url }}"> <a href="{{ post.url | relative_url }}">
<div class="card-body"> <div class="card-body">
<span class="timeago small"> {% include timeago.html date=post.date class="small" %}
{{ post.date | date: site.data.date_format.post }}
<i class="unloaded">{{ post.date | date_to_xmlschema }}</i>
</span>
<h3 class="pt-0 mt-1 mb-3" data-toc-skip>{{ post.title }}</h3> <h3 class="pt-0 mt-1 mb-3" data-toc-skip>{{ post.title }}</h3>
<div class="text-muted small"> <div class="text-muted small">
{% assign content = post.content %} <p>
{% include no-linenos.html %} {% include no-linenos.html content=post.content %}
<p>{{ content | markdownify | strip_html | truncate: 200 | replace: '&', '&amp;' }}</p> {{ content | markdownify | strip_html | truncate: 200 }}
</p>
</div> </div>
</div> </div>
</a> </a>

View File

@@ -9,11 +9,14 @@
<div class="col-12 col-xl-11 post-content"> <div class="col-12 col-xl-11 post-content">
<div id="search-hints"> <div id="search-hints">
<h4 class="text-muted mb-4">{{ site.data.label.panel.trending_tags }}</h4> <h4 class="text-muted mb-4">{{ site.data.label.panel.trending_tags }}</h4>
{% include trending-tags.html %} {% include trending-tags.html %}
{% for tag in trending_tags %} {% for tag in trending_tags %}
{% capture url %}/tags/{{ tag | downcase | url_encode }}/{% endcapture %} {% capture url %}/tags/{{ tag | downcase | url_encode }}/{% endcapture %}
<a class="post-tag" href="{{ url | relative_url }}">{{ tag | replace: '-', ' ' }}</a> <a class="post-tag" href="{{ url | relative_url }}">{{ tag | replace: '-', ' ' }}</a>
{% endfor %} {% endfor %}
</div> </div>
<div id="search-results" class="d-flex flex-wrap justify-content-center text-muted mt-3"></div> <div id="search-results" class="d-flex flex-wrap justify-content-center text-muted mt-3"></div>
</div> </div>

27
_includes/timeago.html Normal file
View File

@@ -0,0 +1,27 @@
<!--
Date format snippet
v2.4.1
https://github.com/cotes2020/jekyll-theme-chirpy
© 2020 Cotes Chung
MIT License
-->
<span class="timeago {% if include.class %}{{ include.class }}{% endif %}"
{% if include.tooltip %}
data-toggle="tooltip"
data-placement="bottom"
title="{{ include.date | date: site.data.date_format.tooltip }}"
{% endif %}>
{% assign this_year = site.time | date: "%Y" %}
{% assign post_year = include.date | date: "%Y" %}
{% if post_year == this_year %}
{{ include.date | date: site.data.date_format.post.short }}
{% else %}
{{ include.date | date: site.data.date_format.post.long }}
{% endif %}
<i class="unloaded">{{ include.date | date_to_xmlschema }}</i>
</span>

View File

@@ -7,15 +7,20 @@
{% endcomment %} {% endcomment %}
{% assign MAX_SIZE = 5 %} {% assign MAX_SIZE = 5 %}
{% assign sum = 0 %}
{% assign update_list = "" | split: "" %} {% assign all_list = "" | split: "" %}
{% for entry in site.data.updates %} {% for entry in site.data.updates %}
{% capture elem %} {% capture elem %}
{{- entry.lastmod -}}::{{- entry.filename -}} {{- entry.lastmod -}}::{{- entry.filename -}}
{% endcapture %} {% endcapture %}
{% assign all_list = all_list | push: elem %}
{% assign update_list = update_list | push: elem %}
{% endfor %} {% endfor %}
{% assign update_list = update_list | sort | reverse %} {% assign all_list = all_list | sort | reverse %}
{% assign update_list = "" | split: "" %}
{% for entry in all_list limit:MAX_SIZE %}
{% assign update_list = update_list | push: entry %}
{% endfor %}

View File

@@ -18,7 +18,7 @@ layout: page
<li class="d-flex justify-content-between pl-md-3 pr-md-3"> <li class="d-flex justify-content-between pl-md-3 pr-md-3">
<a href="{{ post.url | relative_url }}">{{ post.title }}</a> <a href="{{ post.url | relative_url }}">{{ post.title }}</a>
<span class="dash flex-grow-1"></span> <span class="dash flex-grow-1"></span>
<span class="text-muted small">{{ post.date | date: site.data.date_format.post }}</span> <span class="text-muted small">{{ post.date | date: site.data.date_format.post.long }}</span>
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>

View File

@@ -36,15 +36,12 @@ layout: compress
<div id="main-wrapper"> <div id="main-wrapper">
<div id="main"> <div id="main">
{% capture _content %} {% include fixlinenos.html content=content %}
{{ content }}
{% endcapture %}
{% include fixlinenos.html %}
{{ _content }}
{% include footer.html %} {% include footer.html %}
</div> </div>
{% include search-results.html %} {% include search-results.html %}
</div> <!-- #main-wrapper --> </div> <!-- #main-wrapper -->

View File

@@ -58,20 +58,16 @@ layout: page
</div> </div>
<div class="post-content"> <div class="post-content">
<p> <p>
{% assign _content = post.content %} {% include no-linenos.html content=post.content %}
{% include no-linenos.html %} {{ content | markdownify | strip_html | truncate: 200 }}
{{ _content | markdownify | strip_html | truncate: 200 }}
</p> </p>
</div> </div>
<div class="post-meta text-muted"> <div class="post-meta text-muted">
<!-- posted date --> <!-- posted date -->
<i class="far fa-clock fa-fw"></i> <i class="far fa-clock fa-fw"></i>
<span class="timeago" data-toggle="tooltip" data-placement="bottom" {% include timeago.html date=post.date tooltip=true %}
title="{{ post.date | date: site.data.date_format.tooltip }}">
{{ post.date | date: site.data.date_format.post }}
<i class="unloaded">{{ post.date | date_to_xmlschema }}</i>
</span>
<!-- page views --> <!-- page views -->
{% if site.google_analytics.pv.enabled %} {% if site.google_analytics.pv.enabled %}
<i class="far fa-eye fa-fw"></i> <i class="far fa-eye fa-fw"></i>

View File

@@ -19,16 +19,12 @@ layout: default
<!-- Published date and author --> <!-- Published date and author -->
<div> <div>
Posted Posted
<span class="timeago" data-toggle="tooltip" data-placement="bottom" {% include timeago.html date=page.date tooltip=true %}
title="{{ page.date | date: site.data.date_format.tooltip }}">
{{ page.date | date: site.data.date_format.post }}
<i class="unloaded">{{ page.date | date_to_xmlschema }}</i>
</span>
by by
<span class="author"> <span class="author">
{% if page.author %} {% if page.author %}
{{ page.author }} {{ page.author }}
{% else%} {% else %}
{{ site.author }} {{ site.author }}
{% endif %} {% endif %}
</span> </span>
@@ -39,17 +35,18 @@ layout: default
{{ page.url | split: "/" | last }} {{ page.url | split: "/" | last }}
{%- endcapture -%} {%- endcapture -%}
{% assign record = site.data.updates | where: "filename", filename | first %} {% for item in site.data.updates %}
{% assign encode_filename = item.filename | url_encode %}
{% if filename == encode_filename %}
{% assign lastmod = item.lastmod %}
{% break %}
{% endif %}
{% endfor %}
{% if record %} {% if lastmod %}
<div> <div>
Updated Updated
<span class="timeago lastmod" {% include timeago.html date=lastmod class="lastmod" tooltip=true %}
data-toggle="tooltip" data-placement="bottom"
title="{{ record.lastmod | date: site.data.date_format.tooltip }}">
{{ record.lastmod | date: site.data.date_format.post }}
<i class="unloaded">{{ record.lastmod | date_to_xmlschema}}</i>
</span>
</div> </div>
{% endif %} {% endif %}
@@ -102,7 +99,7 @@ layout: default
{% endif %} {% endif %}
<div class="post-tail-bottom <div class="post-tail-bottom
d-flex justify-content-between align-items-center pt-5 pb-2"> d-flex justify-content-between align-items-center mt-3 pt-5 pb-2">
{% if site.data.rights.license %} {% if site.data.rights.license %}
<div class="license-wrapper"> <div class="license-wrapper">
This post is licensed under This post is licensed under
@@ -119,6 +116,7 @@ layout: default
</div> <!-- .post --> </div> <!-- .post -->
</div> <!-- #post-wrapper --> </div> <!-- #post-wrapper -->
{% include panel.html %} {% include panel.html %}
@@ -126,9 +124,10 @@ layout: default
</div> <!-- .row --> </div> <!-- .row -->
<div class="row"> <div class="row">
<div id="post-extend-wrapper" class="col-12 col-lg-11 col-xl-8"> <div class="col-12 col-lg-11 col-xl-8">
<div id="post-extend-wrapper" class="pl-1 pr-1 pl-sm-2 pr-sm-2 pl-md-4 pr-md-4">
<div class="pl-1 pr-1 pl-sm-2 pr-sm-2 pl-md-4 pr-md-4"> {% include related-posts.html %}
{% include post-nav.html %} {% include post-nav.html %}
@@ -136,12 +135,10 @@ layout: default
{% include disqus.html %} {% include disqus.html %}
{% endif %} {% endif %}
{% include related-posts.html %}
</div> <!-- .pl-1 pr-1 -->
</div> <!-- #post-extend-wrapper --> </div> <!-- #post-extend-wrapper -->
</div> <!-- .col-* -->
</div> <!-- .row --> </div> <!-- .row -->
{% include lozad.html %} {% include lozad.html %}

View File

@@ -18,7 +18,7 @@ layout: page
<li class="d-flex justify-content-between pl-md-3 pr-md-3"> <li class="d-flex justify-content-between pl-md-3 pr-md-3">
<a href="{{ post.url | relative_url }}">{{ post.title }}</a> <a href="{{ post.url | relative_url }}">{{ post.title }}</a>
<span class="dash flex-grow-1"></span> <span class="dash flex-grow-1"></span>
<span class="text-muted small">{{ post.date | date: site.data.date_format.post }}</span> <span class="text-muted small">{{ post.date | date: site.data.date_format.post.long }}</span>
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>

View File

@@ -8,7 +8,7 @@ tags: [writing]
## Naming and Path ## Naming and Path
Create a new file named with the format `YYYY-MM-DD-title.md` then put it into `_post` of the root directory. Create a new file named `YYYY-MM-DD-TITLE.EXTENSION` and put it in the `_post/` of the root directory. The `EXTENSION` must be one of `md` and `markdown`. From `v2.4.1`, you can create sub-directories under `_posts/` to categorize posts.
## Front Matter ## Front Matter
@@ -33,27 +33,28 @@ In order to accurately record the release date of a post, you should not only se
The `categories` of each post is designed to contain up to two elements, and the number of elements in `tags` can be zero to infinity. The `categories` of each post is designed to contain up to two elements, and the number of elements in `tags` can be zero to infinity.
The list of posts belonging to the same category/tag is recorded on a separate page. The number of such *category*/*tag* type pages is equal to the number of `categories`/`tags` for all posts, they must match perfectly. The list of posts belonging to the same _category_/_tag_ is recorded on a separate page. At the same time, the number of these _category_/_tag_ type pages is equal to the number of `categories` / `tags` elements for all posts, which means that the two number must be exactly the same.
For instance, let's say there is a post with front matter:
let's say there is a post with front matter:
```yaml ```yaml
categories: [Animal, Insect] categories: [Animal, Insect]
tags: bee tags: bee
``` ```
then we should have two *category* type pages placed in folder `categories` of root and one *tag* type page placed in folder `tags` of root: Then we should have two _category_ type pages placed in folder `categories` of root and one _tag_ type page placed in folder `tags` of root:
```terminal ```sh
jekyll-theme-chirpy .
├── categories ├── categories
│   ├── animal.html │   ├── animal.html # a category type page
│   └── insect.html │   └── insect.html
├── tags ├── tags
  └── bee.html   └── bee.html # a tag type page
... ...
``` ```
and the content of a *category* type page is and the content of a _category_ type page is
```yaml ```yaml
--- ---
@@ -63,7 +64,7 @@ category: CATEGORY_NAME # e.g. Insect
--- ---
``` ```
the content of a *tag* type page is the content of a _tag_ type page is
```yaml ```yaml
--- ---
@@ -73,11 +74,11 @@ tag: TAG_NAME # e.g. bee
--- ---
``` ```
With the increasing number of posts, the number of categories and tags will increase several times! If we still manually create these *category*/*tag* type files, it will obviously be a super time-consuming job, and it is very likely to miss some of them(i.e. when you click on the missing `category` or `tag` link from a post or somewhere, it will complain to you '404'). The good news is that we got a lovely script tool `_scripts/sh/create_pages.sh` to finish the boring task. Basically we will use it via `tools/publish.sh` instead of running it separately. Check out its use case [here]({{ "/posts/getting-started/#option-1-built-by-github-pages" | relative_url }}). With the increasing number of posts, the number of categories and tags will increase several times! If we still manually create these *category*/_tag_ type files, it will obviously be a super time-consuming job, and it is very likely to miss some of them, i.e., when you click on the missing `category` or `tag` link from a post or somewhere, the browser will complain to you "404 Not Found". The good news is we got a lovely script tool `_scripts/sh/create_pages.sh` to finish the boring tasks. Basically we will use it via `run.sh`, `build.sh`, `deploy.sh` or `publish.sh` that placed in `tools/` instead of running it separately. Check out its use case [here]({{ "/posts/getting-started/#deployment" | relative_url }}).
## Last modified date ## Last modified date
The last modified date of a post is obtained according to its latest git commit date, and all the modified date of the posts should be stored in `_data/updates.yml`. For example: The last modified date of a post is obtained according to the post's latest git commit date, and the modified date of all posts are designed to be stored in the file `_data/updates.yml`. Then contents of that file may be as follows:
```yaml ```yaml
- -
@@ -87,13 +88,13 @@ The last modified date of a post is obtained according to its latest git commit
... ...
``` ```
You can choose to create this file manually, but as you may notice, the better approach is to let it be automatically generated by a tool script. And `_scripts/sh/dump_lastmod.sh` was born for this! Similar to the another script `_scripts/sh/create_pages.sh` mentioned above, it is also be called from `tools/publish.sh`, so it doesn't have to be used separately. You can choose to create this file manually, But the better approach is to let it be automatically generated by a script tool, and `_scripts/sh/dump_lastmod.sh` was born for this! Similar to the other script (`create_pages.sh`) mentioned above, it is also be called from the other superior tools, so it doesn't have to be used separately.
When some posts have been modified since their published date and also the file `_data/updates.yml` was created correctly, a list with the label **Recent Updates** will be displayed in the right panel of the desktop view, which records the five most recently modified articles. When some posts have been modified since their published date and also the file `_data/updates.yml` was created correctly, a list with the label **Recent Updates** will be displayed in the right panel of the desktop view, which records the five most recently modified posts.
## Table of Contents ## Table of Contents
By default, the **T**able **o**f **C**ontents (TOC) is displayed on the right panel of the post. If you want to turn it off globally, go to `_config.yml` and set the variable `toc` to `false`. If you want to turn off TOC for specific post, add the following to post's [Front Matter](https://jekyllrb.com/docs/front-matter/): By default, the **T**able **o**f **C**ontents (TOC) is displayed on the right panel of the post. If you want to turn it off globally, go to `_config.yml` and set the value of variable `toc` to `false`. If you want to turn off TOC for specific post, add the following to post's [Front Matter](https://jekyllrb.com/docs/front-matter/):
```yaml ```yaml
--- ---

View File

@@ -7,138 +7,112 @@ tags: [getting started]
pin: true pin: true
--- ---
## Prerequisites
Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of basic environment (`Ruby`, `RubyGems` and `Bundler`). ## Installation
To improve the writing experience, we need to use some script tools. If your machine is running Debian or macOS, make sure that [GNU coreutils](https://www.gnu.org/software/coreutils/) is installed. Otherwise, install by: [Fork **Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/fork) on GitHub, and clone the fork to local by:
* Debian ```terminal
$ git clone git@github.com:<username>/jekyll-theme-chirpy -b master --single-branch
```console
$ sudo apt-get install coreutils
``` ```
* macOS ### Setting up the local envrionment
```console If you would like to run or build the project on your local machine, please follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installation of `Ruby`, `RubyGems` and `Bundler`.
$ brew install coreutils
```
Before running or building for the first time, please complete the installation of the Jekyll plugins. Go to the root directory of project and run:
## Jekyll Plugins
[Fork **Chirpy** from GitHub](https://github.com/cotes2020/jekyll-theme-chirpy/fork), then clone your forked repo to local:
```console
$ git clone git@github.com:USER/jekyll-theme-chirpy.git -b master
```
and replace the `USER` above to your GitHub username.
The first time you run or build the project on local machine, perform the installation of Jekyll plugins. Go to the root of repo and run:
```terminal ```terminal
$ bundle install $ bundle install
``` ```
`bundle` will automatically install all the dependent Jekyll Plugins that listed in the `Gemfile`. `bundle` will automatically install all the dependencies specified by `Gemfile`.
What's more, in order to generate some extra files (*categories*, *tags* and *last modified list*), we need to use some tool scripts. If your machine is running Debian or macOS, make sure that [GNU coreutils](https://www.gnu.org/software/coreutils/) is installed. Otherwise, install by:
* Debian
```console
$ sudo apt-get install coreutils
```
* macOS
```console
$ brew install coreutils
```
## Directory Structure ## Usage
The main files and related brief introductions are listed below. Running [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/) requires some extra files, which cannot be generated by Jekyll native commands, so please strictly follow the methods mentioned below to run or deploy your website.
```sh ### Initialization
jekyll-theme-chirpy/
├── _data Go to the root directory of the project and start initialization:
├── _includes
├── _layouts ```console
├── _posts # posts stay here $ bash tools/init.sh
├── _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
├── feed.xml
├── index.html
├── robots.txt
└── sitemap.xml
``` ```
> If you not intend to deploy it on GitHub Pages, append parameter option `--no-gh` at the end of the above command.
As mentioned above, some files or directories should be removed from your repo: What it does is:
- .travis.yml 1. Remove some files or directories from your repository:
- .github - `.travis.yml`
- everything under `.github/`
- files under `_posts/`
- folder `docs/`
2. Unless the option `--no-gh` was enabled, setup the GitHub action workflow by renaming `pages-deploy.yml.hook` of directory `.github/workflows/` to `pages-deploy.yml`.
## Configuration 3. Automatically create a commit to save the changes.
### Configuration
Generally, go to `_config.yml` and configure the variables as needed. Some of them are typical options: Generally, go to `_config.yml` and configure the variables as needed. Some of them are typical options:
* `url` * `url`
Set to your website url and there should be no slash symbol at the tail. Format: `<protocol>://<domain>`.
* `avatar` * `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 small as possible (may be *<https://tinypng.com/>* will help).
* `timezone` * `timezone`
To ensure that the posts' release date matches the city you live in, please modify the field `timezone` correctly. A list of all available values can be found on [TimezoneConverter](http://www.timezoneconverter.com/cgi-bin/findzone/findzone) or [Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones).
* `theme_mode` * `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 support `Media Queries Level 5`, the theme will be displayed as `light` mode by default. Anyway, the bottom left corner of the Sidebar will provide a button for users to switch color schemes. ### Run Locally
- **dark** - Always show dark mode. You may want to preview the site contents before publishing, so just run it by:
- **light** - Always show light mode.
## Run Locally
You may want to preview the site content before publishing, so just run the script tool:
```terminal ```terminal
$ bash tools/run.sh $ bash tools/run.sh
``` ```
Open a browser and visit <http://localhost:4000>. Then open a browser and visit to <http://localhost:4000>.
Few days later, you may find that the file changes does not refresh in real time by using `run.sh`. Don't worry, the advanced option `-r` (or `--realtime`) will solve this problem, but it requires [**fswatch**](http://emcrisostomo.github.io/fswatch/) to be installed on your machine. Few days later, you may find that the file changes does not refresh in real time by using `run.sh`. Don't worry, the advanced option `-r` (or `--realtime`) will solve this problem, but it requires [**fswatch**](http://emcrisostomo.github.io/fswatch/) to be installed on your machine.
## Deploying to GitHub Pages ### Deployment
Before the deployment begins, checkout the file `_config.yml` and make sure that the `url` has been configured. What's more, if you prefer the [Project site on GitHub](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and also use the default domain `<username>.github.io`, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`. Before the deployment begins, checkout the file `_config.yml` and make sure the `url` is configured correctly. Furthermore, if you prefer the [_project site_](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites) and don't use a custom domain, or you want to visit your website with a base url on a web server other than **GitHub Pages**, remember to change the `baseurl` to your project name that starting with a slash. For example, `/project`.
Assuming you have already gone through the [initialization](#initialization), you can now choose any of the following methods to deploy your website.
### Option 1: Built by GitHub Pages #### Deploy on GitHub Pages
By deploying the site in this way, you're allowed to push the source code directly to the remote. For security reasons, GitHub Pages build runs on `safe` mode, which restricts us from using tool scripts to generate additional page files. Therefore, we can use GitHub Actions to build the site, store the built site files on a new branch, and use that branch as the source of the Pages service.
> **Note**: If you want to use any third-party Jekyll plugins that not in [this list](https://pages.github.com/versions/), stop reading the current approach and go to [*Option 2: Build locally*](#option-2-build-locally). 1. Push any commit to `origin/master` to trigger the GitHub Actions workflow. Once the build is complete, a new remote branch called `gh-pages` will appear, which is used to store the built site files.
**1**. Rename the repository to: 2. Unless you prefer to project sites, rename your repository to `<username>.github.io` on GitHub.
|Site Type | Repo's Name| 3. Choose branch `gh-pages` as your GitHub Pages source.
|:---|:---|
|User or Organization | `<username>.github.io`|
|Project| Any one except `<username>.github.io`, let's say `project`|
**2**. Commit the changes of the repo first, then run the publish script: 4. Visit your website at the address indicated by GitHub.
#### Deploy on Other Platforms
On platforms other than GitHub, e.g. GitLab, we cannot enjoy the convenience of **GitHub Actions**. However, we have a tool to make up for this shortcoming.
Commit the changes of your repository first, then run the publish script:
```console ```console
$ bash tools/publish.sh $ bash tools/publish.sh
@@ -146,7 +120,7 @@ $ bash tools/publish.sh
> Please note that the *Recent Update* list requires the latest git-log date of posts, thus make sure the changes in `_posts` have been committed before running this command. > Please note that the *Recent Update* list requires the latest git-log date of posts, thus make sure the changes in `_posts` have been committed before running this command.
it will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts and submit a commit, and then push to `origin/master`. Its output is similar to the following log: It will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts and submit a commit, then push to `origin/master`. Its output is similar to the following log:
```terminal ```terminal
[INFO] Success to update lastmod for 4 post(s). [INFO] Success to update lastmod for 4 post(s).
@@ -155,46 +129,14 @@ it will automatically generates the *Latest Modified Date* and *Categories / Tag
[INFO] Published successfully! [INFO] Published successfully!
``` ```
**3**. Go to GitHub website and enable GitHub Pages service for the repo. Lastly, enable the pages service according to the instructions of the platform you choose.
**4**. Check it out: #### Deploy on Private Server
|Site Type | Site URL | In the root of the source project, build your site by:
|:---|:---|
|User or Organization | `https://<username>.github.io/`|
|Project| `https://<username>.github.io/project/`|
### Option 2: Build Locally
For security reasons, GitHub Pages runs on `safe` 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 the [whitelist](https://pages.github.com/versions/), **you have to generate the site locally rather than on GitHub Pages**.
**1**. Browse to GitHub website, create a brand new repo named:
|Site Type | Repo's Name|
|:---|:---|
|User or Organization | `<username>.github.io`|
|Project| Any one except `<username>.github.io`, let's say `project`|
and clone it.
**2**. In the root of the source project, build your site by:
```console ```console
$ bash tools/build.sh -d /path/to/local/project/ $ bash tools/build.sh -d /path/to/site/
``` ```
The generated static files will be placed in the root of `/path/to/local/project`. Commit and push the changes to the `master` branch on GitHub. The generated site files will be placed in the root of `/path/to/site/`. Now you should upload those files to your web server, such as Nginx.
**3**. Go to GitHub website and enable Pages service for the new repository.
**4**. Visit at:
|Site Type | Site URL |
|:---|:---|
|User or Organization | `https://<username>.github.io/`|
|Project| `https://<username>.github.io/project/`|
### Finishing work
No matter which way you choose to deploy the website on GitHub, please enforce the `HTTPS` for it. See official docs: [Securing your GitHub Pages site with HTTPS](https://help.github.com/en/github/working-with-github-pages/securing-your-github-pages-site-with-https).

View File

@@ -31,20 +31,21 @@ read_categories() {
local _category=$(echo "$_yaml" | grep "^category:") local _category=$(echo "$_yaml" | grep "^category:")
if [[ ! -z "$_categories" ]]; then if [[ ! -z "$_categories" ]]; then
echo "$_categories" | sed "s/categories: *//;s/\[//;s/\]//;s/, */,/g;s/\"//g;s/'//g" echo "$_categories" | sed "s/categories: *//;s/\[//;s/\].*//;s/, */,/g;s/\"//g;s/'//g"
elif [[ ! -z "_category" ]]; then elif [[ ! -z "_category" ]]; then
echo "$_category" | sed "s/category: *//;s/\[//;s/\]//;s/, */,/g;s/\"//g;s/'//g" echo "$_category" | sed "s/category: *//;s/\[//;s/\].*//;s/, */,/g;s/\"//g;s/'//g"
fi fi
} }
read_tags() { read_tags() {
local _yaml=$(_read_yaml $1) local _yaml=$(_read_yaml $1)
echo "$_yaml" | grep "^tags:" | sed "s/tags: *//;s/\[//;s/\]//;s/, */,/g;s/\"//g;s/'//g" echo "$_yaml" | grep "^tags:" | sed "s/tags: *//;s/\[//;s/\].*//;s/, */,/g;s/\"//g;s/'//g"
} }
init() { init() {
if [[ -d categories ]]; then if [[ -d categories ]]; then
rm -rf categories rm -rf categories
fi fi
@@ -53,11 +54,16 @@ init() {
rm -rf tags rm -rf tags
fi fi
if [[ ! -d _posts ]]; then
exit 0
fi
mkdir categories tags mkdir categories tags
} }
create_category() { create_category() {
if [[ ! -z $1 ]]; then
local _name=$1 local _name=$1
local _filepath="categories/$(echo $_name | sed 's/ /-/g' | awk '{print tolower($0)}').html" local _filepath="categories/$(echo $_name | sed 's/ /-/g' | awk '{print tolower($0)}').html"
@@ -70,10 +76,12 @@ create_category() {
((category_count=category_count+1)) ((category_count=category_count+1))
fi fi
fi
} }
create_tag() { create_tag() {
if [[ ! -z $1 ]]; then
local _name=$1 local _name=$1
local _filepath="tags/$( echo $_name | sed "s/ /-/g;s/'//g" | awk '{print tolower($0)}' ).html" local _filepath="tags/$( echo $_name | sed "s/ /-/g;s/'//g" | awk '{print tolower($0)}' ).html"
@@ -87,6 +95,7 @@ create_tag() {
((tag_count=tag_count+1)) ((tag_count=tag_count+1))
fi fi
fi
} }
@@ -97,10 +106,7 @@ create_tag() {
# $2 - type specified option # $2 - type specified option
######################################### #########################################
create_pages() { create_pages() {
if [[ $1 == '' ]]; then if [[ ! -z $1 ]]; then
exit 0
fi
# split string to array # split string to array
IFS_BAK=$IFS IFS_BAK=$IFS
IFS=',' IFS=','
@@ -126,17 +132,19 @@ create_pages() {
esac esac
IFS=$IFS_BAK IFS=$IFS_BAK
} fi
}
main() { main() {
init init
for _file in $(ls "_posts") for _file in $(find "_posts" -type f \( -iname \*.md -o -iname \*.markdown \))
do do
local _path="_posts/$_file" local _categories=$(read_categories "$_file")
local _categories=$(read_categories "$_path") local _tags=$(read_tags "$_file")
local _tags=$(read_tags "$_path")
create_pages "$_categories" $TYPE_CATEGORY create_pages "$_categories" $TYPE_CATEGORY
create_pages "$_tags" $TYPE_TAG create_pages "$_tags" $TYPE_TAG

View File

@@ -19,6 +19,7 @@ OUTPUT_FILE=updates.yml
_init() { _init() {
if [[ ! -d "$OUTPUT_DIR" ]]; then if [[ ! -d "$OUTPUT_DIR" ]]; then
mkdir "$OUTPUT_DIR" mkdir "$OUTPUT_DIR"
fi fi
@@ -27,7 +28,9 @@ _init() {
rm -f "$OUTPUT_DIR/$OUTPUT_FILE" rm -f "$OUTPUT_DIR/$OUTPUT_FILE"
fi fi
touch "$OUTPUT_DIR/$OUTPUT_FILE" if [[ ! -d $POST_DIR ]]; then
exit 0
fi
} }
@@ -55,6 +58,10 @@ _has_changed() {
_dump() { _dump() {
local _lasmod="`git log -1 --pretty=%ad --date=iso $2`" local _lasmod="`git log -1 --pretty=%ad --date=iso $2`"
if [[ ! -f "$OUTPUT_DIR/$OUTPUT_FILE" ]]; then
touch "$OUTPUT_DIR/$OUTPUT_FILE"
fi
echo "-" >> "$OUTPUT_DIR/$OUTPUT_FILE" echo "-" >> "$OUTPUT_DIR/$OUTPUT_FILE"
echo " filename: '$1'" >> "$OUTPUT_DIR/$OUTPUT_FILE" echo " filename: '$1'" >> "$OUTPUT_DIR/$OUTPUT_FILE"
echo " lastmod: '$_lasmod'" >> "$OUTPUT_DIR/$OUTPUT_FILE" echo " lastmod: '$_lasmod'" >> "$OUTPUT_DIR/$OUTPUT_FILE"
@@ -67,14 +74,12 @@ main() {
local _count=0 local _count=0
for _file in $(ls -r "$POST_DIR") for _file in $(find ${POST_DIR} -type f \( -iname \*.md -o -iname \*.markdown \))
do do
_filepath="$POST_DIR/$_file" _filename=$(basename $_file | sed 's/[0-9]\([0-9]*-\)//g;s/\..*//' ) # remove date and extension
_filename="${_file%.*}" # jekyll cannot read the extension of a file, so omit it.
_filename=${_filename:11} # remove the date
if _has_changed "$_filepath"; then if _has_changed "$_file"; then
_dump "$_filename" "$_filepath" _dump "$_filename" "$_file"
((_count=_count+1)) ((_count=_count+1))
fi fi

View File

@@ -493,8 +493,7 @@ footer {
} }
} }
a { a {
@include semi-bold; color: var(--footer-link);
color: var(---footer-link);
&:link { &:link {
@include no-text-decoration; @include no-text-decoration;
} }

View File

@@ -84,7 +84,7 @@
--timeline-year-dot-color: var(--timeline-color); --timeline-year-dot-color: var(--timeline-color);
/* Footer */ /* Footer */
---footer-link: rgb(146, 146, 146); --footer-link: rgb(171 171 171);
.post-content img { .post-content img {
filter: brightness(90%); filter: brightness(90%);

View File

@@ -120,5 +120,5 @@
--footnote-target-bg: lightcyan; --footnote-target-bg: lightcyan;
---footer-link: inherit; --footer-link: #424242;
} }

View File

@@ -27,10 +27,6 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
border-color: var(--btn-border-color); border-color: var(--btn-border-color);
} }
.author {
@include semi-bold;
}
.post { .post {
img { img {
max-width: 100%; max-width: 100%;
@@ -45,7 +41,7 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
} }
.post-tail-wrapper { .post-tail-wrapper {
margin-top: 4rem; margin-top: 6rem;
border-bottom: 1px double var(--main-border-color); border-bottom: 1px double var(--main-border-color);
font-size: 0.85rem; font-size: 0.85rem;
} }
@@ -209,6 +205,9 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
#post-extend-wrapper { #post-extend-wrapper {
min-height: 2rem; min-height: 2rem;
#disqus_thread {
margin-bottom: 2rem;
}
} }
.post-tail-bottom a { .post-tail-bottom a {
@@ -350,31 +349,3 @@ $prompt-newer: "{{ site.data.label.post.button.next }}";
} }
} }
/*
The following resposive design aim to
make #post-extend-wrapper margin-right same as pannel's width
*/
@media all and (min-width: 1200px) {
#post-extend-wrapper {
margin-right: 25%;
}
}
@media all and (min-width: 1460px) {
#post-extend-wrapper {
margin-right: 300px;
}
}
@media all and (min-width: 1650px) {
#post-extend-wrapper {
margin-right: calc((100% - 1150px) / 10 + 300px);
}
}
@media all and (min-width: 1700px) {
#post-extend-wrapper {
margin-right: calc((100% - 1150px) / 8 + 300px);
}
}

View File

@@ -13,7 +13,7 @@
{% if site.google_analytics.pv.enabled %} {% if site.google_analytics.pv.enabled %}
const proxyData = '{"url": "{{ site.google_analytics.pv.proxy_endpoint }}"}'; {% include_relative _pv-config.js %}
{% include_relative _utils/pageviews.js %} {% include_relative _utils/pageviews.js %}

14
assets/js/_pv-config.js Normal file
View File

@@ -0,0 +1,14 @@
/*!
PV configuration and Javascript conversion.
*/
const proxyEndpoint = "{{ site.google_analytics.pv.proxy_endpoint }}";
{% if site.google_analytics.pv.cache and site.google_analytics.pv.enabled %}
{% assign enabled = true %}
{% else %}
{% assign enabled = false %}
{% endif %}
const pvCacheEnabled = {{ enabled }};

View File

@@ -24,19 +24,15 @@ function countUp(min, max, destId) {
function countPV(path, rows) { function countPV(path, rows) {
/* path permalink looks like: '/posts/post-title/' */
var fileName = path.replace(/\/posts\//g, '').replace(/\//g, '.html'); /* e.g. post-title.html */
var count = 0; var count = 0;
var _v2_url = path.replace(/posts\//g, ''); /* the v2.0+ blog permalink: "/post-title/" */ if (rows !== undefined ) {
for (var i = 0; i < rows.length; ++i) { for (var i = 0; i < rows.length; ++i) {
var gaPath = rows[i][0]; var gaPath = rows[i][0];
if (gaPath == path || if (gaPath == path) { /* path format see: site.permalink */
gaPath == _v2_url ||
gaPath.concat('/') == _v2_url ||
gaPath.slice(gaPath.lastIndexOf('/') + 1) === fileName) { /* old permalink record */
count += parseInt(rows[i][1]); count += parseInt(rows[i][1]);
break;
}
} }
} }
@@ -65,7 +61,7 @@ function displayPageviews(data) {
} }
var hasInit = getInitStatus(); var hasInit = getInitStatus();
var rows = data.rows; var rows = data.rows; /* could be undefined */
if ($("#post-list").length > 0) { /* the Home page */ if ($("#post-list").length > 0) { /* the Home page */
$(".post-preview").each(function() { $(".post-preview").each(function() {
@@ -95,9 +91,9 @@ var getInitStatus = (function() {
var PvCache = (function() { var PvCache = (function() {
const KEY_PV = "pv"; const KEY_PV = "pv";
const KEY_CREATION = "pv_created_date"; const KEY_CREATION = "pv_created_date";
const KEY_PV_TYPE = "pv_type"; const KEY_PV_SRC = "pv_source";
var PvType = { var Source = {
ORIGIN: "origin", ORIGIN: "origin",
PROXY: "proxy" PROXY: "proxy"
}; };
@@ -116,29 +112,29 @@ var PvCache = (function() {
}, },
saveOriginCache: function(pv) { saveOriginCache: function(pv) {
set(KEY_PV, pv); set(KEY_PV, pv);
set(KEY_PV_TYPE, PvType.ORIGIN ); set(KEY_PV_SRC, Source.ORIGIN );
set(KEY_CREATION, new Date().toJSON() ); set(KEY_CREATION, new Date().toJSON() );
}, },
saveProxyCache: function(pv) { saveProxyCache: function(pv) {
set(KEY_PV, pv); set(KEY_PV, pv);
set(KEY_PV_TYPE, PvType.PROXY ); set(KEY_PV_SRC, Source.PROXY );
set(KEY_CREATION, new Date().toJSON() ); set(KEY_CREATION, new Date().toJSON() );
}, },
isOriginCache: function() { isFromOrigin: function() {
return get(KEY_PV_TYPE) == PvType.ORIGIN; return get(KEY_PV_SRC) == Source.ORIGIN;
}, },
isProxyCache: function() { isFromProxy: function() {
return get(KEY_PV_TYPE) == PvType.PROXY; return get(KEY_PV_SRC) == Source.PROXY;
}, },
isExpired: function() { isExpired: function() {
if (PvCache.isOriginCache() ) { if (PvCache.isFromOrigin() ) {
let date = new Date(get(KEY_CREATION)); let date = new Date(get(KEY_CREATION));
date.setDate(date.getDate() + 1); /* fetch origin-data every day */ date.setDate(date.getDate() + 1); /* update origin records every day */
return Date.now() >= date.getTime(); return Date.now() >= date.getTime();
} else if (PvCache.isProxyCache() ) { } else if (PvCache.isFromProxy() ) {
let date = new Date(get(KEY_CREATION) ); let date = new Date(get(KEY_CREATION) );
date.setHours(date.getHours() + 1); /* proxy-data is updated every hour */ date.setHours(date.getHours() + 1); /* update proxy records per hour */
return Date.now() >= date.getTime(); return Date.now() >= date.getTime();
} }
return false; return false;
@@ -151,7 +147,7 @@ var PvCache = (function() {
}, },
inspectKeys: function() { inspectKeys: function() {
if (localStorage.getItem(KEY_PV) == null if (localStorage.getItem(KEY_PV) == null
|| localStorage.getItem(KEY_PV_TYPE) == null || localStorage.getItem(KEY_PV_SRC) == null
|| localStorage.getItem(KEY_CREATION) == null) { || localStorage.getItem(KEY_CREATION) == null) {
localStorage.clear(); localStorage.clear();
} }
@@ -161,20 +157,33 @@ var PvCache = (function() {
})(); /* PvCache */ })(); /* PvCache */
function fetchOriginPageviews(pvData) { function fetchPageviews(fetchOrigin = true, filterOrigin = false) {
if (pvData === undefined) { /* pvCacheEnabled see: /assets/js/_pv-config.js */
if (pvCacheEnabled && fetchOrigin) {
fetch('/assets/js/data/pageviews.json')
.then(response => response.json())
.then(data => {
if (filterOrigin) {
if (PvCache.newerThan(data)) {
return; return;
} }
displayPageviews(pvData); }
PvCache.saveOriginCache(JSON.stringify(pvData)); displayPageviews(data);
PvCache.saveOriginCache(JSON.stringify(data));
})
.then(() => fetchProxyPageviews());
} else {
fetchProxyPageviews();
}
} }
function fetchProxyPageviews() { function fetchProxyPageviews() {
let proxy = JSON.parse(proxyData); /* see file '/assets/data/pv-data.json' */
$.ajax({ $.ajax({
type: 'GET', type: 'GET',
url: proxy.url, url: proxyEndpoint, /* see: /assets/js/_pv-config.js */
dataType: 'jsonp', dataType: 'jsonp',
jsonpCallback: "displayPageviews", jsonpCallback: "displayPageviews",
success: function(data, textStatus, jqXHR) { success: function(data, textStatus, jqXHR) {
@@ -192,41 +201,24 @@ $(function() {
if ($('.pageviews').length > 0) { if ($('.pageviews').length > 0) {
PvCache.inspectKeys(); PvCache.inspectKeys();
let cache = PvCache.getData(); let cache = PvCache.getData();
if (cache) { if (cache) {
displayPageviews(cache);
if (PvCache.isExpired()) { if (PvCache.isExpired()) {
if (PvCache.isProxyCache() ) { fetchPageviews(true, PvCache.isFromProxy());
let originPvData = pageviews ? JSON.parse(pageviews) : undefined;
if (originPvData) {
if (PvCache.newerThan(originPvData)) {
displayPageviews(cache);
} else { } else {
fetchOriginPageviews(originPvData);
}
}
fetchProxyPageviews(); if (PvCache.isFromOrigin()) {
fetchPageviews(false);
} else if (PvCache.isOriginCache() ) {
fetchOriginPageviews(originPvData);
fetchProxyPageviews();
}
} else { /* still valid */
displayPageviews(cache);
if (PvCache.isOriginCache() ) {
fetchProxyPageviews();
} }
} }
} else { } else {
let originPvData = pageviews ? JSON.parse(pageviews) : undefined; fetchPageviews();
fetchOriginPageviews(originPvData);
fetchProxyPageviews();
} }
} }

View File

@@ -8,37 +8,41 @@
$(function() { $(function() {
function timeago(date, isLastmod) { function timeago(iso, isLastmod) {
var now = new Date(); let now = new Date();
var past = new Date(date); let past = new Date(iso);
var seconds = Math.floor((now - past) / 1000);
var year = Math.floor(seconds / 31536000); if (past.getFullYear() != now.getFullYear()) {
if (year >= 1) { toRefresh -= 1;
return year + " year" + (year > 1 ? "s" : "") + " ago"; return past.toLocaleString("en-US", {
year: 'numeric',
month: 'short',
day: 'numeric'
});
} }
var month = Math.floor(seconds / 2592000); if (past.getMonth() != now.getMonth()) {
if (month >= 1) { toRefresh -= 1;
return month + " month" + (month > 1 ? "s" : "") + " ago"; return past.toLocaleString("en-US", {
month: 'short',
day: 'numeric'
});
} }
var week = Math.floor(seconds / 604800); let seconds = Math.floor((now - past) / 1000);
if (week >= 1) {
return week + " week" + (week > 1 ? "s" : "") + " ago";
}
var day = Math.floor(seconds / 86400); let day = Math.floor(seconds / 86400);
if (day >= 1) { if (day >= 1) {
toRefresh -= 1;
return day + " day" + (day > 1 ? "s" : "") + " ago"; return day + " day" + (day > 1 ? "s" : "") + " ago";
} }
var hour = Math.floor(seconds / 3600); let hour = Math.floor(seconds / 3600);
if (hour >= 1) { if (hour >= 1) {
return hour + " hour" + (hour > 1 ? "s" : "") + " ago"; return hour + " hour" + (hour > 1 ? "s" : "") + " ago";
} }
var minute = Math.floor(seconds / 60); let minute = Math.floor(seconds / 60);
if (minute >= 1) { if (minute >= 1) {
return minute + " minute" + (minute > 1 ? "s" : "") + " ago"; return minute + " minute" + (minute > 1 ? "s" : "") + " ago";
} }
@@ -50,29 +54,30 @@ $(function() {
function updateTimeago() { function updateTimeago() {
$(".timeago").each(function() { $(".timeago").each(function() {
if ($(this).children("i").length > 0) { if ($(this).children("i").length > 0) {
var basic = $(this).text();
var isLastmod = $(this).hasClass('lastmod'); var isLastmod = $(this).hasClass('lastmod');
var node = $(this).children("i"); var node = $(this).children("i");
var date = node.text(); /* ISO Dates: 'YYYY-MM-DDTHH:MM:SSZ' */ var date = node.text(); /* ISO Date: 'YYYY-MM-DDTHH:MM:SSZ' */
$(this).text(timeago(date, isLastmod)); $(this).text(timeago(date, isLastmod));
$(this).append(node); $(this).append(node);
} }
}); });
if (vote == 0 && intervalId != undefined) { if (toRefresh == 0 && intervalId != undefined) {
clearInterval(intervalId); /* stop interval */ clearInterval(intervalId); /* stop interval */
} }
return vote; return toRefresh;
} }
var vote = $(".timeago").length; var toRefresh = $(".timeago").length;
if (vote == 0) {
if (toRefresh == 0) {
return; return;
} }
if (updateTimeago() > 0) { /* run immediately */ if (updateTimeago() > 0) { /* run immediately */
vote = $(".timeago").length; /* resume */ var intervalId = setInterval(updateTimeago, 60000); /* run every minute */
var intervalId = setInterval(updateTimeago, 60000); /* loop every minutes */
} }
}); });

View File

@@ -42,19 +42,16 @@ const include = [
/* The posts of first Home page and recent update list */ /* The posts of first Home page and recent update list */
{% assign post_list = "" | split: "" %} {% assign post_list = "" | split: "" %}
{% assign sum = 0 %}
{% for post in site.posts %} {% for post in site.posts limit: site.paginate %}
{% assign post_list = post_list | push: post.url %} {% capture post_url %}{{ post.url | relative_url }}{% endcapture %}
{% assign sum = sum | plus: 1 %} {% assign post_list = post_list | push: post_url %}
{% if sum >= site.paginate %}
{% break %}
{% endif %}
{% endfor %} {% endfor %}
{% include update-list.html %} {% include update-list.html %}
{% for item in update_list %} {% for item in update_list %}
{% assign url = item | split: "::" | last | prepend: "/posts/" | append: "/" %} {% assign url = item | split: "::" | last | url_encode | prepend: "/posts/" | append: "/" | relative_url %}
{% assign post_list = post_list | push: url %} {% assign post_list = post_list | push: url %}
{% endfor %} {% endfor %}
@@ -106,6 +103,9 @@ const include = [
]; ];
const exclude = [ const exclude = [
'/assets/js/data/pv-cache.js', {%- if site.google_analytics.pv.proxy_url and site.google_analytics.pv.enabled -%}
'{{ site.google_analytics.pv.proxy_url }}',
{%- endif -%}
'/assets/js/data/pageviews.json',
'/img.shields.io/' '/img.shields.io/'
]; ];

View File

@@ -1,11 +0,0 @@
---
layout: compress
---
{%- capture pv_data -%}
{%- if site.google_analytics.pv.cache and site.google_analytics.pv.enabled -%}
{% include_relative _pageviews.json %}
{%- endif -%}
{%- endcapture -%}
const pageviews = '{{ pv_data }}';

View File

@@ -10,9 +10,8 @@ layout: compress
"categories": "{{ post.categories | join: ', '}}", "categories": "{{ post.categories | join: ', '}}",
"tags": "{{ post.tags | join: ', ' }}", "tags": "{{ post.tags | join: ', ' }}",
"date": "{{ post.date }}", "date": "{{ post.date }}",
{% assign _content = post.content %} {% include no-linenos.html content=post.content %}
{% include no-linenos.html %} "snippet": "{{ content | strip_html | strip_newlines | remove_chars | escape | truncate: 300 | replace: '\', '\\\\' }}"
"snippet": "{{ _content | strip_html | strip_newlines | remove_chars | escape | truncate: 300 | replace: '\', '\\\\' }}"
}{% unless forloop.last %},{% endunless %} }{% unless forloop.last %},{% endunless %}
{% endfor %} {% endfor %}
] ]

View File

@@ -14,15 +14,15 @@
## 目录 ## 目录
* [功能](#功能) * [功能](#功能)
* [安装](#安装) * [安装](#安装)
* [运行指南](#运行指南) * [使用](#使用)
* [参与贡献](#参与贡献) * [参与贡献](#参与贡献)
* [感谢](#感谢) * [感谢](#感谢)
* [赞助](#赞助) * [赞助](#赞助)
* [许可证书](#许可证书) * [许可证书](#许可证书)
## 功能 ## 功能
* 文章置顶 * 文章置顶
* 可配置的全局主题颜色 * 可配置的全局主题颜色
@@ -43,11 +43,26 @@
## 安装 ## 安装
### 准备工作 [Fork **Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/fork),然后克隆到本地:
按照 [Jekyll 官方文档](https://jekyllrb.com/docs/installation/) 完成基础环境的安装 (`Ruby``RubyGem``Bundler`)。 ```terminal
$ git clone git@github.com:<username>/jekyll-theme-chirpy -b master --single-branch
```
为了使用项目内免费提供的脚本工具增进写作体验,如果你的机器系统是 Debian 或者 macOS则需要确保安装了 [GNU coreutils](https://www.gnu.org/software/coreutils/)。否则,通过以下方式获得: ### 设置本地环境
如果你想在本地运行或构建, 参考 [Jekyll Docs](https://jekyllrb.com/docs/installation/)安装 `Ruby` `RubyGems``Bundler`
首次运行或构建时, 请先安装 Jekyll plugins。在项目根目录运行
```terminal
$ bundle install
```
`bundle` 会自动安装 `Gemfile` 内指定的依赖插件。
另外,为了生成一些额外的文件( Post 的分类、标签以及更新时间列表),需要用到一些脚本工具。如果你电脑的操作系统是 Debian 或者 macOS请确保已经安装了[GNU coreutils](https://www.gnu.org/software/coreutils/),否则,通过以下方式完成安装:
* Debian * Debian
@@ -61,90 +76,42 @@
$ brew install coreutils $ brew install coreutils
``` ```
接着,[fork](https://github.com/cotes2020/jekyll-theme-chirpy/fork) 一份代码,然后克隆你 Fork 的仓库到本地机器上。
## 使用
运行 [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/) 需要一些额外的文件, 它们不能通过 Jekyll 原生的命令生成,所以请严格依照下列说明去运行或部署此项目。
### 初始化
在项目根目录,开始初始化:
```console ```console
$ git clone git@github.com:USER/jekyll-theme-chirpy.git -b master $ bash tools/init.sh
``` ```
把上述的`USER` 替换为你的 GitHub username > 如果你不打算部署到 GitHub Pages, 在上述命令后附加参数选项 `--no-gh`
上述脚本完成了以下工作:
### 安装 Jekyll 插件 1. 从你的仓库中删除了:
- `.travis.yml`
- `.github` 下的文件和目录
- `_posts` 下的文件
- `docs` 目录
本地首次运行或编译,请在项目根目录下运行: 2. 配置了 GitHub Actions把 `.github/workflows/` 的文件 `pages-deploy.yml.hook` 重命名为 `pages-deploy.yml`。
```terminal
$ bundle install
```
`bundle` 命令会自动安装 `Gemfile` 内声明的依赖插件.
## 运行指南
### 文件目录
下面是主要的文件目录:
```sh
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
```
你需要将以下文件或目录删除:
- .travis.yml
- .github
3. 自动提交一个 Commit 以保存文件的更改。
### 配置文件 ### 配置文件
根据个人需要去修改 `_config.yml` 的变量,大部分都有注释介绍用法。 根据个人需要去修改 `_config.yml` 的变量,大部分都有注释介绍用法。典型的几个选项是:
* `url` * `url`
定义网站 URL注意结尾不带 `/`。格式: `<protocol>://<domain>`.
* `avatar` * `avatar`
定义头像,示例的文件放置在:`/assets/img/sample/avatar.jpg`. 把它换成你自己的头像,路径不限定,越小越好。(压缩图像体积可上这个网站:*<https://tinypng.com/>* ).
* `timezone` * `timezone`
定义时区 ,默认为 `亚洲/上海`,如果肉身翻墙要换城市可在此列表找到: [TimezoneConverter](http://www.timezoneconverter.com/cgi-bin/findzone/findzone) 或者 [Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones).
* `theme_mode` * `theme_mode`
定义颜色方案,有三种可选::
- **dual** - 自动跟随系统的 `深色`/`浅色` 设置,当系统或者浏览器不支持深色模式,则默认显示为浅色模式。无论如何,侧边栏左下角都会显示一个颜色切换按钮。
- **dark** - 全程深色模式。
- **light** - 全程浅色模式。
### 本地运行 ### 本地运行
使用以下工具可轻松运行: 使用以下工具可轻松运行:
@@ -157,24 +124,30 @@ $ bash tools/run.sh
如果你想在本地服务运行后,把修改源文件的更改实时刷新,可使用选项 `-r` (或 `--realtime`),不过要先安装依赖 [**fswatch**](http://emcrisostomo.github.io/fswatch/) 。 如果你想在本地服务运行后,把修改源文件的更改实时刷新,可使用选项 `-r` (或 `--realtime`),不过要先安装依赖 [**fswatch**](http://emcrisostomo.github.io/fswatch/) 。
### 部署到 GitHub Pages
### 部署
部署开始前,把 `_config.yml` 的 `url` 改为 `https://<username>.github.io`(或者你的私有域名,如:`https://yourdomain.com`)。另外,如果你想使用 [Project 类型网站](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites),修改配置文件的 `baseurl` 为项目名称,以斜杠开头,如:`/project`。 部署开始前,把 `_config.yml` 的 `url` 改为 `https://<username>.github.io`(或者你的私有域名,如:`https://yourdomain.com`)。另外,如果你想使用 [Project 类型网站](https://help.github.com/en/github/working-with-github-pages/about-github-pages#types-of-github-pages-sites),修改配置文件的 `baseurl` 为项目名称,以斜杠开头,如:`/project`。
#### 方法 1: 由 GitHub Pages 生成站点 假设你已经完成了 [初始化](#初始化),现在你可以选择下列其中一个方式去站点部署。
依照本方法,你可以直接把源码推送到远端仓库。 #### 部署到 GitHub Pages
> **注**: 如果你想使用任何不在这个[列表](https://pages.github.com/versions/)上的插件,越过此方法,直接看 [*方法 2: 本地构建*](#方法-2-本地构建). 由于安全原因GitHub Pages 的构建强制加了 `safe`参数,这导致了我们不能使用脚本工具去创建所需的附加页面。因此,我们可以使用 GitHub Actions 去构建站点,把站点文件存储在一个新分支上,再指定该分支作为 Pages 服务的源。
**1**. 仓库改名为: 1. 推送任意一个 commit 到 `origin/master` 以触发 GitHub Actions workflow。一旦 build 完毕,远端将会自动出现一个新分支 `gh-pages` 用来存储构建的站点文件。
|站点类型 | 仓库名称| 2. 除非你是使用 project 站点, 否则重命名你的仓库为 `<username>.github.io`。
|:---|:---|
|User or Organization | `<username>.github.io`|
|Project| `<username>.github.io` 以外的名字,譬如 `project`|
**2**. 提交本地更改,然后运行: 3. 选择分支 `gh-pages` 作为 GitHub Pages 的源.
4. 按照 GitHub 指示的地址去访问你的网站。
#### 部署到其他 Pages 平台
在 GitHub 之外的平台,例如 GitLab就没法享受 **GitHub Actions** 的便利了。不过先别慌,可以通过工具来弥补这个遗憾。
先把本地仓库的 upstream 改为新平台的仓库地址,推送一发。以后每次更新内容后,提交 commit ,然后运行:
```console ```console
$ bash tools/publish.sh $ bash tools/publish.sh
@@ -191,50 +164,17 @@ $ bash tools/publish.sh
[INFO] Published successfully! [INFO] Published successfully!
``` ```
**3**. 到 GitHub 网页为该项目开启 Pages 服务。 最后,根据平台的说明文档为项目开启 Pages 服务。
**4**. 网站将运行在: #### 部署到私人服务器
|站点类型 | 网站 URL | 在项目更目录,运行:
|:---|:---|
|User or Organization | `https://<username>.github.io/`|
|Project| `https://<username>.github.io/project/`|
#### 方法 2: 本地构建
由于安全原因GitHub Pages 不允许第三方插件运行,如果你想突破规则,就要本地构建站点内容。
**1**. 到 GitHub 网页,创建一个新的仓库,根据以下规则命名:
|站点类型 | 仓库名称|
|:---|:---|
|User or Organization | `<username>.github.io`|
|Project| `<username>.github.io` 以外的名字, 例如 `project`|
然后 Clone 新仓库到本地。
**2**. 构建站点:
```console ```console
$ bash tools/build.sh -d /path/to/local/project/ $ bash tools/build.sh -d /path/to/site/
``` ```
> `project` 为新仓库名称。
生成的静态文件将会在 `/path/to/local/project`. 把新仓库的修改提交并推送到远端 `master` 分支. 生成的静态文件将会在 `/path/to/site/` 把内部的文件上传到服务器即可。
**3**. 回到 GithHub 网页,为该仓库开启 Pages 服务。
**4**. 网站将运行在:
|站点类型 | 站点 URL |
|:---|:---|
|User or Organization | `https://<username>.github.io/`|
|Project| `https://<username>.github.io/project/`|
#### 结束工作
无论你选择了哪种方式部署网站到 GitHub Pages, 请开启 `HTTPS` 功能。具体细节参考官方说明:[Securing your GitHub Pages site with HTTPS](https://help.github.com/en/github/working-with-github-pages/securing-your-github-pages-site-with-https)。
### 文档 ### 文档
@@ -249,12 +189,12 @@ $ bash tools/build.sh -d /path/to/local/project/
这个主题的开发主要基于 [Jekyll](https://jekyllrb.com/) 生态、[Bootstrap](https://getbootstrap.com/)、[Font Awesome](https://fontawesome.com/) 和其他一些出色的工具 (相关文件中可以找到这些工具的版权信息). 这个主题的开发主要基于 [Jekyll](https://jekyllrb.com/) 生态、[Bootstrap](https://getbootstrap.com/)、[Font Awesome](https://fontawesome.com/) 和其他一些出色的工具 (相关文件中可以找到这些工具的版权信息).
:tada:感谢所有参与代码贡献的小伙伴, 他们的 GayHub ID 在这个[列表](https://github.com/cotes2020/jekyll-theme-chirpy/graphs/contributors)。 另外, 提交过 issues(或者未被合并 PR) 的高富帅和白富美也不会被遗忘,他/她们帮助报告 bug、分享新点子或者启发了我写出更通俗易懂的文档。 :tada: 感谢所有参与代码贡献的小伙伴, 他们的 GayHub ID 在这个[列表](https://github.com/cotes2020/jekyll-theme-chirpy/graphs/contributors)。 另外, 提交过 issues(或者未被合并 PR) 的高富帅和白富美也不会被遗忘,他/她们帮助报告 bug、分享新点子或者启发了我写出更通俗易懂的文档。
## 赞助 ## 赞助
如果您喜欢这个主题或者它对您有帮助,请考虑打赏作者:在 [项目主页](https://github.com/cotes2020/jekyll-theme-chirpy) 点击按钮 <kbd>:heart:Sponsor</kbd> 选择适合的链接即可完成(国内一般选第二个链接,支付宝/微信赞助),您的打赏将会极大地鼓励作者,并帮助作者更好地维护项目! 如果您喜欢这个主题或者它对您有帮助,请考虑打赏作者:在 [项目主页](https://github.com/cotes2020/jekyll-theme-chirpy) 点击按钮 <kbd>:heart: Sponsor</kbd> 选择适合的链接即可完成(国内一般选第二个链接,支付宝/微信赞助),您的打赏将会极大地鼓励作者,并帮助作者更好地维护项目!
## 许可证书 ## 许可证书

View File

@@ -86,14 +86,11 @@ main() {
opt="$1" opt="$1"
case $opt in case $opt in
-b|--baseurl) -b|--baseurl)
_check_unset $2 local _baseurl="$2"
if [[ $2 == \/* ]] if [[ -z "$_baseurl" ]]; then
then _baseurl='""'
CMD+=" -b $2"
else
_help
exit 1
fi fi
CMD+=" -b $_baseurl"
shift shift
shift shift
;; ;;

43
tools/deploy.sh Executable file
View File

@@ -0,0 +1,43 @@
#!/bin/bash
#
# Deploy the content of _site to 'origin/<pages_branch>'
#
# v2.5
# https://github.com/cotes2020/jekyll-theme-chirpy
# © 2020 Cotes Chung
# Published under MIT License
set -eu
PAGES_BRANCH="gh-pages"
_no_branch=false
if [[ -z `git branch -av | grep $PAGES_BRANCH` ]]; then
_no_branch=true
git checkout -b $PAGES_BRANCH
else
git checkout $PAGES_BRANCH
fi
mv _site ../
mv .git ../
rm -rf * && rm -rf .[^.] .??*
mv ../_site/* .
mv ../.git .
git config --global user.name "GitHub Actions"
git config --global user.email "41898282+github-actions[bot]@users.noreply.github.com"
git update-ref -d HEAD
git add -A
git commit -m "[Automation] Site update No.${GITHUB_RUN_NUMBER}"
if [[ $_no_branch = true ]]; then
git push -u origin $PAGES_BRANCH
else
git push -f
fi

89
tools/init.sh Executable file
View File

@@ -0,0 +1,89 @@
#!/bin/bash
#
# Init the evrionment for new user.
#
# v2.5
# https://github.com/cotes2020/jekyll-theme-chirpy
# © 2020 Cotes Chung
# Published under MIT License
set -eu
ACTIONS_WORKFLOW=pages-deploy.yml
help() {
echo "Usage:"
echo
echo " bash /path/to/init.sh [options]"
echo
echo "Options:"
echo " --no-gh Do not deploy to Github."
echo " -h, --help Print this help information."
}
check_init() {
local _has_inited=false
if [[ -d .github ]]; then
if [[ -f .github/workflows/$ACTIONS_WORKFLOW
&& $(find .github/workflows/ -type f -name "*.yml" | wc -l) == 1 ]]; then
_has_inited=true
fi
else
_has_inited=true
fi
if [[ $_has_inited = true ]]; then
echo "Already initialized."
exit 0
fi
}
init_files() {
if [[ $_no_gh = true ]]; then
rm -rf .github
else
mv .github/workflows/$ACTIONS_WORKFLOW.hook .
rm -rf .github
mkdir -p .github/workflows
mv ./${ACTIONS_WORKFLOW}.hook .github/workflows/${ACTIONS_WORKFLOW}
fi
rm -f .travis.yml
rm -rf _posts/* docs
git add -A && git add .github -f
git commit -m "[Automation] Initialize the environment." -q
echo "[INFO] Initialization successful!"
}
check_init
_no_gh=false
while (( $# ))
do
opt="$1"
case $opt in
--no-gh)
_no_gh=true
shift
;;
-h|--help)
help
exit 0
;;
*)
# unknown option
help
exit 1
;;
esac
done
init_files

View File

@@ -19,7 +19,7 @@ check_status() {
local _change=$(git status . -s) local _change=$(git status . -s)
if [[ ! -z ${_change} ]]; then if [[ ! -z ${_change} ]]; then
echo "Warning: Commit the changes of the changes first:" echo "Warning: Commit the following changes first:"
echo "$_change" echo "$_change"
exit 1 exit 1
fi fi
@@ -29,8 +29,6 @@ check_status() {
update_files() { update_files() {
bash _scripts/sh/create_pages.sh bash _scripts/sh/create_pages.sh
bash _scripts/sh/dump_lastmod.sh bash _scripts/sh/dump_lastmod.sh
find . | grep -E "(__pycache__|\.pyc|\.pyo$)" | xargs rm -rf
} }

View File

@@ -16,10 +16,11 @@
set -eu set -eu
WORK_DIR=$(dirname $(dirname $(realpath "$0"))) WORK_DIR=$(dirname $(dirname $(realpath "$0")))
URL_FILE=${WORK_DIR}/assets/data/proxy.json URL_FILE=${WORK_DIR}/_config.yml
PV_CACHE=${WORK_DIR}/assets/data/pageviews.json PV_CACHE=${WORK_DIR}/assets/js/data/pageviews.json
PROXY_URL=$(grep "proxy_endpoint:" $URL_FILE | sed "s/.*: '//g;s/'.*//")
PROXY_URL=$(jq -r '.proxyUrl' $URL_FILE)
wget $PROXY_URL -O $PV_CACHE wget $PROXY_URL -O $PV_CACHE
echo "ls $PV_CACHE"