diff --git a/org.fortiss.af3.rcp.help/html/.ratings b/org.fortiss.af3.rcp.help/html/.ratings
index 0a03fedf0e1fa226b6b0a424e1cd7f9955f3b150..90e2d7f90ca144bf311db8edfe663e218673ff8c 100644
--- a/org.fortiss.af3.rcp.help/html/.ratings
+++ b/org.fortiss.af3.rcp.help/html/.ratings
@@ -1,7 +1,7 @@
-af3_faq.html 76b4b50bb4054b928a42640ecfa440ac5917d17a GREEN
-example_co-simulation.html 92f60eb7a00cb781eb3df2d9f2d50f7d00b566c4 GREEN
-examples.MainPage.html 2c4306f571d68206ce7511bbe0fda2ee428cd2d9 GREEN
-getting_started.html c14e905bd433534ec9f7ace46b487e743d78f502 GREEN
-managing_projects.html 3ae1eb6a7d50f6467403de239692289bb07b93f6 GREEN
-rcphelp.gettingstarted.MainPage.html 76263309c64fee53399d62a09cdfcd5c313bc34a YELLOW
-tipsAndTricks.html 84078f2bbea99db29dfa1a38d59dda2540ee00fa GREEN
+af3_faq.html 2d96af809e68dc36b10ab337f88362f596d18eb2 GREEN
+example_co-simulation.html 8f36f6921311ca9eb7ccd769dda0173014e8af8d GREEN
+examples.MainPage.html a4b3a4c0413e9342588f4dba7eeddc8f12fc967c GREEN
+getting_started.html 1d1bf8af202f7457de22e23259b61f11e01d63da GREEN
+managing_projects.html f8822b841152e3168c07e309887dc6e4a5448ff1 GREEN
+rcphelp.gettingstarted.MainPage.html 0279a278429b888003086d0bf2536f13923a0fe2 GREEN
+tipsAndTricks.html 016873a68e57f72aae5a33c937612fbc32b4bc0f GREEN
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/.ratings b/org.fortiss.af3.rcp.help/html/ModandSim/.ratings
index 286e8a37065dd6954b05b775433183d006a5cfe2..ab5f35469e4a57ec09c8132992d65f46a82cfe2e 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/.ratings
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/.ratings
@@ -1,15 +1,15 @@
-BehaviorMod.ContentPage.html 8add0e6ba4dffc4715af499f681576b90d24a252 GREEN
-ModandSim.MainPage.html 2ffbbecd7d06ade3f5a0a0ca3b3f8407d6ba5879 GREEN
-code_specification.html 2212a40a032718892a24ab7aef701f40a90e4f7a GREEN
-component_architecture.html d122d62d6622714a597a6ffbbf12bf0c8a092861 GREEN
-cosimulation_with_af3.html 2a6979db8f96a812defc5df6294a9381031cbb2e GREEN
-data_dictionary.html f16333315733a5223868fdf2e0b1ec06c0419d43 GREEN
-hierarchical_state_automaton.html b1e1f12b3bd667fce2158df8d0dd7379b7fb7703 GREEN
-mode_automaton.html 57688d041d31a074174bd8708118fb4833626753 GREEN
-model_element_attributes.html 73e7c702b37beb7b5ab82339e69aa31777f2d399 GREEN
-model_markers_view.html 6505b258c9611eca0d287bbf9950e4b386c09d7d GREEN
-operatorpanels.html fde760953b84f47d1f52409f57570f86cc0b1e8d GREEN
-operatorpanels_advanced.html 7ed058b9798842f9a9a980794257ab80cd25a760 GREEN
-refactoring.html d3c98b10c0d01dadc48613f793b9f4087af20141 GREEN
-simulation_with_af3.html 992557ae7d586fe3bc7b5259d8e071e7517a7ca2 GREEN
-state_automaton.html f47ef2c725bad53a08ed764c76faf9d9eaec8e84 GREEN
+BehaviorMod.ContentPage.html 9e28deb8a3accf866586a6cab8be0c11d896bf9d GREEN
+ModandSim.MainPage.html 2fd6f6603024e4c0240b504971fde0244df47f72 GREEN
+code_specification.html 8134f6a3dcd5c65e28d3919bcc2146e9ee114202 GREEN
+component_architecture.html b1465884c220ef91049825edd9c5448c16b6943e GREEN
+cosimulation_with_af3.html e8ee3bed8e8eb39ee76c686201ba8ad1c4700c6e GREEN
+data_dictionary.html 2f8599c0313c15d22248c38282387c01cbbbbc06 GREEN
+hierarchical_state_automaton.html 036e09f37624128915a9c514e97f4ad75ba63f98 GREEN
+mode_automaton.html 1236073e6593f63522bf8348924230d71499abd8 GREEN
+model_element_attributes.html 9a2384f34de1ee6a030a03e414f035bd850051f6 GREEN
+model_markers_view.html 019f84fc68a574b3bf244cce75b885ad5fc46690 GREEN
+operatorpanels.html ff700c77bcef980d389182d74619daad0826dc66 GREEN
+operatorpanels_advanced.html 9b26beb7d70da43d81cc330bbeb6fde708ae0dc8 GREEN
+refactoring.html 4af537c4c4eb8a6601631d369dd556756e8d7cb6 GREEN
+simulation_with_af3.html adeed7b61dc26ca6fe996e2c659343b6fd36b991 GREEN
+state_automaton.html ef8d5d7504cb899d294b14e73c7064f2fb7b31e5 GREEN
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/BehaviorMod.ContentPage.html b/org.fortiss.af3.rcp.help/html/ModandSim/BehaviorMod.ContentPage.html
index 8add0e6ba4dffc4715af499f681576b90d24a252..9e28deb8a3accf866586a6cab8be0c11d896bf9d 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/BehaviorMod.ContentPage.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/BehaviorMod.ContentPage.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Modeling and Simulation Main-Page</title>
 <style>
@@ -19,29 +27,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<a href=".././rcphelp.gettingstarted.MainPage.html">Getting Started</a>
-							<a href="../requirements/MIRA.requirements.MainPage.html">Requirements Engineering</a>
-							<a style="background-color:#f2f2f2;">Modeling and Simulation</a>
-							<a href="../ta/DepandCodGen.MainPage.html">Deployment and Code Generation</a>
-							<a href="../dse/dse.MainPage.html">Design Space Exploration (DSE)</a>
-							<a href="../assuranceCases/creation.html">Assurance Case Modeling</a>
-						</div>
-					</div> 
-				<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'ModandSim.MainPage.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Modeling and Simulation Main Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/ModandSim.MainPage.html b/org.fortiss.af3.rcp.help/html/ModandSim/ModandSim.MainPage.html
index 2ffbbecd7d06ade3f5a0a0ca3b3f8407d6ba5879..2fd6f6603024e4c0240b504971fde0244df47f72 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/ModandSim.MainPage.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/ModandSim.MainPage.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Modeling and Simulation Main-Page</title>
 <style>
@@ -19,29 +27,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<a href=".././rcphelp.gettingstarted.MainPage.html">Getting Started</a>
-							<a href="../requirements/MIRA.requirements.MainPage.html">Requirements Engineering</a>
-							<a style="background-color:#f2f2f2;">Modeling and Simulation</a>
-							<a href="../ta/DepandCodGen.MainPage.html">Deployment and Code Generation</a>
-							<a href="../dse/dse.MainPage.html">Design Space Exploration (DSE)</a>
-							<a href="../assuranceCases/creation.html">Assurance Case Modeling</a>
-						</div>
-					</div> 
-				<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'ModandSim.MainPage.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Modeling and Simulation Main Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/code_specification.html b/org.fortiss.af3.rcp.help/html/ModandSim/code_specification.html
index 2212a40a032718892a24ab7aef701f40a90e4f7a..8134f6a3dcd5c65e28d3919bcc2146e9ee114202 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/code_specification.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/code_specification.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Creating a Code Specification for a Component</title>
@@ -13,103 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a style="background-color:#f2f2f2;">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'code_specification.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/component_architecture.html b/org.fortiss.af3.rcp.help/html/ModandSim/component_architecture.html
index d122d62d6622714a597a6ffbbf12bf0c8a092861..b1465884c220ef91049825edd9c5448c16b6943e 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/component_architecture.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/component_architecture.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Creating a Component Architecture</title>
 
@@ -13,105 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a style="background-color:#f2f2f2;">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
- 
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'component_architecture.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/cosimulation_with_af3.html b/org.fortiss.af3.rcp.help/html/ModandSim/cosimulation_with_af3.html
index 2a6979db8f96a812defc5df6294a9381031cbb2e..e8ee3bed8e8eb39ee76c686201ba8ad1c4700c6e 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/cosimulation_with_af3.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/cosimulation_with_af3.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Coupling AutoFOCUS3 with other Tools using Co-Simulation</title>
@@ -13,105 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a style="background-color:#f2f2f2;"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'cosimulation_with_af3.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/data_dictionary.html b/org.fortiss.af3.rcp.help/html/ModandSim/data_dictionary.html
index f16333315733a5223868fdf2e0b1ec06c0419d43..2f8599c0313c15d22248c38282387c01cbbbbc06 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/data_dictionary.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/data_dictionary.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Defining a Data Dictionary</title>
@@ -12,107 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a style="background-color:#f2f2f2;">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
- 
-
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'Data_Dictionary.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/hierarchical_state_automaton.html b/org.fortiss.af3.rcp.help/html/ModandSim/hierarchical_state_automaton.html
index b1e1f12b3bd667fce2158df8d0dd7379b7fb7703..036e09f37624128915a9c514e97f4ad75ba63f98 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/hierarchical_state_automaton.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/hierarchical_state_automaton.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Creating a Hierarchical State Automaton</title>
@@ -13,104 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a style="background-color:#f2f2f2;">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'state_automaton.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/mode_automaton.html b/org.fortiss.af3.rcp.help/html/ModandSim/mode_automaton.html
index 57688d041d31a074174bd8708118fb4833626753..1236073e6593f63522bf8348924230d71499abd8 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/mode_automaton.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/mode_automaton.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Creating a Mode Automaton</title>
@@ -13,105 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a style="background-color:#f2f2f2;"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'mode_automaton.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/model_element_attributes.html b/org.fortiss.af3.rcp.help/html/ModandSim/model_element_attributes.html
index 73e7c702b37beb7b5ab82339e69aa31777f2d399..9a2384f34de1ee6a030a03e414f035bd850051f6 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/model_element_attributes.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/model_element_attributes.html
@@ -4,112 +4,23 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Introduction to Graphical Modeling Interface</title>
-
 	</head>
 
 	<body>
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../MIRA.glossary.html">Glossary</a>
-								<a href="../MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a style="background-color:#f2f2f2;">Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							 <button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'model_element_attribute.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/model_markers_view.html b/org.fortiss.af3.rcp.help/html/ModandSim/model_markers_view.html
index 6505b258c9611eca0d287bbf9950e4b386c09d7d..019f84fc68a574b3bf244cce75b885ad5fc46690 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/model_markers_view.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/model_markers_view.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>On-the-fly Checks</title>
@@ -13,104 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a style="background-color:#f2f2f2;">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-						<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>					
-						<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'refactoring.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/operatorpanels.html b/org.fortiss.af3.rcp.help/html/ModandSim/operatorpanels.html
index fde760953b84f47d1f52409f57570f86cc0b1e8d..ff700c77bcef980d389182d74619daad0826dc66 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/operatorpanels.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/operatorpanels.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Operator Panels: Interaction with the Environment</title>
@@ -13,106 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a style="background-color:#f2f2f2;">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'operatorpanels.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/operatorpanels_advanced.html b/org.fortiss.af3.rcp.help/html/ModandSim/operatorpanels_advanced.html
index 7ed058b9798842f9a9a980794257ab80cd25a760..9b26beb7d70da43d81cc330bbeb6fde708ae0dc8 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/operatorpanels_advanced.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/operatorpanels_advanced.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Advanced OperatorPanel Items</title>
@@ -13,106 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a style="background-color:#f2f2f2;">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'operatorpanels_advanced.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/refactoring.html b/org.fortiss.af3.rcp.help/html/ModandSim/refactoring.html
index d3c98b10c0d01dadc48613f793b9f4087af20141..4af537c4c4eb8a6601631d369dd556756e8d7cb6 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/refactoring.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/refactoring.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Model Refactoring</title>
@@ -13,104 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a style="background-color:#f2f2f2;">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-				<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'refactoring.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/simulation_with_af3.html b/org.fortiss.af3.rcp.help/html/ModandSim/simulation_with_af3.html
index 992557ae7d586fe3bc7b5259d8e071e7517a7ca2..adeed7b61dc26ca6fe996e2c659343b6fd36b991 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/simulation_with_af3.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/simulation_with_af3.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type" />
 		<title>Behaviour Simulation</title>
@@ -13,105 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a href="state_automaton.html">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a style="background-color:#f2f2f2;">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'simulation_with_af3.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ModandSim/state_automaton.html b/org.fortiss.af3.rcp.help/html/ModandSim/state_automaton.html
index f47ef2c725bad53a08ed764c76faf9d9eaec8e84..ef8d5d7504cb899d294b14e73c7064f2fb7b31e5 100644
--- a/org.fortiss.af3.rcp.help/html/ModandSim/state_automaton.html
+++ b/org.fortiss.af3.rcp.help/html/ModandSim/state_automaton.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Creating a State Automaton</title>
@@ -13,104 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="component_architecture.html">Component Architecture Modeling</a>
-								<a href="data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="refactoring.html">Refactoring</a>
-								<a href="model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="code_specification.html">Code Specification</a>
-										<a style="background-color:#f2f2f2;">State Automata</a>
-										<a href="hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="simulation_with_af3.html">Simulation</a>
-										<a href="operatorpanels.html">Operator Panels</a>
-										<a href="operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'state_automaton.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'modelling and simulation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/af3_faq.html b/org.fortiss.af3.rcp.help/html/af3_faq.html
index 76b4b50bb4054b928a42640ecfa440ac5917d17a..2d96af809e68dc36b10ab337f88362f596d18eb2 100644
--- a/org.fortiss.af3.rcp.help/html/af3_faq.html
+++ b/org.fortiss.af3.rcp.help/html/af3_faq.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="./layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = "."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="./layout/stylesheet.css"/>
 		<title>AutoFOCUS3 FAQ</title>
 	</head>
@@ -12,107 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="./getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='./getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href="managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href="examples.MainPage.html">Examples</a>
-											<a href="tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href="af3_faq.html">FAQs</a>
-										</div>
-									<a href="rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href="rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="./requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="./requirements/MIRA.glossary.html">Glossary</a>
-								<a href="./requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="./ModandSim/model_element_attributes.html">Introduction to Graphical Modeling Interface</a>
-								<a href="./ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="./ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="./ModandSim/refactoring.html">Refactoring</a>
-								<a href="./ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ModandSim/code_specification.html">Code Specification</a>
-										<a href="./ModandSim/state_automaton.html">State Automata</a>
-										<a href="./ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="./ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="./ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="./ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="./ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="./ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="./ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="./ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="./ta/task_architecture.html">Task Architecture</a>
-										<a href="./ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="./ta/allocations.html"> Deployments/Allocations</a>
-										<a href="./ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="./ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="dse/constraints.html">Constraint Modeling</a>
-									<a href="dse/objectives.html">Objective Modeling</a>
-									<a href="dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="dse/schedule_synthesis.html">Schedule Synthesis</a>
-									<a href="dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					</div> 
-					
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'af3_faq.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Further Resources. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
@@ -194,7 +102,7 @@ AutoFOCUS3 is open source and developed under the <a target="_blank" rel="noopen
 Please check our <a target="_blank" rel="noopener noreferrer" href="https://af3-developer.fortiss.org/projects/autofocus3/wiki/Developers_documentation">developer documentation</a>, or write to our developer mailing list (<a href="mailto:af_devel@lists.fortiss.org">af_devel@lists.fortiss.org</a>).
 			</p>
 		</div>
-		<script src="../layout/jsscript/topBtn.js"></script>
+		<script src="./layout/jsscript/topBtn.js"></script>
 		<script src="./layout/jsscript/submenuScript.js"></script>
 		<div class="footer">
 			<p>
diff --git a/org.fortiss.af3.rcp.help/html/assuranceCases/.ratings b/org.fortiss.af3.rcp.help/html/assuranceCases/.ratings
index 38ae9fb0fa12c855cc74d664b10c916af126a29c..e2cdfb5c040626ab67cd60b06e3dfd484fa1bfc5 100644
--- a/org.fortiss.af3.rcp.help/html/assuranceCases/.ratings
+++ b/org.fortiss.af3.rcp.help/html/assuranceCases/.ratings
@@ -1,4 +1,4 @@
-ac.MainPage.html d6af9e80c775991c355f03d64065716fe7c9167d GREEN
-assessment.html f71d2d444e00bef3209cf363029ce4571cf37eff GREEN
-creation.html ff97fd2003013963cd490f4bb5c185d8d05739d9 GREEN
-maintenance.html c31991029cde2ae71ccbb25deaa1df6a34d04593 GREEN
+ac.MainPage.html 0940270354cfbe2208b234b98971cac393fbebb4 GREEN
+assessment.html 788a3cace1438d8f53858cdad617920c5abed40e GREEN
+creation.html 4a96dfbad395d54d98bc2b8c6bc692203ede09b3 GREEN
+maintenance.html dce244a59c3644a0e2f62b7c1bd944aa2263bcb5 GREEN
diff --git a/org.fortiss.af3.rcp.help/html/assuranceCases/ac.MainPage.html b/org.fortiss.af3.rcp.help/html/assuranceCases/ac.MainPage.html
index d6af9e80c775991c355f03d64065716fe7c9167d..0940270354cfbe2208b234b98971cac393fbebb4 100644
--- a/org.fortiss.af3.rcp.help/html/assuranceCases/ac.MainPage.html
+++ b/org.fortiss.af3.rcp.help/html/assuranceCases/ac.MainPage.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Assurance Cases Main-Page</title>
 <style>
@@ -19,29 +27,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<a href=".././rcphelp.gettingstarted.MainPage.html">Getting Started</a>
-							<a href="../requirements/MIRA.requirements.MainPage.html">Requirements Engineering</a>
-							<a href="../ModandSim/ModandSim.MainPage.html">Modeling and Simulation</a>
-							<a href="../ta/DepandCodGen.MainPage.html">Deployment and Code Generation</a>
-							<a href="../dse/dse.MainPage.html">Design Space Exploration (DSE)</a>
-							<a style="background-color:#f2f2f2;">Assurance Case Modeling</a>
-						</div>
-					</div> 
-				<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'ac.MainPage.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Assurance Cases Main Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/assuranceCases/assessment.html b/org.fortiss.af3.rcp.help/html/assuranceCases/assessment.html
index f71d2d444e00bef3209cf363029ce4571cf37eff..788a3cace1438d8f53858cdad617920c5abed40e 100644
--- a/org.fortiss.af3.rcp.help/html/assuranceCases/assessment.html
+++ b/org.fortiss.af3.rcp.help/html/assuranceCases/assessment.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Quantitative Assessment of Assurance Cases</title>
 	</head>
@@ -12,106 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content"> 
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="creation.html">Modeling GSN-based Assurance Cases</a>
-									<a style="background-color:#f2f2f2;">Quantitative Assessment of Assurance Cases</a>
-									<a href="maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'assessment.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Assurance Case Modeling. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/assuranceCases/creation.html b/org.fortiss.af3.rcp.help/html/assuranceCases/creation.html
index ff97fd2003013963cd490f4bb5c185d8d05739d9..4a96dfbad395d54d98bc2b8c6bc692203ede09b3 100644
--- a/org.fortiss.af3.rcp.help/html/assuranceCases/creation.html
+++ b/org.fortiss.af3.rcp.help/html/assuranceCases/creation.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>ExplicitCase Assurance Case Editor</title>
 	</head>
@@ -12,108 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-							<div class="dropdown-content"> 
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a style="background-color:#f2f2f2;">Modeling GSN-based Assurance Cases</a>
-									<a href="assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-
-
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'creation.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Glossary Creation Page. 
-{Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/assuranceCases/maintenance.html b/org.fortiss.af3.rcp.help/html/assuranceCases/maintenance.html
index c31991029cde2ae71ccbb25deaa1df6a34d04593..dce244a59c3644a0e2f62b7c1bd944aa2263bcb5 100644
--- a/org.fortiss.af3.rcp.help/html/assuranceCases/maintenance.html
+++ b/org.fortiss.af3.rcp.help/html/assuranceCases/maintenance.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Assurance Case Maintenance</title>
 	</head>
@@ -12,107 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-
-						</a>						
-						<div class="dropdown-content"> 
-							
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-								
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-									<a href="../requirements/MIRA.glossary.html">Glossary</a>
-									<a href="../requirements/MIRA.requirements.html">Requirements</a>
-								</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a style="background-color:#f2f2f2;">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'maintenance.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Assurance Case Modeling. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/dse/.ratings b/org.fortiss.af3.rcp.help/html/dse/.ratings
index 6d14a6ab11534c4f67f97856c98a0d3a5841520a..6a2f8cde580be3b93e01ad733974db29c5867b25 100644
--- a/org.fortiss.af3.rcp.help/html/dse/.ratings
+++ b/org.fortiss.af3.rcp.help/html/dse/.ratings
@@ -1,7 +1,7 @@
-constraints.html 74634ac928aab344a5ddf2891e291b55ac38a47a GREEN
-dse.MainPage.html ee7a3f8f60fb0215c728270dcbf6972e0f9e3285 GREEN
-dse_dashboard.html 49456d602fc8f8a4a0882be57edefb7db11b08eb GREEN
-dse_perspective.html d1c50f5c5f23decf9030e248f1e0303b2f9e4195 GREEN
-objectives.html e6d202f57b85dbb2d2e0fbf4efdd696a031fd177 GREEN
-synthesis.html c07fc7d41cf4fbfb8674179c380efb9fdc9e6a0f GREEN
-visualization.html 621531bb9cd20cb956ac912e3b07915bec83982d GREEN
+constraints.html d06c877400c0e3ecaf249ea25e1aa7100754de0f GREEN
+dse.MainPage.html fd506f89284ef3c7cfac3da224e60638e72fd0c3 GREEN
+dse_dashboard.html 044fad37deafdb748ead5ea883c95b5d586ceffd GREEN
+dse_perspective.html ad41459fc2f9bd8123a4997657b506f646ca0f70 GREEN
+objectives.html 178e3d9bb40dab01b8170646bf6a5d654ea6ea25 GREEN
+synthesis.html 9dde25b4a980c87f2fb931447dcfaf16de386105 GREEN
+visualization.html 2f4f8ce6c358f630d16713da1ee7732e1c27065a GREEN
diff --git a/org.fortiss.af3.rcp.help/html/dse/constraints.html b/org.fortiss.af3.rcp.help/html/dse/constraints.html
index 74634ac928aab344a5ddf2891e291b55ac38a47a..d06c877400c0e3ecaf249ea25e1aa7100754de0f 100644
--- a/org.fortiss.af3.rcp.help/html/dse/constraints.html
+++ b/org.fortiss.af3.rcp.help/html/dse/constraints.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Constraint Modeling</title>
 	</head>
@@ -12,104 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="dse_perspective.html">DSE Perspective Overview</a>
-									<a href="dse_dashboard.html">DSE Dashboard</a>
-									<a style="background-color:#f2f2f2;">Constraint Modeling</a>
-									<a href="objectives.html">Objective Modeling</a>
-									<a href="synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'constraints.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Design Space Exploration (DSE). 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/dse/dse.MainPage.html b/org.fortiss.af3.rcp.help/html/dse/dse.MainPage.html
index ee7a3f8f60fb0215c728270dcbf6972e0f9e3285..fd506f89284ef3c7cfac3da224e60638e72fd0c3 100644
--- a/org.fortiss.af3.rcp.help/html/dse/dse.MainPage.html
+++ b/org.fortiss.af3.rcp.help/html/dse/dse.MainPage.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Design Space Exploration Main-Page</title>
 <style>
@@ -19,30 +27,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							
-							<a href=".././rcphelp.gettingstarted.MainPage.html">Getting Started</a>
-							<a href="../requirements/MIRA.requirements.MainPage.html">Requirements Engineering</a>
-							<a href="../ModandSim/ModandSim.MainPage.html.html">Modeling and Simulation</a>
-							<a href="../ta/DepandCodGen.MainPage.html">Deployment and Code Generation</a>
-							<a style="background-color:#f2f2f2;">Design Space Exploration (DSE)</a>
-							<a href="../assuranceCases/ac.MainPage.html">Assurance Case Modeling</a>
-						</div>
-					</div> 
-				<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'dse.MainPage.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Design Space Exploration Main Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/dse/dse_dashboard.html b/org.fortiss.af3.rcp.help/html/dse/dse_dashboard.html
index 49456d602fc8f8a4a0882be57edefb7db11b08eb..044fad37deafdb748ead5ea883c95b5d586ceffd 100644
--- a/org.fortiss.af3.rcp.help/html/dse/dse_dashboard.html
+++ b/org.fortiss.af3.rcp.help/html/dse/dse_dashboard.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>DSE Dashboard</title>
 	</head>
@@ -12,103 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content"> 
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="dse_perspective.html">DSE Perspective Overview</a>
-									<a style="background-color:#f2f2f2;">DSE Dashboard</a>
-									<a href="constraints.html">Constraint Modeling</a>
-									<a href="objectives.html">Objective Modeling</a>
-									<a href="synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'dse_dashboard.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Design Space Exploration (DSE). 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/dse/dse_perspective.html b/org.fortiss.af3.rcp.help/html/dse/dse_perspective.html
index d1c50f5c5f23decf9030e248f1e0303b2f9e4195..ad41459fc2f9bd8123a4997657b506f646ca0f70 100644
--- a/org.fortiss.af3.rcp.help/html/dse/dse_perspective.html
+++ b/org.fortiss.af3.rcp.help/html/dse/dse_perspective.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>DSE Perspective Overview</title>
 	</head>
@@ -12,104 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-							<div class="dropdown-content"> 
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a style="background-color:#f2f2f2;">DSE Perspective Overview</a>
-									<a href="dse_dashboard.html">DSE Dashboard</a>
-									<a href="constraints.html">Constraint Modeling</a>
-									<a href="objectives.html">Objective Modeling</a>
-									<a href="synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>		
-<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'dse_prespective.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Design Space Exploration (DSE). 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/dse/objectives.html b/org.fortiss.af3.rcp.help/html/dse/objectives.html
index e6d202f57b85dbb2d2e0fbf4efdd696a031fd177..178e3d9bb40dab01b8170646bf6a5d654ea6ea25 100644
--- a/org.fortiss.af3.rcp.help/html/dse/objectives.html
+++ b/org.fortiss.af3.rcp.help/html/dse/objectives.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Objective Modeling</title>
 	</head>
@@ -12,104 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>						
-						<div class="dropdown-content"> 
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="dse_perspective.html">DSE Perspective Overview</a>
-									<a href="dse_dashboard.html">DSE Dashboard</a>
-									<a href="constraints.html">Constraint Modeling</a>
-									<a style="background-color:#f2f2f2;">Objective Modeling</a>
-									<a href="synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'objectives.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Design Space Exploration (DSE). 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/dse/synthesis.html b/org.fortiss.af3.rcp.help/html/dse/synthesis.html
index c07fc7d41cf4fbfb8674179c380efb9fdc9e6a0f..9dde25b4a980c87f2fb931447dcfaf16de386105 100644
--- a/org.fortiss.af3.rcp.help/html/dse/synthesis.html
+++ b/org.fortiss.af3.rcp.help/html/dse/synthesis.html
@@ -2,6 +2,14 @@
 <!-- Documentation on Deployment Synthesis in AutoFOCUS3. -->
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<meta http-equiv="content-type" content="text/html; charset=windows-1252"/>
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Deployment Synthesis</title>
@@ -10,104 +18,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>						
-						<div class="dropdown-content"> 
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<a href="../ModandSim/code_specification.html">Code Specification</a>
-									<a href="../ModandSim/state_automaton.html">State Automata</a>
-									<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-									<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-								</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-									<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-									<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-									<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-								</div>
-
-							</div>
-
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<a href="../ta/platform_architecture.html">Platform Architecture</a>
-									<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-										<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-										<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-									</div>
-									<a href="../ta/task_architecture.html">Task Architecture</a>
-									<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-									<a href="../ta/allocations.html"> Deployments/Allocations</a>
-									<a href="../ta/system_schedule.html"> System Schedule</a>
-								</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							</div>
-
-
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-
-								<a href="dse_perspective.html">DSE Perspective Overview</a>
-								<a href="dse_dashboard.html">DSE Dashboard</a>
-								<a href="constraints.html">Constraint Modeling</a>
-								<a href="objectives.html">Objective Modeling</a>
-								<a style="background-color:#f2f2f2;">Deployment/Schedule Synthesis (Exploration)</a>
-								<a href="visualization.html">Solution Visualization</a>
-							</div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-								<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-								<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							</div>
-						</div>
-					</div>
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'synthesis.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Design Space Exploration (DSE). 
-							{Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/dse/visualization.html b/org.fortiss.af3.rcp.help/html/dse/visualization.html
index 621531bb9cd20cb956ac912e3b07915bec83982d..2f4f8ce6c358f630d16713da1ee7732e1c27065a 100644
--- a/org.fortiss.af3.rcp.help/html/dse/visualization.html
+++ b/org.fortiss.af3.rcp.help/html/dse/visualization.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Visualization of DSE Results</title>
 	</head>
@@ -12,106 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content"> 
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="dse_perspective.html">DSE Perspective Overview</a>
-									<a href="dse_dashboard.html">DSE Dashboard</a>
-									<a href="constraints.html">Constraint Modeling</a>
-									<a href="objectives.html">Objective Modeling</a>
-									<a href="synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a style="background-color:#f2f2f2;">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'visualization.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Design Space Exploration (DSE). 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/example_co-simulation.html b/org.fortiss.af3.rcp.help/html/example_co-simulation.html
index 92f60eb7a00cb781eb3df2d9f2d50f7d00b566c4..8f36f6921311ca9eb7ccd769dda0173014e8af8d 100644
--- a/org.fortiss.af3.rcp.help/html/example_co-simulation.html
+++ b/org.fortiss.af3.rcp.help/html/example_co-simulation.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="./layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = "."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="./layout/stylesheet.css"/>
 		<title>FMI-based Co-Simulation with OpenModelica and Overture</title>
 	</head>
@@ -12,105 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="./getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='./getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href="managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href="examples.MainPage.html">Examples</a>
-											<a href="tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href="af3_faq.html">FAQs</a>
-										</div>
-									<a href="rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href="rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="./requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="./requirements/MIRA.glossary.html">Glossary</a>
-								<a href="./requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="./ModandSim/model_element_attributes.html">Introduction to Graphical Modeling Interface</a>
-								<a href="./ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="./ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="./ModandSim/refactoring.html">Refactoring</a>
-								<a href="./ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ModandSim/code_specification.html">Code Specification</a>
-										<a href="./ModandSim/state_automaton.html">State Automata</a>
-										<a href="./ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="./ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="./ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="./ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="./ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="./ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="./ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="./ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="./ta/task_architecture.html">Task Architecture</a>
-										<a href="./ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="./ta/allocations.html"> Deployments/Allocations</a>
-										<a href="./ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="./ta/code_generation.html">Code Generation</a>
-							   </div>							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="dse/constraints.html">Constraint Modeling</a>
-									<a href="dse/objectives.html">Objective Modeling</a>
-									<a href="dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="dse/schedule_synthesis.html">Schedule Synthesis</a>
-									<a href="dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'managing_projects.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Further Resources. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
@@ -254,7 +164,7 @@
 						</center>
 
 		</div>
-		<script src="../layout/jsscript/topBtn.js"></script>
+		<script src="./layout/jsscript/topBtn.js"></script>
 		<script src="./layout/jsscript/submenuScript.js"></script>
 		<div class="footer">
 			<p>
diff --git a/org.fortiss.af3.rcp.help/html/examples.MainPage.html b/org.fortiss.af3.rcp.help/html/examples.MainPage.html
index 2c4306f571d68206ce7511bbe0fda2ee428cd2d9..a4b3a4c0413e9342588f4dba7eeddc8f12fc967c 100644
--- a/org.fortiss.af3.rcp.help/html/examples.MainPage.html
+++ b/org.fortiss.af3.rcp.help/html/examples.MainPage.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="./layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = "."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="./layout/stylesheet.css"/>
 		<title>Examples - Main-Page</title>
 		<style>
@@ -19,105 +27,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='./getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href="managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href="examples.MainPage.html">Examples</a>
-											<a href="tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href="af3_faq.html">FAQs</a>
-										</div>
-									<a href="rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href="rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="requirements/MIRA.glossary.html">Glossary</a>
-								<a href="requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="ModandSim/refactoring.html">Refactoring</a>
-								<a href="ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<a href="ModandSim/code_specification.html">Code Specification</a>
-									<a href="ModandSim/state_automaton.html">State Automata</a>
-									<a href="ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-									<a href="ModandSim/mode_automaton.html"> Mode Automata</a>
-								</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<a href="ModandSim/simulation_with_af3.html">Simulation</a>
-									<a href="ModandSim/operatorpanels.html">Operator Panels</a>
-									<a href="ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-									<a href="ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-								</div>
-
-							</div>
-
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<a href="ta/platform_architecture.html">Platform Architecture</a>
-									<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-										<a href="ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-										<a href="ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-									</div>
-									<a href="ta/task_architecture.html">Task Architecture</a>
-									<a href="ta/partition_architecture.html"> Partition Architecture</a>
-									<a href="ta/allocations.html"> Deployments/Allocations</a>
-									<a href="ta/system_schedule.html"> System Schedule</a>
-								</div>
-								<a href=ta/code_generation.html">Code Generation</a>
-							</div>
-
-
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-
-								<a href="dse/dse_perspective.html">DSE Perspective Overview</a>
-								<a href="dse/dse_dashboard.html">DSE Dashboard</a>
-								<a href="dse/constraints.html">Constraint Modeling</a>
-								<a href="dse/objectives.html">Objective Modeling</a>
-								<a href="dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-								<a href="dse/schedule_synthesis.html">Schedule Synthesis</a>
-								<a href="dse/visualization.html">Solution Visualization</a>
-							</div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-								<a href="assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-								<a href="assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							</div>
-						</div>
-					</div>
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'examples.MainPage.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Examples Main Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/getting_started.html b/org.fortiss.af3.rcp.help/html/getting_started.html
index c14e905bd433534ec9f7ace46b487e743d78f502..1d1bf8af202f7457de22e23259b61f11e01d63da 100644
--- a/org.fortiss.af3.rcp.help/html/getting_started.html
+++ b/org.fortiss.af3.rcp.help/html/getting_started.html
@@ -1,6 +1,14 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="./layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = "."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
 		<meta content="This user documentation for AutoFOCUS3, a CASE tool developed by fortiss for the model-based development of embedded systems." name="description" />
 		<meta content="autofocus,fortiss" name="keywords" />
@@ -15,9 +23,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting getting_started.html Documentation Problem&amp;body= Dear AutoFOCUS3 team, I am reporting an issue related to getting_started.html page.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/layout/jsscript/navBarReplacer.js b/org.fortiss.af3.rcp.help/html/layout/jsscript/navBarReplacer.js
new file mode 100644
index 0000000000000000000000000000000000000000..b72a0fa5adcaefbbedb9b60ba5dad8a0567da5e4
--- /dev/null
+++ b/org.fortiss.af3.rcp.help/html/layout/jsscript/navBarReplacer.js
@@ -0,0 +1,29 @@
+// A method which gets the global nav bar as html string and will manipulate it 
+// to fit to the given pathToTop and the executing html page.
+function loadNavigationBarWithReplacements(htmlDocumentAsString, pathToTop) {
+	let path = window.location.pathname;
+	let pageName = path.split("/").pop();
+	
+	//Replacements (g for global replace)
+	htmlDocumentAsString = htmlDocumentAsString.replace(/<PATH_TO_TOP>/g, pathToTop);
+	htmlDocumentAsString = htmlDocumentAsString.replace(/<PAGE_NAME>/g, pageName);
+	htmlDocumentAsString = htmlDocumentAsString.replace(/<PAGE_TOPIC>/g, document.title);
+	
+	let placeHolder = document.getElementById('navBarPlaceholder');
+    if(placeHolder.outerHTML) { 
+    	//if outerHTML is supported
+        placeHolder.outerHTML = htmlDocumentAsString;
+    } else { 
+    	//if outerHTML is not supported (usually not needed anymore)
+        let tmp = document.createElement("div");
+        tmp.innerHTML="<!--REPLACEMENT-->";
+        placeHolderParent = placeHolder.parentNode;
+        placeHolderParent.replaceChild(tmp, placeHolder);
+        placeHolderParent.innerHTML = placeHolderParent.innerHTML.replace('<div><!--REPLACEMENT--></div>', htmlDocumentAsString);
+    }
+    
+    // all script for this parts must be loaded again to work
+    $(function() {
+	    $.getScript(pathToTop + "/layout/jsscript/submenuScript.js");
+	});
+}
\ No newline at end of file
diff --git a/org.fortiss.af3.rcp.help/html/managing_projects.html b/org.fortiss.af3.rcp.help/html/managing_projects.html
index 3ae1eb6a7d50f6467403de239692289bb07b93f6..f8822b841152e3168c07e309887dc6e4a5448ff1 100644
--- a/org.fortiss.af3.rcp.help/html/managing_projects.html
+++ b/org.fortiss.af3.rcp.help/html/managing_projects.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="./layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = "."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="./layout/stylesheet.css"/>
 		<title>Managing AutoFOCUS3 Projects</title>
 	</head>
@@ -12,106 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="./getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='./getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href="managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href="examples.MainPage.html">Examples</a>
-											<a href="tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href="af3_faq.html">FAQs</a>
-										</div>
-									<a href="rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href="rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="./requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="./requirements/MIRA.glossary.html">Glossary</a>
-								<a href="./requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="./ModandSim/model_element_attributes.html">Introduction to Graphical Modeling Interface</a>
-								<a href="./ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="./ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="./ModandSim/refactoring.html">Refactoring</a>
-								<a href="./ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ModandSim/code_specification.html">Code Specification</a>
-										<a href="./ModandSim/state_automaton.html">State Automata</a>
-										<a href="./ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="./ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="./ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="./ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="./ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="./ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="./ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="./ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="./ta/task_architecture.html">Task Architecture</a>
-										<a href="./ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="./ta/allocations.html"> Deployments/Allocations</a>
-										<a href="./ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="./ta/code_generation.html">Code Generation</a>
-							   </div>							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="dse/constraints.html">Constraint Modeling</a>
-									<a href="dse/objectives.html">Objective Modeling</a>
-									<a href="dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="dse/schedule_synthesis.html">Schedule Synthesis</a>
-									<a href="dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					</div> 
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'managing_projects.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Further Resources. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
@@ -159,7 +68,7 @@ To access the Import/Export functionality, see:<br/>
 
 
 		</div>
-		<script src="../layout/jsscript/topBtn.js"></script>
+		<script src="./layout/jsscript/topBtn.js"></script>
 		<script src="./layout/jsscript/submenuScript.js"></script>
 		<div class="footer">
 			<p>
diff --git a/org.fortiss.af3.rcp.help/html/rcphelp.gettingstarted.MainPage.html b/org.fortiss.af3.rcp.help/html/rcphelp.gettingstarted.MainPage.html
index 76263309c64fee53399d62a09cdfcd5c313bc34a..0279a278429b888003086d0bf2536f13923a0fe2 100644
--- a/org.fortiss.af3.rcp.help/html/rcphelp.gettingstarted.MainPage.html
+++ b/org.fortiss.af3.rcp.help/html/rcphelp.gettingstarted.MainPage.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="./layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = "."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="./layout/stylesheet.css"/>
 		<title>Getting Started RCP Main-Page</title>
 <style>
@@ -19,29 +27,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='./getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<a style="background-color:#f2f2f2;">Getting Started</a>
-							<a href="./requirements/MIRA.requirements.MainPage.html">Requirements Engineering</a>
-							<a href="./ModandSim/ModandSim.MainPage.html">Modeling and Simulation</a>
-							<a href="./ta/DepandCodGen.MainPage.html">Deployment and Code Generation</a>
-							<a href="./dse/dse.MainPage.html">Design Space Exploration (DSE)</a>
-							<a href="./assuranceCases/ac.MainPage.html">Assurance Case Modeling</a>
-						</div>
-					</div> 
-				<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'rcphelp.gettingstarted.MainPage.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to rcp getting started Main Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
@@ -72,15 +58,15 @@
 								<li>&nbsp;</li>
 								<li>Resources for Developers
 									<ul>
-										<li><a target="_blank" rel="noopener noreferrer" href="https://af3-developer.fortiss.org/projects/autofocus3/wiki/Developers_documentation">Developers Documentation Overview</a></li>
-										<li><a target="_blank" rel="noopener noreferrer" href="https://af3-developer.fortiss.org/projects/autofocus3/wiki/AF3_Developer_Installation">AF3 Developer Installation</a></li>
+										<li><a target="_blank" rel="noopener noreferrer" href="https://git.fortiss.org/af3/af3/-/wikis/home">Developers Documentation Overview</a></li>
+										<li><a target="_blank" rel="noopener noreferrer" href="https://git.fortiss.org/af3/af3/-/wikis/AF3%20Developer%20Installation">AF3 Developer Installation</a></li>
 									</ul>
 								</li>
 								<li>&nbsp;</li>
 								<li>Contact
 									<ul>
-										<li><a class="email" href="mailto:af_user@lists.fortiss.org">Users Mailing List</a>: subscribe <a target="_blank" rel="noopener noreferrer" href="https://af3-developer.fortiss.org/projects/autofocus3/wiki/MailinglistSubscription%23">here</a></li>
-										<li><a class="email" href="mailto:af_devel@lists.fortiss.org">Developers Mailing List</a>: subscribe <a target="_blank" rel="noopener noreferrer" href="https://af3-developer.fortiss.org/projects/autofocus3/wiki/MailinglistSubscription%23">here</a></li>
+										<li><a class="email" href="mailto:af_user@lists.fortiss.org">Users Mailing List</a> (subscribe by <a href="mailto:af_user-request@lists.fortiss.org?subject=subscribe&body=(DO%20NOT%20CHANGE%20SUBJECT)%0D%0A%0D%0AHello,%0D%0A%0D%0Aplease%20subscribe%20me%20for%20the%20users%20mailing%20list.">e-mail</a>)</li>
+										<li><a class="email" href="mailto:af_devel@lists.fortiss.org">Developers Mailing List</a> (subscribe by <a href="mailto:af_devel-request@lists.fortiss.org?subject=subscribe&body=(DO%20NOT%20CHANGE%20SUBJECT)%0D%0A%0D%0AHello,%0D%0A%0D%0Aplease%20subscribe%20me%20for%20the%20developers%20mailing%20list.">e-mail</a>)</li>
 										<li><a target="_blank" rel="noopener noreferrer" href="https://www.fortiss.org/en/publications/software/autofocus-3">AutoFOCUS3 homepage</a></li>
 									</ul>
 								</li>
@@ -91,12 +77,12 @@
 			</div>
 		</div>
 
-		<script src="../layout/jsscript/topBtn.js">
-		</script>
+		<script src="./layout/jsscript/topBtn.js"></script>
+		<script src="./layout/jsscript/submenuScript.js"></script>
 
 		<div class="footer">
 			<p>
-				&copy; 2021 <a href="https://www.fortiss.org/">fortiss GmbH</a> &nbsp;&nbsp;&bull;&nbsp;&nbsp;
+				&copy; 2022 <a href="https://www.fortiss.org/">fortiss GmbH</a> &nbsp;&nbsp;&bull;&nbsp;&nbsp;
 				<a href="https://www.fortiss.org/en/publications/software/autofocus-3#c2007">Contact</a>&nbsp;&nbsp;&bull;&nbsp;&nbsp;
 				<a href="https://www.fortiss.org/en/imprint">Imprint</a>
 			</p>
diff --git a/org.fortiss.af3.rcp.help/html/requirements/.ratings b/org.fortiss.af3.rcp.help/html/requirements/.ratings
index 074ac8789cbde0376777433d9a37bfafeca0e07a..dcaefa8376881037cc433e141d9ab5b71a810201 100644
--- a/org.fortiss.af3.rcp.help/html/requirements/.ratings
+++ b/org.fortiss.af3.rcp.help/html/requirements/.ratings
@@ -1,4 +1,4 @@
-MIRA.glossary.html f0dfd12e1212e63f8621f2061424dd256cbd24c2 GREEN
-MIRA.requirements.MainPage.html 3b542a60047badb3ca75c805117b1ee1d0b8f646 GREEN
-MIRA.requirements.html 25a62878542ba0708156baf697eef0f79e36c147 GREEN
-MIRA.requirements_analysis.html 97fd2f2e198b6a797f1751bf0032f0253921cb15 GREEN
+MIRA.glossary.html dbf6e76c8c513718faf2a11d448b6ee9d700bfee GREEN
+MIRA.requirements.MainPage.html 0f433d016e21cd270ffaae41880c8824406c1b84 GREEN
+MIRA.requirements.html 36f1af3ed54e1affef7b8f661d52b5419c57ba93 GREEN
+MIRA.requirements_analysis.html 1e63504a523723643426ac3b1e5d9f7d416d397f GREEN
diff --git a/org.fortiss.af3.rcp.help/html/requirements/MIRA.glossary.html b/org.fortiss.af3.rcp.help/html/requirements/MIRA.glossary.html
index f0dfd12e1212e63f8621f2061424dd256cbd24c2..dbf6e76c8c513718faf2a11d448b6ee9d700bfee 100644
--- a/org.fortiss.af3.rcp.help/html/requirements/MIRA.glossary.html
+++ b/org.fortiss.af3.rcp.help/html/requirements/MIRA.glossary.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Creating a Glossary</title>
 	</head>
@@ -12,107 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a style="background-color:#f2f2f2;">Glossary</a>
-								<a href="MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html">Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-
-					
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'MIRA.Glossary.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Glossary Creation Page. 
-							{Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements.MainPage.html b/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements.MainPage.html
index 3b542a60047badb3ca75c805117b1ee1d0b8f646..0f433d016e21cd270ffaae41880c8824406c1b84 100644
--- a/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements.MainPage.html
+++ b/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements.MainPage.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Requirments Engineering Main-Page</title>
 <style>
@@ -19,29 +27,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<a href=".././rcphelp.gettingstarted.MainPage.html">Getting Started</a>
-							<a style="background-color:#f2f2f2;">Requirements Engineering</a>
-							<a href="../ModandSim/ModandSim.MainPage.html">Modeling and Simulation</a>
-							<a href="../ta/DepandCodGen.MainPage.html">Deployment and Code Generation</a>
-							<a href="../dse/dse.MainPage.html">Design Space Exploration (DSE)</a>
-							<a href="../assuranceCases/ac.MainPage.html">Assurance Case Modeling</a>
-						</div>
-					</div> 
-				<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'MIRA.Requirements.MainPage.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Requirements Engineering Main Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements.html b/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements.html
index 25a62878542ba0708156baf697eef0f79e36c147..36f1af3ed54e1affef7b8f661d52b5419c57ba93 100644
--- a/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements.html
+++ b/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Creating a Requirements Node</title>
 	</head>
@@ -12,107 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="MIRA.glossary.html">Glossary</a>
-								<a style="background-color:#f2f2f2;">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html">Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-
-					
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'MIRA.Requirements.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Requirements Creation Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements_analysis.html b/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements_analysis.html
index 97fd2f2e198b6a797f1751bf0032f0253921cb15..1e63504a523723643426ac3b1e5d9f7d416d397f 100644
--- a/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements_analysis.html
+++ b/org.fortiss.af3.rcp.help/html/requirements/MIRA.requirements_analysis.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Requirements Analysis</title>
 	</head>
@@ -12,105 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a style="background-color:#f2f2f2;"> Requirements Analysis Node</a>
-								<a href="MIRA.glossary.html">Glossary</a>
-								<a href="MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html">Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="../ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="../ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="../ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="../ta/task_architecture.html">Task Architecture</a>
-										<a href="../ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="../ta/allocations.html"> Deployments/Allocations</a>
-										<a href="../ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="../ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'MIRA.requirements_analysis.html' 
-      Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to requirements_analysis Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/.ratings b/org.fortiss.af3.rcp.help/html/ta/.ratings
index 802388c4bcae0d5f7dec77d91d31bc3c8974010f..4fc334c96f3f1e97689a086c7d5ebed563eb0268 100644
--- a/org.fortiss.af3.rcp.help/html/ta/.ratings
+++ b/org.fortiss.af3.rcp.help/html/ta/.ratings
@@ -1,11 +1,11 @@
-DepandCodGen.MainPage.html f7d4717e12d579fd7847bb6777e93a841466ae91 GREEN
-allocations.html 772a71312447c2f8799ce3b6dbc872089f97d2ce GREEN
-code_generation.html 84311555f9da3a2456e4fb80bbc786079a4167a4 GREEN
-partition_architecture.html 8a12fc06aa31e63c61350f2a57024069c1e859d0 GREEN
-platform_architecture.html 37cf73b83d3abda0cecd82c456513aae0602bd59 GREEN
-platform_architecture_generic.html d52456e5853f419053e90cbd49de22587638014c GREEN
-platform_architecture_hierarchical.html ee5b148a68f18c4d50cccbb5233f63d5d01af0bc GREEN
-platform_architecture_raspberrypi.html 350ed24031cd0ac90cd5d3c74d14591f309e45c4 GREEN
-system_schedule.html d7bf0ab434c8606e1e51718f6041186e066ce8a1 GREEN
-task_architecture.html de723e06e6b2de370ee49ce7d6a8af4b634c88c2 GREEN
-technical_viewpoint.html 154568cf34ce62280ab80db95bf3980c86fc9ff5 GREEN
+DepandCodGen.MainPage.html 783559f4641417e0f1b5b34081b060688763efa7 GREEN
+allocations.html f11edded81b8da04702cbc1d01d92cf64810b9f5 GREEN
+code_generation.html 5eba3aacd28aaecd17da54a80a25d904443c0838 GREEN
+partition_architecture.html 6999b16f6912556c26383942ec98660b12b293b3 GREEN
+platform_architecture.html 70c38cfa7b5181a1673da086d8b34540ef13761b GREEN
+platform_architecture_generic.html 0f111023bfdedaabb3382f8106b5d68b76bf20eb GREEN
+platform_architecture_hierarchical.html ca9e2c02f53465cce49d2e5b53d3200a1de5159b GREEN
+platform_architecture_raspberrypi.html 91748e13e91045b58879629f198888ad17441c45 GREEN
+system_schedule.html 4fbd0945ee027b2f935ca3546421062c2e81e776 GREEN
+task_architecture.html ce00b7aadcc2c2438987a0bca6bc2118491ff40e GREEN
+technical_viewpoint.html dbb8ae5bdd54b17f3c7865dd9d17b107ae59f2a9 GREEN
diff --git a/org.fortiss.af3.rcp.help/html/ta/DepandCodGen.MainPage.html b/org.fortiss.af3.rcp.help/html/ta/DepandCodGen.MainPage.html
index f7d4717e12d579fd7847bb6777e93a841466ae91..783559f4641417e0f1b5b34081b060688763efa7 100644
--- a/org.fortiss.af3.rcp.help/html/ta/DepandCodGen.MainPage.html
+++ b/org.fortiss.af3.rcp.help/html/ta/DepandCodGen.MainPage.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<title>Deployment and Code Generation Main-Page</title>
 <style>
@@ -19,29 +27,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<a href=".././rcphelp.gettingstarted.MainPage.html">Getting Started</a>
-							<a href="../requirements/MIRA.requirements.MainPage.html">Requirements Engineering</a>
-							<a href="../ModandSim/ModandSim.MainPage.html">Modeling and Simulation</a>
-							<a style="background-color:#f2f2f2;">Deployment and Code Generation</a>
-							<a href="../dse/dse.MainPage.html">Design Space Exploration (DSE)</a>
-							<a href="../assuranceCases/ac.MainPage.html">Assurance Case Modeling</a>
-						</div>
-					</div> 
-				<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'DepandCodGen.MainPage.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Dependency and Code Generation Main Page. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/allocations.html b/org.fortiss.af3.rcp.help/html/ta/allocations.html
index ac6030af77c5479a357f7a3aae613ae061342027..3268ce7298d22f778a59b0a4a196cebe153db2e0 100644
--- a/org.fortiss.af3.rcp.help/html/ta/allocations.html
+++ b/org.fortiss.af3.rcp.help/html/ta/allocations.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Defining Allocations</title>
@@ -13,108 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-											<a href="platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-									</div>
-										<a href="task_architecture.html">Task Architecture</a>
-										<a href="partition_architecture.html"> Partition Architecture</a>
-										<a style="background-color:#f2f2f2;"> Deployments/Allocations</a>
-										<a href="system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'allocations.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</head>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/code_generation.html b/org.fortiss.af3.rcp.help/html/ta/code_generation.html
index 84311555f9da3a2456e4fb80bbc786079a4167a4..5eba3aacd28aaecd17da54a80a25d904443c0838 100644
--- a/org.fortiss.af3.rcp.help/html/ta/code_generation.html
+++ b/org.fortiss.af3.rcp.help/html/ta/code_generation.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Generating Code</title>
@@ -13,105 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-											<a href="platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-									</div>
-										<a href="task_architecture.html">Task Architecture</a>
-										<a href="partition_architecture.html"> Partition Architecture</a>
-										<a style="allocations.html"> Deployments/Allocations</a>
-										<a href="system_schedule.html"> System Schedule</a>
-									</div>
-								<a style="background-color:#f2f2f2;">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'code_generation.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/partition_architecture.html b/org.fortiss.af3.rcp.help/html/ta/partition_architecture.html
index 8a12fc06aa31e63c61350f2a57024069c1e859d0..6999b16f6912556c26383942ec98660b12b293b3 100644
--- a/org.fortiss.af3.rcp.help/html/ta/partition_architecture.html
+++ b/org.fortiss.af3.rcp.help/html/ta/partition_architecture.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Partition Architecture</title>
@@ -13,106 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-											<a href="platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-									</div>
-										<a href="task_architecture.html">Task Architecture</a>
-										<a style="background-color:#f2f2f2;"> Partition Architecture</a>
-										<a href="allocations.html"> Deployments/Allocations</a>
-										<a href="system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="code_generation.html">Code Generation</a>
-							   </div>
-
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'partition_architecture.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/platform_architecture.html b/org.fortiss.af3.rcp.help/html/ta/platform_architecture.html
index 37cf73b83d3abda0cecd82c456513aae0602bd59..70c38cfa7b5181a1673da086d8b34540ef13761b 100644
--- a/org.fortiss.af3.rcp.help/html/ta/platform_architecture.html
+++ b/org.fortiss.af3.rcp.help/html/ta/platform_architecture.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Defining a Platform Architecture</title>
@@ -13,106 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a style="background-color:#f2f2f2;">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="task_architecture.html">Task Architecture</a>
-										<a href="partition_architecture.html"> Partition Architecture</a>
-										<a href="allocations.html"> Deployments/Allocations</a>
-										<a href="system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="code_generation.html">Code Generation</a>
-							   </div>
-
-						<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'platform_architecture.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/platform_architecture_generic.html b/org.fortiss.af3.rcp.help/html/ta/platform_architecture_generic.html
index 4204e976a13eeb2dd257b5ff44c3ac3ffdd6d60d..28b9025eb661a5ac3959d07c5f3e7d86aedf10fc 100644
--- a/org.fortiss.af3.rcp.help/html/ta/platform_architecture_generic.html
+++ b/org.fortiss.af3.rcp.help/html/ta/platform_architecture_generic.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Generic Platform Architecture</title>
@@ -13,103 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="platform_architecture.html">Platform Architecture</a>
-										<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  								<div class="dropdown-container">
-    										<a style="background-color:#f2f2f2;">Generic Platform Architecture</a>
-										<a href="platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-										<a href="platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="task_architecture.html">Task Architecture</a>
-										<a href="partition_architecture.html"> Partition Architecture</a>
-										<a href="allocations.html"> Deployments/Allocations</a>
-									</div>
-								<a href="code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'platform_architecture_generic.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</head>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/platform_architecture_hierarchical.html b/org.fortiss.af3.rcp.help/html/ta/platform_architecture_hierarchical.html
index ee5b148a68f18c4d50cccbb5233f63d5d01af0bc..ca9e2c02f53465cce49d2e5b53d3200a1de5159b 100644
--- a/org.fortiss.af3.rcp.help/html/ta/platform_architecture_hierarchical.html
+++ b/org.fortiss.af3.rcp.help/html/ta/platform_architecture_hierarchical.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Hierarchical Platform Architecture</title>
@@ -13,104 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="platform_architecture.html">Platform Architecture</a>
-									<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="platform_architecture_generic.html">Generic Platform Architecture</a>
-								<a style="background-color:#f2f2f2;">Hierarchical Platform Architecture</a>
-								<a href="platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-							</div>
-										<a href="task_architecture.html">Task Architecture</a>
-										<a href="partition_architecture.html"> Partition Architecture</a>
-										<a href="allocations.html"> Deployments/Allocations</a>
-									</div>
-								<a href="code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'platform_architecture_hierarchical.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/platform_architecture_raspberrypi.html b/org.fortiss.af3.rcp.help/html/ta/platform_architecture_raspberrypi.html
index 350ed24031cd0ac90cd5d3c74d14591f309e45c4..91748e13e91045b58879629f198888ad17441c45 100644
--- a/org.fortiss.af3.rcp.help/html/ta/platform_architecture_raspberrypi.html
+++ b/org.fortiss.af3.rcp.help/html/ta/platform_architecture_raspberrypi.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>RaspberryPi Platform Architecture</title>
@@ -13,103 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="platform_architecture.html">Platform Architecture</a>
-								<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="platform_architecture_generic.html">Generic Platform Architecture</a>
-								<a href="platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-								<a style="background-color:#f2f2f2;">RaspberryPi Platform Architecture</a>
-							</div>
-										<a href="task_architecture.html">Task Architecture</a>
-										<a href="partition_architecture.html"> Partition Architecture</a>
-										<a href="allocations.html"> Deployments/Allocations</a>
-									</div>
-								<a href="code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'platform_architecture_raspberrypi.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/system_schedule.html b/org.fortiss.af3.rcp.help/html/ta/system_schedule.html
index d7bf0ab434c8606e1e51718f6041186e066ce8a1..4fbd0945ee027b2f935ca3546421062c2e81e776 100644
--- a/org.fortiss.af3.rcp.help/html/ta/system_schedule.html
+++ b/org.fortiss.af3.rcp.help/html/ta/system_schedule.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>System Schedule</title>
@@ -13,107 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-											<a href="platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-									</div>
-										<a href="task_architecture.html">Task Architecture</a>
-										<a href="partition_architecture.html"> Partition Architecture</a>
-										<a href="allocations.html"> Deployments/Allocations</a>
-										<a style="background-color:#f2f2f2;"> System Schedule</a>
-									</div>
-								<a href="code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'system_schedule.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/task_architecture.html b/org.fortiss.af3.rcp.help/html/ta/task_architecture.html
index de723e06e6b2de370ee49ce7d6a8af4b634c88c2..ce00b7aadcc2c2438987a0bca6bc2118491ff40e 100644
--- a/org.fortiss.af3.rcp.help/html/ta/task_architecture.html
+++ b/org.fortiss.af3.rcp.help/html/ta/task_architecture.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Task Architecture</title>
@@ -13,107 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="../requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="../requirements/MIRA.glossary.html">Glossary</a>
-								<a href="../requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-											<a href="platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-									</div>
-										<a style="background-color:#f2f2f2;">Task Architecture</a>
-										<a href="partition_architecture.html"> Partition Architecture</a>
-										<a href="allocations.html"> Deployments/Allocations</a>
-										<a href="system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="code_generation.html">Code Generation</a>
-							   </div>
-
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'task_architecture.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/ta/technical_viewpoint.html b/org.fortiss.af3.rcp.help/html/ta/technical_viewpoint.html
index 154568cf34ce62280ab80db95bf3980c86fc9ff5..dbb8ae5bdd54b17f3c7865dd9d17b107ae59f2a9 100644
--- a/org.fortiss.af3.rcp.help/html/ta/technical_viewpoint.html
+++ b/org.fortiss.af3.rcp.help/html/ta/technical_viewpoint.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="../layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = ".."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="../layout/stylesheet.css"/>
 		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
 		<title>Modeling Technical Architectures</title>
@@ -13,104 +21,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="../getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='../getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href=".././managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href=".././examples.MainPage.html">Examples</a>
-											<a href=".././tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href=".././af3_faq.html">FAQs</a>
-										</div>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href=".././rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a style="background-color:#f2f2f2;"> Requirements Analysis Node</a>
-								<a href="MIRA.glossary.html">Glossary</a>
-								<a href="MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="../ModandSim/model_element_attributes.html">Introduction to Graphical Modeling Interface</a>
-								<a href="../ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="../ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="../ModandSim/refactoring.html">Refactoring</a>
-								<a href="../ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/code_specification.html">Code Specification</a>
-										<a href="../ModandSim/state_automaton.html">State Automata</a>
-										<a href="../ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="../ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="../ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="../ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="../ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="../ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="task_architecture.html">Task Architecture</a>
-										<a href="partition_architecture.html"> Partition Architecture</a>
-										<a href="allocations.html"> Deployments/Allocations</a>
-										<a href="system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="../dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="../dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="../dse/constraints.html">Constraint Modeling</a>
-									<a href="../dse/objectives.html">Objective Modeling</a>
-									<a href="../dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-
-									<a href="../dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="../assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="../assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="../assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div> 
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'technical_viewpoint.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to 'Deployment and Code Generation'. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
diff --git a/org.fortiss.af3.rcp.help/html/templates/.ratings b/org.fortiss.af3.rcp.help/html/templates/.ratings
new file mode 100644
index 0000000000000000000000000000000000000000..0e2ac204864fa6d3478f36ce4f0399610a0917b2
--- /dev/null
+++ b/org.fortiss.af3.rcp.help/html/templates/.ratings
@@ -0,0 +1 @@
+navBarContent.html e10e4e730de7c710b926a9d7cbe9f713cd9cd0a8 GREEN
diff --git a/org.fortiss.af3.rcp.help/html/templates/navBarContent.html b/org.fortiss.af3.rcp.help/html/templates/navBarContent.html
new file mode 100644
index 0000000000000000000000000000000000000000..e10e4e730de7c710b926a9d7cbe9f713cd9cd0a8
--- /dev/null
+++ b/org.fortiss.af3.rcp.help/html/templates/navBarContent.html
@@ -0,0 +1,104 @@
+<!-- All occurences of "<PATH_TO_TOP>" are placeholders and will be replaced later with the path to the top level! -->
+<!-- All occurences of "<PAGE_NAME>" are placeholders and will be replaced later with the page name! -->
+<!-- All occurences of "<PAGE_TOPIC>" are placeholders and will be replaced later with the page topic! -->
+
+<div class="dropdown">
+	<a href="<PATH_TO_TOP>/getting_started.html" style="padding:0;">
+		<button class="btn" id="hamburger" onclick="javascript:window.location.href='<PATH_TO_TOP>/getting_started.html'">
+			<label for="hamburger" class="hamburger">
+				<span class="hamburgerLine"></span>
+				<span class="hamburgerLine"></span>
+				<span class="hamburgerLine"></span>
+			</label>
+		</button>
+	</a>
+	
+	<div class="dropdown-content"> 
+		
+		<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
+			<div class="dropdown-container">
+				<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
+					<div class="dropdown-container">
+						<a href="<PATH_TO_TOP>/managing_projects.html">Managing AutoFOCUS3 Projects</a>
+						<a href="<PATH_TO_TOP>/examples.MainPage.html">Examples</a>
+						<a href="<PATH_TO_TOP>/tipsAndTricks.html">Tips &amp; Tricks</a>
+						<a href="<PATH_TO_TOP>/af3_faq.html">FAQs</a>
+					</div>
+				<a href="<PATH_TO_TOP>/rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
+				<a href="<PATH_TO_TOP>/rcphelp.gettingstarted.MainPage.html">Contact</a>
+			</div>
+		
+		<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
+			<div class="dropdown-container">
+				<a href="<PATH_TO_TOP>/requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
+				<a href="<PATH_TO_TOP>/requirements/MIRA.glossary.html">Glossary</a>
+				<a href="<PATH_TO_TOP>/requirements/MIRA.requirements.html">Requirements</a>
+			</div>
+	
+		
+		<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
+		  <div class="dropdown-container">
+			<a href="<PATH_TO_TOP>/ModandSim/model_element_attributes.html" >Introduction to Graphical Modeling Interface</a>
+			<a href="<PATH_TO_TOP>/ModandSim/component_architecture.html">Component Architecture Modeling</a>
+			<a href="<PATH_TO_TOP>/ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
+			<a href="<PATH_TO_TOP>/ModandSim/refactoring.html">Refactoring</a>
+			<a href="<PATH_TO_TOP>/ModandSim/model_markers_view.html">On-the-fly Checks</a>
+			<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
+				<div class="dropdown-container">
+					<a href="<PATH_TO_TOP>/ModandSim/code_specification.html">Code Specification</a>
+					<a href="<PATH_TO_TOP>/ModandSim/state_automaton.html">State Automata</a>
+					<a href="<PATH_TO_TOP>/ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
+					<a href="<PATH_TO_TOP>/ModandSim/mode_automaton.html"> Mode Automata</a>
+				</div>
+			<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
+				<div class="dropdown-container">
+					<a href="<PATH_TO_TOP>/ModandSim/simulation_with_af3.html">Simulation</a>
+					<a href="<PATH_TO_TOP>/ModandSim/operatorpanels.html">Operator Panels</a>
+					<a href="<PATH_TO_TOP>/ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
+					<a href="<PATH_TO_TOP>/ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
+				</div>
+	
+		  </div>
+		
+		<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
+	   		<div class="dropdown-container">
+				<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
+					<div class="dropdown-container">
+						<a href="<PATH_TO_TOP>/ta/platform_architecture.html">Platform Architecture</a>
+							<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
+								<div class="dropdown-container">
+									<a href="<PATH_TO_TOP>/ta/platform_architecture_generic.html">Generic Platform Architecture</a>
+									<a href="<PATH_TO_TOP>/ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
+									<a href="<PATH_TO_TOP>/ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
+								</div>
+						<a href="<PATH_TO_TOP>/ta/task_architecture.html">Task Architecture</a>
+						<a href="<PATH_TO_TOP>/ta/partition_architecture.html"> Partition Architecture</a>
+						<a href="<PATH_TO_TOP>/ta/allocations.html"> Deployments/Allocations</a>
+						<a href="<PATH_TO_TOP>/ta/system_schedule.html"> System Schedule</a>
+					</div>
+				<a href="<PATH_TO_TOP>/ta/code_generation.html">Code Generation</a>
+	   		</div>
+	
+		
+		<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
+		   <div class="dropdown-container">
+				<a href="<PATH_TO_TOP>/dse/dse_perspective.html">DSE Perspective Overview</a>
+				<a href="<PATH_TO_TOP>/dse/dse_dashboard.html">DSE Dashboard</a>
+				<a href="<PATH_TO_TOP>/dse/constraints.html">Constraint Modeling</a>
+				<a href="<PATH_TO_TOP>/dse/objectives.html">Objective Modeling</a>
+				<a href="<PATH_TO_TOP>/dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
+				<a href="<PATH_TO_TOP>/dse/visualization.html">Solution Visualization</a>
+		   </div>
+		   
+		<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
+		   <div class="dropdown-container">
+				<a href="<PATH_TO_TOP>/assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
+				<a href="<PATH_TO_TOP>/assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
+				<a href="<PATH_TO_TOP>/assuranceCases/maintenance.html">Assurance Case Maintenance</a>
+		   </div>
+	</div>
+</div>
+
+<div class="topnav-right">
+	<a href="mailto:af_user@lists.fortiss.org?subject=Reporting '<PAGE_NAME>' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to <PAGE_TOPIC>. {Please specify the problem precisely here.}.">Report a Problem?</a>
+</div>
\ No newline at end of file
diff --git a/org.fortiss.af3.rcp.help/html/tipsAndTricks.html b/org.fortiss.af3.rcp.help/html/tipsAndTricks.html
index 84078f2bbea99db29dfa1a38d59dda2540ee00fa..016873a68e57f72aae5a33c937612fbc32b4bc0f 100644
--- a/org.fortiss.af3.rcp.help/html/tipsAndTricks.html
+++ b/org.fortiss.af3.rcp.help/html/tipsAndTricks.html
@@ -4,6 +4,14 @@
 
 <html>
 	<head>
+		<script src='https://code.jquery.com/jquery-1.11.0.min.js'></script>
+		<script src="./layout/jsscript/navBarReplacer.js"></script>
+		<script>
+			// THE FOLLOWING CONSTANT NEEDS TO BE ADJUSTED ACCORDING TO THE PLACE/PATH OF THIS PAGE!
+			const pathToTop = "."; // e.g. if this page is on top level: "." or if it is in two sub-folders: "../.."
+			$.get(pathToTop + "/templates/navBarContent.html", function(data){loadNavigationBarWithReplacements(data, pathToTop);});
+		</script>
+		
 		<link rel="stylesheet" type="text/css" href="./layout/stylesheet.css"/>
 		<title>Tips and Tricks</title>
 	</head>
@@ -12,106 +20,7 @@
 		<div class="header">
 			<div class="box">
 				<div class="navbar">
-					<div class="dropdown">
-						<a href="./getting_started.html" style="padding:0;">
-							<button class="btn" id="hamburger" onclick="javascript:window.location.href='./getting_started.html'">
-								<label for="hamburger" class="hamburger">
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-									<span class="hamburgerLine"></span>
-								</label>
-							</button>
-						</a>
-						<div class="dropdown-content">
-							<button class="dropdown-btn">Getting Started<i class="caret-down"></i></button>
-								<div class="dropdown-container">
-									<button class="dropdown-btn">Resources for Users<i class="caret-down"></i></button>
-										<div class="dropdown-container">
-											<a href="managing_projects.html">Managing AutoFOCUS3 Projects</a>
-											<a href="examples.MainPage.html">Examples</a>
-											<a href="tipsAndTricks.html">Tips &amp; Tricks</a>
-											<a href="af3_faq.html">FAQs</a>
-										</div>
-									<a href="rcphelp.gettingstarted.MainPage.html">Resources for Developers</a>
-									<a href="rcphelp.gettingstarted.MainPage.html">Contact</a>
-								</div>
-							
-							
-							<button class="dropdown-btn">Requirements Engineering<i class="caret-down"></i></button>
-							<div class="dropdown-container">
-								<a href="./requirements/MIRA.requirements_analysis.html"> Requirements Analysis Node</a>
-								<a href="./requirements/MIRA.glossary.html">Glossary</a>
-								<a href="./requirements/MIRA.requirements.html">Requirements</a>
-							</div>
-
-							
-							<button class="dropdown-btn">Modeling and Simulation<i class="caret-down"></i></button>
-							  <div class="dropdown-container">
-								<a href="./ModandSim/model_element_attributes.html">Introduction to Graphical Modeling Interface</a>
-								<a href="./ModandSim/component_architecture.html">Component Architecture Modeling</a>
-								<a href="./ModandSim/data_dictionary.html">Data Dictionary: Types and Functions</a>
-								<a href="./ModandSim/refactoring.html">Refactoring</a>
-								<a href="./ModandSim/model_markers_view.html">On-the-fly Checks</a>
-								<button class="dropdown-btn">Behavior Modeling<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ModandSim/code_specification.html">Code Specification</a>
-										<a href="./ModandSim/state_automaton.html">State Automata</a>
-										<a href="./ModandSim/hierarchical_state_automaton.html">Hierarchical State Automata</a>
-										<a href="./ModandSim/mode_automaton.html"> Mode Automata</a>
-									</div>
-								<button class="dropdown-btn">Simulation<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ModandSim/simulation_with_af3.html">Simulation</a>
-										<a href="./ModandSim/operatorpanels.html">Operator Panels</a>
-										<a href="./ModandSim/operatorpanels_advanced.html">Advanced Operator Panels</a>
-										<a href="./ModandSim/cosimulation_with_af3.html"> Co-Simulation and FMI Support</a>
-									</div>
-
-							  </div>
-							
-							<button class="dropdown-btn">Deployment and Code Generation<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-								<button class="dropdown-btn">Modeling Technical Architectures<i class="caret-down"></i></button>
-									<div class="dropdown-container">
-										<a href="./ta/platform_architecture.html">Platform Architecture</a>
-											<button class="dropdown-btn">Supported Platform Architectures<i class="caret-down"></i></button>
-  												<div class="dropdown-container">
-    													<a href="./ta/platform_architecture_generic.html">Generic Platform Architecture</a>
-													<a href="./ta/platform_architecture_hierarchical.html">Hierarchical Platform Architecture</a>
-													<a href="./ta/platform_architecture_raspberrypi.html">RaspberryPi Platform Architecture</a>
-								</div>
-										<a href="./ta/task_architecture.html">Task Architecture</a>
-										<a href="./ta/partition_architecture.html"> Partition Architecture</a>
-										<a href="./ta/allocations.html"> Deployments/Allocations</a>
-										<a href="./ta/system_schedule.html"> System Schedule</a>
-									</div>
-								<a href="./ta/code_generation.html">Code Generation</a>
-							   </div>
-							
-							<button class="dropdown-btn">Design Space Exploration (DSE)<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-
-									<a href="dse/dse_perspective.html">DSE Perspective Overview</a>
-									<a href="dse/dse_dashboard.html">DSE Dashboard</a>
-									<a href="dse/constraints.html">Constraint Modeling</a>
-									<a href="dse/objectives.html">Objective Modeling</a>
-									<a href="dse/synthesis.html">Deployment/Schedule Synthesis (Exploration)</a>
-									<a href="dse/schedule_synthesis.html">Schedule Synthesis</a>
-									<a href="dse/visualization.html">Solution Visualization</a>
-							   </div>
-							<button class="dropdown-btn">Assurance Case Modeling<i class="caret-down"></i></button>
-							   <div class="dropdown-container">
-									<a href="assuranceCases/creation.html">Modeling GSN-based Assurance Cases</a>
-									<a href="assuranceCases/assessment.html">Quantitative Assessment of Assurance Cases</a>
-									<a href="assuranceCases/maintenance.html">Assurance Case Maintenance</a>
-							   </div>
-						</div>
-					</div>
-					</div> 
-					<div class="topnav-right">
-						<a href="mailto:af_user@lists.fortiss.org?subject=Reporting 'tipsAndTricks.html' Documentation Problem!&body= Dear AutoFOCUS3 team, I am reporting an issue related to Further Resources. 
-       {Please specify the problem precisely here.}.">Report a Problem?</a>
-					</div>
+					<div id="navBarPlaceholder"></div>
 				</div>
 			</div>
 		</div>
@@ -146,7 +55,7 @@ You can make these parts visible by enabling the <i>Expert View</i> by pressing
 			<img src="./pictures/ToggleExpertView.png"/>
 
 		</div>
-		<script src="../layout/jsscript/topBtn.js"></script>
+		<script src="./layout/jsscript/topBtn.js"></script>
 		<script src="./layout/jsscript/submenuScript.js"></script>
 		<div class="footer">
 				<p>