curben
/
blog
mirror of https://gitlab.com/curben/blog
1
0
Fork 0
Code Issues Releases Wiki Activity

Remove repo links 

Edit from your repo, not upstream's
This commit is contained in:
curben 2018-09-25 13:07:42 +09:30
parent e5fa7d8cc3
commit 93b4319cdc
1 changed files with 18 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
source/_posts/how-to-create-a-hexo-blog.md
View File

@ -5,14 +5,14 @@ tags:
--- ---
Create a website/blog (hosted by [GitLab](https://about.gitlab.com/features/pages/) for free) using the following guide: Create a website/blog (hosted by [GitLab](https://about.gitlab.com/features/pages/) for free) using the following guide:
<!-- more --> <!-- more -->
## Create a new GitLab project ## GitLab project
1. Register a free [GitLab](https://gitlab.com/users/sign_in#register-pane) account or use your current one. 1. Register a free [GitLab](https://gitlab.com/users/sign_in#register-pane) account or use your current one.
2. Fork this project. 2. Fork this project.
3. Ensure Shared Runners is enabled. Go to your (forked) project `Settings -> CI / CD -> Shared Runners`. 3. Shared Runners should be enabled. Go to your (forked) project `Settings -> CI / CD -> Shared Runners`.
4. Change project website to a user website. This is so that the website's home page is `<your-username>.gitlab.io/`, instead of `<your-username>.gitlab.io/hexo`. 4. Change project website to a user website. This is so that the website's home page is `<your-username>.gitlab.io/`, instead of `<your-username>.gitlab.io/hexo`.
Go to `Settings -> General -> Advanced -> Rename repository`. Change the Path to `<your-username>.gitlab.io`. Go to `Settings -> General -> Advanced -> Rename repository`. Change the Path to `<your-username>.gitlab.io`.
5. If you just want to use a similar layout as this blog, or you're not planning to customize it, you don't have to [install](#installation) Hexo. You still need to change the blog's name and favicon though ([how-to](#naming). 5. You can start writing a new post straightaway without [installing](#installation) Hexo. You still need to change the blog's name and favicon though ([how-to](#naming).
1. To create a new post (*without* using [Hexo](https://hexo.io/docs/writing)), create a new `<post-title>.md` in the [source/_posts](source/_posts) folder. 1. To create a new post (through GitLab.com), create a new `<post-title>.md` file in `source/_posts` folder.
2. Start with the following header/[front-matter](https://hexo.io/docs/front-matter): 2. Start with the following header/[front-matter](https://hexo.io/docs/front-matter):
``` ```
--- ---
@ -23,15 +23,15 @@ Create a website/blog (hosted by [GitLab](https://about.gitlab.com/features/page
--- ---
``` ```
3. Write your post after the second `---` using [Markdown](https://about.gitlab.com/handbook/product/technical-writing/markdown-guide/) [style](https://docs.gitlab.com/ee/user/markdown.html). 3. Write your post after the second `---` using [Markdown](https://about.gitlab.com/handbook/product/technical-writing/markdown-guide/) [style](https://docs.gitlab.com/ee/user/markdown.html).
6. After you create a new post, the website would be available on `<your-username>.gitlab.io/` or the link shown on your project `Settings -> Pages`. 6. After you create a new post, the website can be accessed on `<your-username>.gitlab.io/` or the link shown on your project `Settings -> Pages`.
## Installation ## Installation
1. Having Hexo means you can debug locally, rather than waiting for gitlab runner. You can even run a local server to preview your blog (see step 6 below). 1. Having Hexo means you can debug locally, rather than waiting for [CI](https://docs.gitlab.com/ee/ci/). You can even run a local server to preview your blog (see step 6 below).
2. Clone this project to your workstation. Change `<folder>` to a preferred name. 2. Clone this project to your workstation. Change `<folder>` to a preferred name.
```bash ```bash
$ git clone https://gitlab.com/curben/curben.gitlab.io <folder> $ git clone https://gitlab.com/curben/curben.gitlab.io <folder>
``` ```
3. Install Node.js 10. 3. Install Node.js 10. Other distro, see this [guide](https://nodejs.org/en/download/package-manager/) or [here](https://github.com/nodesource/distributions).
```bash ```bash
# Installing npm will also install nodejs as dependency. # Installing npm will also install nodejs as dependency.
# Ubuntu 16.04 or newer # Ubuntu 16.04 or newer
@ -47,11 +47,10 @@ $ sudo yum -y install nodejs
# Arch Linux # Arch Linux
$ sudo pacman -S npm $ sudo pacman -S npm
``` ```
For other distro, see [here](https://nodejs.org/en/download/package-manager/) or [here](https://github.com/nodesource/distributions). 4. Install Hexo and its dependencies (defined in `package.json`). Re-launch the terminal program before continue.
4. Install Hexo and its dependencies (defined in [package.json](package.json)).
```bash ```bash
$ sudo npm install -g hexo-cli
$ cd <folder> $ cd <folder>
$ sudo npm install -g hexo-cli
$ npm install $ npm install
``` ```
5. Generate static files to check for any error. You should always do this before pushing/merging commits to the `master` branch. 5. Generate static files to check for any error. You should always do this before pushing/merging commits to the `master` branch.
@ -63,16 +62,16 @@ $ hexo generate
$ npm install hexo-server --save $ npm install hexo-server --save
$ hexo server $ hexo server
``` ```
7. Commit the changes and push them. The generated `public` and `node_modules` are [ignored](.gitnore), as GitLab runner will generate them by itself. 7. Commit the changes and push them. The generated `public` and `node_modules` are [ignored](https://gitlab.com/curben/curben.gitlab.io/blob/master/.gitignore), as CI will generate them during build.
8. Check the build status by going to your project `CI /CD -> Pipelines`. Due to the limitation of `hexo`, the build will always pass even when error occurred. Check the Jobs log, look for any error in `$ hexo deploy`. 8. Check the build status by going to your project `CI /CD -> Pipelines`. Due to the limitation of `hexo`, the build will always pass even when there is error. Check the Jobs log, look for any error after `$ hexo deploy`.
9. If there is no error, the generated website would be available on `<your-username>.gitlab.io/` or the link shown on your project `Settings -> Pages`. 9. If there is no error, the generated website can be accessed on `<your-username>.gitlab.io/` or the link shown on your project `Settings -> Pages`.
## Writing ## Writing
1. Create a new post (using Hexo) 1. Create a new post (using Hexo)
``` bash ``` bash
$ hexo new "My New Post" $ hexo new "My New Post"
``` ```
2. `My-New-Post.md` is saved to the [source/_posts](source/_posts) folder, with the following header/[front-matter](https://hexo.io/docs/front-matter): 2. `My-New-Post.md` is created to the `source/_posts` folder, with the following header/[front-matter](https://hexo.io/docs/front-matter):
``` ```
--- ---
title: My New Post title: My New Post
@ -88,14 +87,14 @@ To create a new page or more info: [Writing](https://hexo.io/docs/writing.html)
## Configuration ## Configuration
### Naming ### Naming
Change the website's author and name Change the website's author and name
[_config.yml](_config.yml): `_config.yml`:
```yml ```yml
title: title:
subtitle: subtitle:
description: description:
author: author:
``` ```
[themes/typing/_config.yml](themes/typing/_config.yml): `themes/typing/_config.yml`:
```yml ```yml
menu: menu:
GitLab: <your-gitlab-project-link> GitLab: <your-gitlab-project-link>
@ -107,8 +106,8 @@ description:
### Favicon ### Favicon
[RealFaviconGenerator](https://realfavicongenerator.net/) provides a web-based tool to generate favicons with wide compatibility. [RealFaviconGenerator](https://realfavicongenerator.net/) provides a web-based tool to generate favicons with wide compatibility.
1. Upload your favicon (at least 260x260) and configure however you want. 1. Upload your favicon (at least 260x260) and configure however you want.
1. Install the generated package to [favicons](themes/typing/source/favicons/) folder. 1. Install the generated package to `themes/typing/source` folder. Make you replace all existing files.
1. Edit [head.ejs](themes/typing/layout/_partial/head.ejs). Change the `color` values of `mask-icon` and `msapplication-TileColor` to the values you configured on the generator. 1. Edit `themes/typing/layout/_partial/head.ejs`. Change the `color` values of `mask-icon` and `msapplication-TileColor` to the values you configured on the generator.
1. Check for any error using `hexo generate` (you should do this *before* you push any commit). 1. Check for any error using `hexo generate` (you should do this *before* you push any commit).
1. Commit and push. 1. Commit and push.
1. Check your favicon with the [favicon checker](https://realfavicongenerator.net/favicon_checker). 1. Check your favicon with the [favicon checker](https://realfavicongenerator.net/favicon_checker).
@ -116,7 +115,7 @@ description:
### Project page ### Project page
If you prefer to have a project page on GitLab: If you prefer to have a project page on GitLab:
1. go to `Settings -> General -> Advanced -> Rename repository`. Change the Path to `<directory>`, so the website is available at `<your-username>.gitlab.io/<directory>`, `<directory>` can be any name, like `blog` or `hexo`. 1. go to `Settings -> General -> Advanced -> Rename repository`. Change the Path to `<directory>`, so the website is available at `<your-username>.gitlab.io/<directory>`, `<directory>` can be any name, like `blog` or `hexo`.
1. Edit [_config.yml](_config.yml), change the `root:` value from `""` to `"/<directory/"`. 1. Edit `_config.yml`, change the `root:` value from `""` to `"/<directory/"`.
1. Commit and push. 1. Commit and push.
### Remove fork relationship ### Remove fork relationship