Hugo Blog New Theme Docdock

Hugo 換新的 theme docdock , 會多 search, mermaid

Task list: 😄

• 初稿
• 再讀
• 筆記
• 完成

概述

docdock

主要的功能

• Search
• Unlimited menu levels
• RevealJS presentation from markdown (embededed or fullscreen page)
• Attachments files
• List child pages
• Include segment of content from one page in another (Excerpt)
• Automatic next/prev buttons to navigate through menu entries
• Mermaid diagram
• Icons, Buttons, Alerts, Panels, Tip/Note/Info/Warning boxes
• Image resizing, shadow…
• Customizable look and feel

安裝

基本上是用 submodule 安裝 theme，

設定檔用範例的，修改一下。

• 改配色 original-blue
• sidebar 加入 tags, categories, 不過可能還要再修一下
• search 正常運作
• 雙語？之後試
• emoji ok

已有功能

• [v] syntax highlight.js
• [v] emoji
• [v] mermaid flow chart
• [v] 直接連到 github 修改原始檔
• [v] Pic logo + Unsplash Source Logo
• [v] search

缺少功能？

• disqus
• 字數計算
• 相關內容, 文章
• tag , categories
• 讀完時間 reading-time
• 改 dark theme

功能範例

highlight.js DEMO

Shortcode

Alert

attachments

建 page 同名的 page.file 目錄，下面可以放檔案

button

go to google Success Info Warning Danger ! Danger !

children

例出下屬的 children 頁面列表，可以作出卡片式的 列表。

excerpt

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

excerpt-include

從檔案引用內容

expand

可收起隱藏內容

icon

Mermaid

Notice

Note

Info

Tip

Warning

panel

可以把一些內容加框

revealjs

reveal.js Slide

參考連結

1. docdock
2. hugo-theme-learn
3. mermaid