github-style

已知问题

• 多个可点击元素点击后会出现蓝色的边框
• 移动端模式下点击热力图可能会导致样式错乱

TODO

• 评论
• 自定义菜单
• 更多链接平台支持
• 热力图和底部列表的时区问题

Init hugo site

hugo new site mysite
cd mysite

Install the theme

git submodule add [email protected]:MeiK2333/github-style.git themes/github-style

Update the theme

If you just installed the theme, it is already in the latest version. If not, you can update using the below commands

cd themes/github-style
git pull

Then, you need to rename the previous

posts

post

cd 
mv content/posts content/post

Setup readme

hugo new readme.md
echo '`Hello World!`' > content/readme.md

Pin post

---
pin: true
---

Add new post

Hugo will create a post with

draft: true

hugo new post/title_of_the_post.md

Limit display content

Approch 1: use summary

---
title: "title"
date: 2019-10-22T18:46:47+08:00
draft: false
summary: "The summary content"
---

Approch 2: use

Use

```

title: "title" date: 2019-10-22T18:46:47+08:00

draft: false

abstraction show in the post page <!--more--> other content ```

add last modified data

add to

config.toml

lastmod = true

[frontmatter]
  lastmod = ["lastmod", ":fileModTime", ":default"]

Support LaTex

In you post add

math: true

---
katex: math
---

Then the katex script will auto render the string enclosed be delimiters.

# replace ... with latex formula
display inline \\( ... \\)
display block $$ ... $$

config.toml example

baseURL = "https://meik2333.com/"
languageCode = "zh-cn"
title = "MeiK's blog"
theme = "github-style"
googleAnalytics = "UA-123456-789"
pygmentsCodeFences = true
pygmentsUseClasses = true

[params]
  author = "MeiK"
  description = "In solitude, where we are least alone."
  github = "MeiK2333"
  facebook = "MeiK2333"
  twitter = "MeiK2333"
  linkedin = "MeiK2333"
  instagram = "MeiK2333"
  tumblr = "MeiK2333"
  email = "[email protected]"
  url = "https://meik2333.com"
  keywords = "blog, google analytics"
  rss = true
  lastmod = true
  favicon = "/images/github.png"
  location = "China"
  [[params.links]]
    title = "Link"
    href = "https://github.com/meik2333"
  [[params.links]]
    title = "Link2"
    href = "https://meik2333.com"
    icon = "https://meik2333.com/images/avatar.png"
[frontmatter]
  lastmod = ["lastmod", ":fileModTime", ":default"]

deploy.sh example

There are various way to deploy to github, here is a link to official document.

Here is an sample. Note line 22 have

env HUGO_ENV="production"

#!/bin/sh

if [ "git status -s" ]
then
    echo "The working directory is dirty. Please commit any pending changes."
    exit 1;
fi
echo "Deleting old publication"
rm -rf public
mkdir public
git worktree prune
rm -rf .git/worktrees/public/
echo "Checking out gh-pages branch into public"
git worktree add -B gh-pages public origin/gh-pages
echo "Removing existing files"
rm -rf public/*
echo "Generating site"
env HUGO_ENV="production" hugo -t github-style
echo "Updating gh-pages branch"
cd public && git add --all && git commit -m "Publishing to gh-pages (publish.sh)"
#echo "Pushing to github"
#git push --all

Then you can verify the site is working and use

git push --all

#git push --all