diff --git a/src/core/templates/header-menu.html b/src/core/templates/header-menu.html
new file mode 100644
index 0000000..03b9ab6
--- /dev/null
+++ b/src/core/templates/header-menu.html
@@ -0,0 +1,12 @@
+{% extends "layout.html" %}
+{% block header_menu %}
+    <div class="container">
+        <div class="row">
+            <div class="col justify-content-center text-center">
+                <h1>Hello World!</h1>
+                <p>Using dark themed Bootstrap 4 css files...</p>
+                <p>Themes:&nbsp;<a href="https://bootswatch.com/" target="_blank">Bootswatch</a></p>
+            </div>
+        </div>
+    </div>
+{% endblock header_menu %}
diff --git a/src/core/templates/index.html b/src/core/templates/index.html
index f9ab6f9..97a8229 100644
--- a/src/core/templates/index.html
+++ b/src/core/templates/index.html
@@ -1,4 +1,9 @@
 {% extends "layout.html" %}
+
+{% block body_header %}
+<h1 style=" position: fixed; top: 0em;">Footer</h1>
+{% endblock body_header %}
+
 {% block content %}
     <div class="container">
         <div class="row">
@@ -11,9 +16,14 @@
     </div>
 {% endblock content %}
 
-{% block scripts %}
+
+{% block body_footer %}
+<h1 style=" position: fixed; bottom: 0em;">Footer</h1>
+{% endblock body_footer %}
+
+{% block body_scripts %}
     <script src="{{ url_for('static', filename='js/ui-logic.js')}}"></script>
     <script src="{{ url_for('static', filename='js/post-ajax.js')}}"></script>
     <script src="{{ url_for('static', filename='js/ajax.js')}}"></script>
     <script src="{{ url_for('static', filename='js/events.js')}}"></script>
-{% endblock scripts %}
+{% endblock body_scripts %}
diff --git a/src/core/templates/layout.html b/src/core/templates/layout.html
index dc35844..292f278 100644
--- a/src/core/templates/layout.html
+++ b/src/core/templates/layout.html
@@ -12,21 +12,24 @@
     <link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap/bootstrap.min.css')}}">
     <link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap/bootstrap-datepicker.css')}}">
 
-    {% block headercss %}
-
+    {% block header_css %}
     {% endblock %}
 
-    {% block headerscripts %}
-
+    {% block header_scripts %}
     {% endblock %}
 
 </head>
 <body>
 
-{% block content %}
-
+{% block body_header %}
 {% endblock %}
 
+{% block content %}
+{% endblock %}
+
+
+{% block body_footer %}
+{% endblock %}
 
 <!-- For Bootstrap in this exact order... -->
 <script src="{{ url_for('static', filename='js/bootstrap/jquery-3.3.1.slim.min.js')}}"></script>
@@ -37,8 +40,7 @@
 <script src="{{ url_for('static', filename='js/bootstrap/moment.min.js')}}"></script>
 <script src="{{ url_for('static', filename='js/bootstrap/bootstrap-datepicker.min.js')}}"></script>
 
-{% block scripts %}
-
+{% block body_scripts %}
 {% endblock %}
 
 </body>
