diff --git a/exampleSite/content/docs/advanced/_index.md b/exampleSite/content/docs/advanced/_index.md
index 7c291858..bade0671 100644
--- a/exampleSite/content/docs/advanced/_index.md
+++ b/exampleSite/content/docs/advanced/_index.md
@@ -1,6 +1,8 @@
 ---
 linkTitle: Advanced
 title: Advanced Topics
+prev: /docs/guide/shortcodes/tabs
+next: /docs/advanced/multi-language
 ---
 
 This section covers some advanced topics of the theme.
diff --git a/exampleSite/content/docs/advanced/multi-language.md b/exampleSite/content/docs/advanced/multi-language.md
index d1a62928..963ee954 100644
--- a/exampleSite/content/docs/advanced/multi-language.md
+++ b/exampleSite/content/docs/advanced/multi-language.md
@@ -1,6 +1,7 @@
 ---
 title: "Multi-language"
 weight: 1
+prev: /docs/advanced
 ---
 
 Hextra supports creating site with multiple languages using Hugo's [multilingual mode](https://gohugo.io/content-management/multilingual/).
diff --git a/exampleSite/content/docs/guide/_index.md b/exampleSite/content/docs/guide/_index.md
index db79cfa5..65c92bb2 100644
--- a/exampleSite/content/docs/guide/_index.md
+++ b/exampleSite/content/docs/guide/_index.md
@@ -1,6 +1,7 @@
 ---
 title: Guide
 weight: 2
+prev: /docs/getting-started
 next: /docs/guide/organize-files
 sidebar:
   open: true
diff --git a/exampleSite/content/docs/guide/diagrams.md b/exampleSite/content/docs/guide/diagrams.md
index 8c2ab2b2..2c543541 100644
--- a/exampleSite/content/docs/guide/diagrams.md
+++ b/exampleSite/content/docs/guide/diagrams.md
@@ -1,6 +1,7 @@
 ---
 title: Diagrams
 weight: 6
+next: /docs/guide/shortcodes
 ---
 
 Currently, Hextra supports [Mermaid](#mermaid) for diagrams.
diff --git a/exampleSite/content/docs/guide/markdown.md b/exampleSite/content/docs/guide/markdown.md
index 3d3e9c3c..740a3a27 100644
--- a/exampleSite/content/docs/guide/markdown.md
+++ b/exampleSite/content/docs/guide/markdown.md
@@ -46,7 +46,7 @@ Tables aren't part of the core Markdown spec, but Hugo supports them out-of-the-
 ### Code Blocks
 
 {{< cards >}}
-    {{< card link="/docs/guide/syntax-highlighting" title="Syntax Highlighting" icon="sparkles" >}}
+  {{< card link="../../guide/syntax-highlighting" title="Syntax Highlighting" icon="sparkles" >}}
 {{< /cards >}}
 
 ### Lists
diff --git a/exampleSite/content/docs/guide/organize-files.md b/exampleSite/content/docs/guide/organize-files.md
index c09b8e20..88a73bc3 100644
--- a/exampleSite/content/docs/guide/organize-files.md
+++ b/exampleSite/content/docs/guide/organize-files.md
@@ -1,6 +1,7 @@
 ---
 title: Organize Files
 weight: 1
+prev: /docs/guide
 ---
 
 ## Directory Structure
diff --git a/exampleSite/content/docs/guide/shortcodes/_index.md b/exampleSite/content/docs/guide/shortcodes/_index.md
index 2cafed00..7a06d3c5 100644
--- a/exampleSite/content/docs/guide/shortcodes/_index.md
+++ b/exampleSite/content/docs/guide/shortcodes/_index.md
@@ -1,6 +1,8 @@
 ---
 title: Shortcodes
 weight: 9
+prev: /docs/guide/diagrams
+next: /docs/guide/shortcodes/callout
 ---
 
 [Hugo Shortcodes](https://gohugo.io/content-management/shortcodes/) are simple snippets inside your content files calling built-in or custom templates.
@@ -9,7 +11,7 @@ Hextra provides a collection of beautiful shortcodes to enhance your content.
 
 
 {{< cards >}}
-  {{< card link="callouts" title="Callouts" icon="warning" >}}
+  {{< card link="callout" title="Callout" icon="warning" >}}
   {{< card link="cards" title="Cards" icon="card" >}}
   {{< card link="filetree" title="FileTree" icon="folder-tree" >}}
   {{< card link="icon" title="Icon" icon="badge-check" >}}
diff --git a/exampleSite/content/docs/guide/shortcodes/callouts.md b/exampleSite/content/docs/guide/shortcodes/callout.md
similarity index 96%
rename from exampleSite/content/docs/guide/shortcodes/callouts.md
rename to exampleSite/content/docs/guide/shortcodes/callout.md
index 5e496bef..3bd3513d 100644
--- a/exampleSite/content/docs/guide/shortcodes/callouts.md
+++ b/exampleSite/content/docs/guide/shortcodes/callout.md
@@ -1,10 +1,15 @@
 ---
 title: Callout Component
 linkTitle: Callout
+aliases:
+- callouts
+prev: /docs/guide/shortcodes
 ---
 
 A built-in component to show important information to the reader.
 
+<!--more-->
+
 ## Example
 
 {{< callout emoji="👾">}}
diff --git a/exampleSite/content/docs/guide/shortcodes/tabs.md b/exampleSite/content/docs/guide/shortcodes/tabs.md
index 2b0b113f..658e1c58 100644
--- a/exampleSite/content/docs/guide/shortcodes/tabs.md
+++ b/exampleSite/content/docs/guide/shortcodes/tabs.md
@@ -1,5 +1,6 @@
 ---
 title: Tabs
+next: /docs/advanced/
 ---
 
 ## Example