f.weber/jekyll-theme-chirpy
Template
1
0
Fork 0
mirror of https://github.com/cotes2020/jekyll-theme-chirpy.git synced 2025-12-18 05:41:31 +00:00
Code Issues Packages Releases Activity

Updated Docs.

Browse Source
This commit is contained in:
Cotes Chung
2020-01-04 17:05:41 +08:00
parent 34836f7703
commit a812ded9cd
8 changed files with 355 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
_posts/2019-08-08-text-and-typography.md
View File

@@ -58,7 +58,7 @@ Click the hook will locate the footnote[^footnote].
## Image
![Desktop View](/assets/img/sample/mockup.png)
![Desktop View]({{ "/assets/img/sample/mockup.png" | relative_url }})
## Inline code

4
_posts/2019-08-08-write-a-new-post.md
View File

@@ -24,10 +24,6 @@ tags: [TAG]
> **Note**: The posts' ***layout*** has been set to `post` by default, so there is no need to add the variable ***layout*** in Front Matter block.
- **The TimeZone of Date**
To ensure that the posts' release date matches the city you live in, please modify the value of `timezone` in the file `_config.yml`. 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).
- **Categories and Tags**
The `categories` of each post is designed to contain up to two elements, and the number of elements in `tag` can be zero or infinite.

89
_posts/2019-08-09-getting-started.md
View File

@@ -9,12 +9,12 @@ tags: [getting started]
Follow the [Jekyll Docs](https://jekyllrb.com/docs/installation/) to complete the installtion of basic environment (Ruby, RubyGem, Bundler and Jekyll). In addition, to use the funny script tools, we also need to install [Python](https://www.python.org/downloads/)(version 3.5 or abover) and [ruamel.yaml](https://pypi.org/project/ruamel.yaml/).
Next, [fork](https://github.com/cotes2020/jekyll-theme-chirpy/fork) **Chirpy** and then clone your replicated repository locally.
Next, [fork](https://github.com/cotes2020/jekyll-theme-chirpy/fork) **Chirpy** and then clone your forked repo locally.
## Install Jekyll Plugins
Go to root directory of the repository and run the following:
Go to the root of repo and run:
```terminal
$ bundle install
@@ -36,7 +36,7 @@ jekyll-theme-chirpy/
├── _scripts
│ └── travis # CI stuff, remove it
├── .travis.yml # remove this, too
├── .github # remove
├── .github # remove it
├── assets
├── tabs
│   └── about.md # the ABOUT page
@@ -54,20 +54,34 @@ jekyll-theme-chirpy/
```
As mentioned above, some files or directories should be removed from your repo:
- .travis.yml
- .github
- _scripts/travis
## Configuration
Customize the variables in file `_config.yml` as needed.
* Avatar
The sample avatar is `/assets/img/sample/avatar.jpg`. It should be replaced by your own one. Notice that a huge image file will increase the load time of your site, so keep your avatar size as samll as possible(may be *<https://tinypng.com/>* will help).
## Atom Feed
* TimeZone
The Atom feed url of your site will be:
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).
```
<SITE_URL>/feed.xml
```
* Atom Feed
The `SITE_URL` was defined by variable `url` in file `_config.yml`.
The Atom feed url of your site will be:
```
<SITE_URL>/feed.xml
```
The `SITE_URL` was defined by variable `url` of `_config.yml`.
## Run Locally
@@ -86,43 +100,70 @@ Few days later, you may find that the file changes does not refresh in real time
## Deploying to GitHub Pages
Before the deployment begins, ensure the `url` in `_config.yml` has been set to `https://<username>.github.io`.
Before the deployment begins, ensure the `url` in file `_config.yml` has been set to `https://<username>.github.io`(or the custom domain, if you have. e.g. `https://yourdomain.com`).
### Option 1: Built by GitHub Pages
By deploying your site in this way, you can push the source code to GitHub repository directly.
By deploying the site in this way, you're allowed to push the source code directly to the remote.
> **Note**: If you want to add any third-party Jekyll plugins or custom scripts to your project, please refer to [*Option 2: Build locally*](#option-2-build-locally).
> **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**. Rename your repository as `<username>.github.io`.
**1**. Rename the repository to:
**2**. Commit the changes of your repository, then run the initialization script:
|Site Type | Repo's Name|
|:---|:---|
|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 initialization script:
```console
$ bash tools/init.sh
```
It will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts.
it will automatically generates the *Latest Modified Date* and *Categories / Tags* page for the posts.
**3**. Push the changes to `origin/master` then go to GitHub website and enable GitHub Pages service for the repository `<username>.github.io`.
**3**. Push the changes to `origin/master` then go to GitHub website and enable GitHub Pages service for the repo.
**4**. Visit `https://<username>.github.io` and enjoy.
**4**. Check it out:
|Site Type | Site URL |
|:---|:---|
|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 will not work. If you want to use any another third-party Jekyll plugins, **your have to build locally rather than on GitHub Pages**.
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**. On GitHub website, create a brand new repository with name `<username>.github.io` and then clone it locally.
**1**. Browse to GitHub website, create a brand new repo named:
**2**. Build your site by:
|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
$ bash tools/build.sh -d /path/to/<username>.github.io/
$ bash tools/build.sh -d /path/to/local/project/
```
The build results will be stored in the root directory of `<username>.github.io` and don't forget to push the changes of `<username>.github.io` to branch `master` on GitHub.
> If you prefer to the Project site, change `baseurl` of file `_config.yml` to your project name, starting with a slash. e.g. `/project`. Or, simply add argument `-b /project` behide the command above.
**3**. Go to GitHub website and enable GitHub Pages service for the new repository `<username>.github.io`.
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.
**4**. Visit `https://<username>.github.io` and enjoy.
**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/`|
and enjoy!

6
_posts/2019-08-11-customize-the-favicon.md
View File

@@ -10,11 +10,11 @@ In [**Chirpy**](https://github.com/cotes2020/jekyll-theme-chirpy/), the image fi
Whit a square image (PNG, JPG or GIF) in hand, open the site [*Favicon & App Icon Generator*](https://www.favicon-generator.org/) and upload your original image.
![upload-image](/assets/img/sample/upload-image.png)
![upload-image]({{ "/assets/img/sample/upload-image.png" | relative_url }})
Click button <kbd>Create Favicon</kbd> and wait a moment for the website to generate the icons of various sizes automatically.
![download-icons](/assets/img/sample/download-icons.png)
![download-icons]({{ "/assets/img/sample/download-icons.png" | relative_url }})
Download the generated package, unzip and delete the following two from the extracted files:
@@ -23,4 +23,4 @@ Download the generated package, unzip and delete the following two from the extr
Now, copy the rest image files (`.PNG` and `.ICO`) to cover the original one in folder `assets/img/favicons/`.
At last, don't forget to rebuild your site so that the icon becomes your custom edition.
Lastly, don't forget to rebuild your site so that the icon becomes your custom edition.