diff --git a/docs/architecture.md b/docs/architecture.md
index 01fa3d2..a4f58de 100644
--- a/docs/architecture.md
+++ b/docs/architecture.md
@@ -1,4 +1,9 @@
-# Vue.js application architecture
+---
+layout: default
+title: Vue.js application architecture
+parent: Reference
+nav_order: 2
+---
 
 The Ontology Explorer is a Vue.js application. It's architecture utilizes various building blocks to create a user interface for analyzing and visualizing data models from ATLAS.ti projects. The following is a breakdown of these elements.
 
diff --git a/docs/build.md b/docs/build.md
index 43f79b2..86173e5 100644
--- a/docs/build.md
+++ b/docs/build.md
@@ -1,4 +1,9 @@
-# Build and deploy
+---
+layout: default
+title: Build and deploy
+parent: How-to guides
+nav_order: 2
+---
 
 To prepare Ontology Explorer application for publishing a website, you’ll need to follow these steps:
 
diff --git a/docs/domain-model.md b/docs/domain-model.md
index 2a50613..d185cc7 100644
--- a/docs/domain-model.md
+++ b/docs/domain-model.md
@@ -1,4 +1,9 @@
-# Domain model
+---
+layout: default
+title: Domain model
+parent: Reference
+nav_order: 1
+---
 
 The following diagram visually represents the interconnected entities within the domain model of an ATLAS.ti project. At the core of the model is the ATLAS. ti project, which encompasses ``Document groups``, ``Documents``, ``Code Groups``, ``Codes``, and ``Quotes``.
 
diff --git a/docs/how-to-guides.md b/docs/how-to-guides.md
new file mode 100644
index 0000000..5c2156f
--- /dev/null
+++ b/docs/how-to-guides.md
@@ -0,0 +1,7 @@
+---
+layout: default
+title: How-to guides
+nav_order: 2
+has_children: true
+---
+
diff --git a/docs/index.md b/docs/index.md
index 3a00064..8f01751 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -1,4 +1,4 @@
-# Documentation
+# The Ontology Explorer Documentation
 
 Welcome to the documentation for Ontology Explorer! This documentation provides guidance on installation, usage, and background information on the technical architecture of the project.
 
diff --git a/docs/installation.md b/docs/installation.md
index e509a57..236fab9 100644
--- a/docs/installation.md
+++ b/docs/installation.md
@@ -1,4 +1,9 @@
-# Installation
+---
+layout: default
+title: Install
+parent: How-to guides
+nav_order: 1
+---
 
 To run the Ontology Explorer locally on your machine, you'll need to follow these steps:
 
diff --git a/docs/network-analysis.md b/docs/network-analysis.md
index 3cc9f6d..f5700cd 100644
--- a/docs/network-analysis.md
+++ b/docs/network-analysis.md
@@ -1,4 +1,9 @@
-# Network analysis
+---
+layout: default
+title: Network analysis
+parent: How-to guides
+nav_order: 4
+---
 
 Before starting the network analysis, ensure that you have uploaded your Atlas.ti project as explained in the Upload page document.
 
diff --git a/docs/network-visualization.md b/docs/network-visualization.md
index bacbf81..4a4995d 100644
--- a/docs/network-visualization.md
+++ b/docs/network-visualization.md
@@ -1,4 +1,9 @@
-# Network visualization
+---
+layout: default
+title: Network visualization
+parent: How-to guides
+nav_order: 5
+---
 
 Before proceeding, ensure that you have loaded your project and performed the network analysis as explained in the respective documentation pages.
 
diff --git a/docs/reference.md b/docs/reference.md
new file mode 100644
index 0000000..9671d7d
--- /dev/null
+++ b/docs/reference.md
@@ -0,0 +1,7 @@
+---
+layout: default
+title: Reference
+nav_order: 3
+has_children: true
+---
+
diff --git a/docs/tutorial-atlas.md b/docs/tutorial-atlas.md
index 6d871d9..e15576c 100644
--- a/docs/tutorial-atlas.md
+++ b/docs/tutorial-atlas.md
@@ -1,4 +1,9 @@
-# Tutorial for starting a project on coding EU information systems for migration and border control
+---
+layout: default
+title: Tutorial for starting a project on coding EU information systems for migration and border control
+parent: Tutorials
+nav_order: 1
+---
 
 Welcome to the Ontology Explorer tutorial for analyzing EU regulations related to migration and border control. In this tutorial, you will learn how to create an ATLAS.ti project for importing into the Ontology Explorer. This tutorial serves as a simplified example of how to collect, import, code, and group data describing data models using ATLAS.ti software, similar to what is described in our scientific paper Van Rossem and Pelizza (2022).
 
diff --git a/docs/tutorial-ontology-explorer.md b/docs/tutorial-ontology-explorer.md
index 33bdad1..6c9239c 100644
--- a/docs/tutorial-ontology-explorer.md
+++ b/docs/tutorial-ontology-explorer.md
@@ -1,4 +1,9 @@
-# Ontology Explorer Tutorial
+---
+layout: default
+title: Ontology Explorer tool tutorial
+parent: Tutorials
+nav_order: 2
+---
 
 This tutorial will guide you through using the Ontology Explorer application for analyzing and visualizing data from Atlas.ti projects.
 
diff --git a/docs/tutorials.md b/docs/tutorials.md
new file mode 100644
index 0000000..bc8f512
--- /dev/null
+++ b/docs/tutorials.md
@@ -0,0 +1,7 @@
+---
+layout: default
+title: Tutorials
+nav_order: 1
+has_children: true
+---
+
diff --git a/docs/upload.md b/docs/upload.md
index 33b7280..e110ce1 100644
--- a/docs/upload.md
+++ b/docs/upload.md
@@ -1,4 +1,9 @@
-# Upload
+---
+layout: default
+title: Upload
+parent: How-to guides
+nav_order: 3
+---
 
 The Upload page of the Ontology Explorer allows users to upload an Atlas.ti project exported as an XML file and transform it into a network representation. Below are the steps to upload and transform the XML file: