Polyfill with HTTPS 2024-12-28

Found the following

1

Mixed Content: The page at 'https://hanshushao.com/About/' was loaded over HTTPS, but requested an insecure script 'http://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?version=4.8.0'. This request has been blocked; the content must be served over HTTPS.

1

<script src="https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?version=4.8.0"></script>

Icon Showing Error 2024-12-27

While changing to the customized icon as follows, where every original icon is well inherited, occurred a icon showing error.

1
2

# //at.alicdn.com/t/c/font_1832207_c8i9n1ulxlt.css => 1832207_c8i9n1ulxlt
iconfont: # customized icon set ID

This may due to some update by iconfont , where the source link is changed from //at.alicdn.com/t/ to //at.alicdn.com/t/c/ , thus the reference does not refer to the correct file. Original code is as follows:

1
2
3
4
5
6
7
8
9

@font-face {
  font-family: 'ic';
  src: url('//at.alicdn.com/t/font_' + $iconfont + '.eot');
  src: url('//at.alicdn.com/t/font_' + $iconfont + '.eot?#iefix') format('embedded-opentype'),
  url('//at.alicdn.com/t/font_' + $iconfont + '.woff2') format('woff2'),
  url('//at.alicdn.com/t/font_' + $iconfont + '.woff') format('woff'),
  url('//at.alicdn.com/t/font_' + $iconfont + '.ttf') format('truetype'),
  url('//at.alicdn.com/t/font_' + $iconfont + '.svg#ic') format('svg');
}

1
2
3
4
5
6
7
8
9

@font-face {
  font-family: 'ic';
  src: url('//at.alicdn.com/t/c/font_' + $iconfont + '.eot');
  src: url('//at.alicdn.com/t/c/font_' + $iconfont + '.eot?#iefix') format('embedded-opentype'),
  url('//at.alicdn.com/t/c/font_' + $iconfont + '.woff2') format('woff2'),
  url('//at.alicdn.com/t/c/font_' + $iconfont + '.woff') format('woff'),
  url('//at.alicdn.com/t/c/font_' + $iconfont + '.ttf') format('truetype'),
  url('//at.alicdn.com/t/c/font_' + $iconfont + '.svg#ic') format('svg');
}

Comment Function 2024-12-23

LeanCloud

Sign up in LeanCloud, the create an application. In Setting/Keys , the AppId, AppKey, and ServerUrl could be found. Then edit the valine setting.

1
2
3
4

valine:
  appId: #AppId
  appKey: #Appkey
  serverURLs: #ServerUrl

Domain Provider

Then in the Domain / Custom domains , connect to xxx.hanshushao.com , it will show a Recommended DNS config . Set the recommended confid at the domain provider as follows:

Comment Management

Then visit https://Cloud_Engine_Name/sign-up to sign up as admin in order to manage the comments.

Code Block Align Problem 2024-12-18

The code block was aligned by a very weird way, first row of code and last row of index are indented by 1 character. By checking the element in html, it was found that the code block was indented by ::before . This is since the setting of pseudo-element pre::before is set with content: " " . By changing the following, the problem was solved.

1
2
3
4
5
6
7
8
9
10

td {
  position: relative;
  padding: unset;
  vertical-align: unset;
  border: unset;
  the-transition();
  pre::before {
    content: "";
  }
}

Categories Card 2024-12-17

Content in Card

The content in card, if no sub category, is sorted by title, which is not desired. Thus, the following change was applied to make the content in card sorted by date.

1
2

// cat.subs = cat.posts.sort({title: 1}).limit(6).toArray();
cat.subs = cat.posts.sort({date: -1}).limit(6).toArray();

Card Order in Home Page

Used a very silly method to make the order as desired.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

/*
At the end of 
if (categories && categories.length){}; 
in 
hexo.extend.generator.register('index', function(locals){};
*/

const card_order = ["Publication","Patent","Poetry"];
const cat_order = [];

for (let i = 0; i < card_order.length; i++) {
    for (let j = 0; j < catlist.length; j++) {
        if (card_order[i] == catlist[j].name) {
            cat_order.push(j);
        }
    }
}

const newcatlist = [];

for (let i = 0; i < catlist.length; i++) {
    newcatlist.push(catlist[cat_order[i]])
}

catlist = newcatlist

SSL Certificate 2024-12-17

Following the instruction of Certbot

1
2
3
4
5
6
7
8
9
10
11

# Install Certbot
sudo snap install --classic certbot

# Prepare the Certbot command
sudo ln -s /snap/bin/certbot /usr/bin/certbot

# Get and install certificates
sudo certbot --nginx

# Test automatic renewal
sudo certbot renew --dry-run

DNS Setting 2024-12-17

Log into the domain provider, adding record under DNS Setting

Set Git postBuffer 2024-12-16

Git writing objects too slow, at around 900 KiB/s. Found a solution in this post from Stack Overflow, thus changed the setting

1

git config --global http.postBuffer 524288000

• 500 MB: 524288000
• 1 GB: 1048576000
• 2 GB: 2097152000 (anything higher is rejected as 'out of range')

Hexo _config.yml Configuration 2024-12-16

1
2
3
4

deploy:
    type: git
    repo: git@XXX.XXX.XXX.XXX:/home/git/hexo.git
    branch: master

Server Preparation 2024-12-16

Basically following this blog

Setting Nginx

Install first

1

sudo apt install nginx

Then set nginx.conf

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

worker_processes  auto;

error_log  /var/log/nginx/error.log notice;
pid        /var/run/nginx.pid;

events {
    worker_connections  1024;
}

http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                    '$status $body_bytes_sent "$http_referer" '
                    '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    keepalive_timeout  65;

    #gzip  on;

    include /etc/nginx/conf.d/*.conf;
}

Then set default.conf

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

server {
    listen        80;
    listen   [::]:80;
    server_name  IP Address;

    location / {
        root   /mnt/blog; # The path of the blog
        index  index.html index.htm;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

Setting Git

Install Git

1

sudo apt install git

Setting Git User

1
2
3
4
5
6
7
8

# Add user
adduser git

# Edit permission
chmod 740 /etc/sudoers

# Edit sudoers file
vim /etc/sudoers

Adding git ALL=(ALL) ALL under root ALL=(ALL:ALL) ALL

1
2
3
4
5

# Edit permission
chmod 400 /etc/sudoers

# Set Password
sudo passwd git

Using SSH to connect without password

1
2
3
4
5
6
7

# Generate SSH Key
cd ~
cd .ssh
ssh-keygen
# Grant Permission
chmod 700 ~/.ssh
chmod 600 ~/.ssh/id_rsa 

1
2
3
4
5
6

# Set Permission
chmod 600 ~/.ssh/authorized_keys
chmod 700 ~/.ssh

# Ensure SSH files and dir has SELinux 
restorecon -Rv ~/.ssh 

Then the server can be connected by

1

ssh -v git@xxx.xxx.xxx.xxx

Setting Git Repository

1
2
3

cd ~
git init --bare hexo.git
vi ~/hexo.git/hooks/post-receive

1
2
3

chmod +x ~/hexo.git/hooks/post-receive
cd ~
sudo chmod -R 777 /mnt/blog

Change Polyfill Source 2024-12-16

The original polyfill at https://cdn.polyfill.io/v2/polyfill.js is extremely slow and unstable, changed it to polyfill from ClourFlare

1

<script src="http://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?version=4.8.0"></script>

Shoka Theme Customized Random Background Image 2024-12-15

Image stored in /blog/source/images/

Change Shoka's Image Gathering Path

1
2

# Change the following image storing path
const dir = './source/_data/' + theme.images + '/'

Generating images.yml

A python code that could get all images' name and then create images.yml including all images' path.

1
2
3
4
5
6
7
8
9
10
11
12
13
14

import os

images_list = os.listdir("./images/")
for i in range(len(images_list)):
    images_list[i] = "- /images/" + images_list[i]

file = open("images.yml","w")

for i in images_list:
    file.write(i)
    if i != images_list[-1]:
        file.write('\n') 

file.close()

Inherited Data from the Old Blog 2024-12-15

Inherited from the old blog.

Shoka Theme Installing 2024-12-15

Basically following the Shoka Theme Instruction

1
2

# cd blog
git clone https://github.com/amehime/hexo-theme-shoka.git ./themes/shoka

1
2

# /root/blog/_config.yml
theme: shoka

1
2
3
4
5
6

# hexo-renderer-multi-markdown-it
npm un hexo-renderer-marked --save
npm i hexo-renderer-multi-markdown-it --save

# hexo-autoprefixer
npm install hexo-autoprefixer --save

Hexo Installing 2024-12-15

1
2
3
4

npm install hexo-cli -g
hexo init blog
cd blog
npm install