hugo

Migrate Hugo blog repository (but delete all Git commits)

My real case Migrate repository from BitBucket to GitHub. I could delete Commit histories. What I’ve done Update .gitignore. Delete docs directory. Update netlify.toml [build] publish = "docs" command = "hugo --gc --minify" [context.production.environment] HUGO_VERSION = "0.87.0" rm -rf data #old dir structure rm -rf .git rm -rf theme/mainroad git init git submodule add git@github.com:Vimux/Mainroad.git themes/mainroad git config --global user.name atlex00 git config --global user.email ... git commit git push origin master --force

Images in Hugo blog: TL;DRs

Render static images Place your image file under static directory. E.g., static/cat1/my_image.png. Refer the image without static. e.g., /cat1/my_image.png. ![alt text](/cat1/my_image.png "This is a caption.") Add captions Using Markdown render hooks The main idea is, we can overwrite how to convert image lines in markdown into HTML by create the template file layouts/_default/_markup/render-image.html. I copied the logic from this page (Thank you, Sebastian!) If title is specified, render by <figcaption> tag.

Custom configuration, and inject JavaScript in posts

Motivation To enable TikZ in my note, I add a header in layout/partial/header.html at first. But this change injects the javascript lines into all my posts which don’t need to include the TikZ. So I want to inject JavaScript in case that I mark the post as “TikZ enabled”. How to Create a HTML template In layouts/partials/header.html. {{ if and .IsPage (eq (.Param "tikz") true) }} <link rel="stylesheet" type="text/css" href="https://tikzjax.com/v1/fonts.css"> <script src="https://tikzjax.

Install Go (Golang) from source

Environment I wrote this article while installing go on WSL. Install Go lang $ curl https://dl.google.com/go/go1.15.5.linux-amd64.tar.gz -o golang.tar.gz $ sudo tar -C /usr/local -xzf golang.tar.gz $ vim ~/.bashrc ## Add /usr/local/go/bin/ to path ## export PATH=/usr/local/go/bin:$PATH $ source ~/.bashrc ## Check $ go version go version go1.15.5 linux/amd64 Upgrade the version Just delete the current version like rm -rf /usr/local/go, and replace it with new version. Tips: Installing Hugo on this setup (on WSL) GCC and G++ are required (sudo apt install gcc g++).

Use a theme - Learn

The theme - Learn https://themes.gohugo.io/hugo-theme-learn/ When is it good? Write about a theme. hugo new site spec_page cd spec_page git init git submodule add https://github.com/matcornic/hugo-theme-learn.git themes/hugo-theme-learn echo "theme = \"hugo-theme-learn\"" >> config.toml hugo new general/test.md Memo: Your personal page https://github.com/gcushen/hugo-academic

Reference your own contents in Hugo

https://gohugo.io/content-management/cross-references/#use-ref-and-relref Refer another post Please delete a backquote (\) in the follwoing snippet. I added it because of a Hugo rendering issue. [text to be hyperlinked]({\{< ref "hugo/article.md" >}}) You don’t need to append contents in the reference. When you open this hugo document in local hugo server the link is referred as http://localhost:1313/hugo/article. When you open this hugo document on the hosted server, the link is referred as http://{{ your_base_URL_in_config.

Table Of Contents (TOC) in Hugo

Enabling TOC Here is the official document about TOC. When you want to enabling TOC feature in Hugo, add the following line in config.toml. Then, TOC will enabled at all posts. [Params] ... toc = true ... Configure TOC Here is the official document about TOC configurations. I don’t need to configure it detail enough, added the disription in config.toml. [markup] [markup.tableOfContents] startLevel = 2 endLevel = 4 ordered = false startLevel = 1: List to the TOC from #.

Mermaid - Intro how to use

What is Mermaid? Mermaid is a sequence diagram generator written in JavaScript. https://github.com/mermaid-js/mermaid Not only sequence diagrams, but Mermaid can also generate simple graphs. Sequence diagram Here is the simple snippet for beginners (slightly changed from official sample). Mainroad syntax: sequenceDiagram participant Alice participant Bob Alice->>Bob: Hello John, how are you? Bob-->>Alice: Great! sequenceDiagram: I want to draw sequenceDiagram participant Alice: There is a member of our protocol whose name is Alice.

Use Mermaind in Hugo

I think my solution here is not the best way to use Mermaid in Hugo. What is Mermaid? Mermaid is a sequence diagram generator written in Javascript. https://github.com/mermaid-js/mermaid Not only sequence diagrams, Mermaid can also generate simple graphs. Enabling Mermaid in Hugo - use mermaid-cli Failures I tried two patterns but I failed both cases. Make a template in the theme Mainroad. I’ve Tried to copy MathJax template but failed. But this is the simplest and useful, so I need to study Hugo more.

Set posts template in Hugo project

Tips - Change the template which generated by hugo new You can define a template in the file archetypes/default.md. Here is my sample. --- title: "{{ replace .Name "-" " " | title }}" date: {{ .Date }} categories: - "Draft" tags: - "dummy_tag" isCKJLanguage: false mathjax: false comments: false draft: true ---