【Hexo Site Customization】The Original Intention / Cost / Tool / Theme

Kisaragi
3 min readOct 12, 2020

Personal Blog: ksrgtech.com

Original link of this article:【Hexo Site Customization】The Original Intention / Cost / Tool / Theme

This article in total has 4 parts.

  1. Why Build A Website?
  2. The Cost Of Building A Website
  3. Tools I used To Build The Website
  4. Choose A Nice Theme And Customize It

Why Build A Website?

The original intention of the website is to record and share, to record the process of learning new things and the experience that comes along, and also to share it with the readers who have the same interests.

I’m not a computer science student. I only have a basic programming background. I learned a bit about the front-end and back-end of Web, but the knowledge I have is not enough for me to program independently. There could be bugs here and there, but please please bare with me~

The Cost Of Building A Website

[Receipt from Godaddy] Img By Author

From the perspective of a student with limited budget, of course, the less the expense, the better.

So far, the only thing that I had spent money on is this domain (ksrgtech.com) I purchased from GoDaday . After the first two years, it will be renewed at 115 yuan(CNY) per year.

In the future, I may need to pay for CDN services to speed up the loading of the site if there are more articles, pictures and visitors. However, for now, the free trial on Cloudinary is enough for me.

Tools I used To Build The Website

When I fisrt started to learn about the website building, I found a bunch of helpful websites and tools for beginners with little programming knowledge, such as WordPressSquareSpaceWix, etc.

But for people like me who don’t mind efforts and troubles and have many custom ideas to implement, I strongly recommend Hexo+ GitHub Pages

Hexo is a blog framework. With the help of the blog framework, you wouldn’t need to modify HTML files page by page for it can quickly generate a bunch of static HTML pages based on the template files we have written so it saves us a lot of time and efforts.

The main reason why I use GitHub Pages is to save money on the server. Every user can have a free domain ended with “github.io”.

As for how to actually build a website. You may find the following two blogs quite helpful.

How I coped with 404

Go to the setting in your repository

  1. Repository name should be [username] github.io. Don’t use other names.
  2. The source directory for GitHub pages should be [master].

Choose A Nice Theme And Customize It

It is too troublesome to write a theme from scratch. I found a theme called Chic on the official site of Hexo. The theme is close to what I want, so I plan to make custom modification based on this theme.

Before

Home page of the original Chic theme

After

Home page of my personal site

It doesn’t seem to have changed much just from the photos😂

I have made the following changes based on the original Chic theme

  • Modification of the text, links and icons of the homepage
  • Custom modification on article page
  • Creat and custom modify the category page
  • Creat and custom modify the tag page
  • Creat and custom modify the about page
  • Creat the Chinese pages

Upcoming features

  • Comment
  • Search
  • RSS

One more thing before I start the series [Hexo Custom Site Building], I wanna recommend to you guys this editor I used for programming.

Visual Studio Code for both code and markdown editing.

Because it is too powerful and user-friendly, I feel there is no need to look for other tools.

To be continued…

--

--

Kisaragi

A student study in Statistics, Mathematics, Machine Learning and Deep learning.