From 95ecebbae071dc9ee20370690540858341bda1d4 Mon Sep 17 00:00:00 2001
From: Jonas Leder <jonas@jonasled.de>
Date: Sun, 20 Dec 2020 00:33:23 +0100
Subject: [PATCH] added extra files for header and footer, which can be just
 imported

---
 Projekte/URLkuerzer1.php                      |  97 ++---------------
 Projekte/URLkuerzer2.php                      |  97 ++---------------
 Projekte/blitzortung.php                      |  97 ++---------------
 Projekte/gclogLink.php                        |  97 ++---------------
 Projekte/insecam.php                          |  97 ++---------------
 Projekte/ledtisch1.php                        |  93 ++--------------
 Projekte/ledtisch2.php                        |  97 ++---------------
 Projekte/mqttpush.php                         |  97 ++---------------
 Projekte/proxdroid.php                        | 100 ++----------------
 Projekte/regensensor.php                      |  97 ++---------------
 Projekte/smartmirror.php                      |  98 ++---------------
 Projekte/snowboy.php                          | 100 ++----------------
 Projekte/websitecloner.php                    |  98 ++---------------
 Projekte/youtubedownloader.php                |  97 ++---------------
 about.html                                    |  62 -----------
 about.php                                     |  22 ++++
 bildquellen.html                              |  57 ----------
 bildquellen.php                               |  13 +++
 ...klaerung.html => datenschutzerklaerung.php |  56 ++--------
 impressum.php                                 |  57 ++--------
 index.php                                     |  59 ++---------
 internal/comments.php                         |  45 ++++++++
 internal/footer.php                           |  11 ++
 internal/header.php                           |  49 +++++++++
 ntpstatus.html                                |  77 --------------
 ntpstatus.php                                 |  33 ++++++
 post.php                                      |  56 ++--------
 27 files changed, 309 insertions(+), 1650 deletions(-)
 delete mode 100644 about.html
 create mode 100644 about.php
 delete mode 100644 bildquellen.html
 create mode 100644 bildquellen.php
 rename datenschutzerklaerung.html => datenschutzerklaerung.php (95%)
 create mode 100644 internal/comments.php
 create mode 100644 internal/footer.php
 create mode 100644 internal/header.php
 delete mode 100644 ntpstatus.html
 create mode 100644 ntpstatus.php

diff --git a/Projekte/URLkuerzer1.php b/Projekte/URLkuerzer1.php
index 9b858c7..0deb0ad 100644
--- a/Projekte/URLkuerzer1.php
+++ b/Projekte/URLkuerzer1.php
@@ -1,51 +1,10 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("URL K&auml;rzer V1", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>URL K&uuml;rzer V1 - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">URL K&uuml;rzer V1</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>Da Google seinen URL kürzer leider einstellt (vgl. <a href="https://developers.googleblog.com/2018/03/transitioning-google-url-shortener.html">https://developers.googleblog.com/2018/03/transitioning-google-url-shortener.html</a> ), habe ich mir das Ziel genommen selber einen schnellen URL kürzer ohne Werbung (wie z.b. <a href="https://adf.ly/">adf.ly</a>) zu schreiben. Zum Einsatz kommt dabei PHP für das Frontend Python für die SQL abfragen und MySQL als Datenbank.</p>
     <p>Wenn ihr den Quellcode verwenden wollt müsst ihr in eurem Webserver noch ein Alias konfigurieren. Für Apache würde dieser beispielhaft folgendermaßen lauten:</p>
     <p><em>AliasMatch "^/(.*)" "/var/www/url_shorter/index.php"</em></p>
@@ -53,48 +12,8 @@ include "../internal/getGravatar.php";
     <p><img src="/img/URL-kuerzer1.png"></p>
     <p><strong>Update:</strong> Da das alte Design nicht besonders schön aussah habe ich mich dazu entschlossen ein neues Design zu verwenden, welches jetzt auf <a href="https://getbootstrap.com/">Bootstrap</a> basiert. Das Design ist <a href="https://kurz.ml/design">hier</a> zu finden. Für die Benachrichtigungen unten rechts habe ich das <a href="https://github.com/kamranahmedse/jquery-toast-plugin">jquery-toast-plugin</a> von kamranahmedse verwendet. Desweiteren kann man sich in der neuen Version auch einen Link selber aussuchen. Die Weiterleitung blieb gleich wie vorher, dass heißt die alten links bleiben weiterhin bestehen und werden auch in Zukunft noch funktionieren. Eine weitere Anpassung, welche noch gemacht werden muss ist, dass er files Ordner auf einen anderen (sub)domain ausgelagert werden muss und in der index.php angepasst werden muss.</p><br>
     <a href="/files/shorter.zip"><button>Download</button></a>
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/URLkuerzer2.php b/Projekte/URLkuerzer2.php
index 1b395b1..04e92e5 100644
--- a/Projekte/URLkuerzer2.php
+++ b/Projekte/URLkuerzer2.php
@@ -1,51 +1,10 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("URL K&auml;rzer V2", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>URL K&uuml;rzer V2 - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">URL K&uuml;rzer V2</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>Mein alter URL kürzer war zwar schon gut, jedoch hatte ich den kompletten Code sehr unübersichtlich gestaltet mit allem in einer PHP Datei und Alis Konfigurationen im Webserver. Dies war alles sehr unübersichtlich und schwer zu erweitern, selber hosten. Daher habe ich mich entschieden alles von vorne zu Programmieren und dabei auf möglichst übersichtlichen Code zu achten. Desweiteren war mir wichtig, dass jeder den URL kürzer mit möglichst kleinem Aufwand selber hosten kann. Daher habe ich mich für Python mit Flask und Waitress als Webserver entschieden. Das schöne an Flask ist, dass man eine dynamische HTML-Datei hat und im eigentlichen Python Script nur noch die Platzhalter ausfüllt. Als Datenspeicher habe ich mich diesesmal für SQLite entschieden, da dieses von der Performance völlig ausreichend ist und mit weniger Aufwand verbunden ist. Zum einfachen selber aufsetzen habe ich alles in einen Docker-Container verpackt. Neben des komplett neu geschriebenen Codes habe ich auch ein paar neue Features verbaut. So stehen nun mehrere Domains zur Verfügung (wie man es von adf.ly kennt). Zur Zeit sind es 8 Domains, dies kann sich aber noch ändern. Eine weitere Veränderung ist, dass nach dem kürzen eines URLs nun auch ein QR-Code angezeigt wird, mit diesem ist das teilen der Links noch einfacher. Und zu guter letzt ein für mich sehr wichtiges Feature ist die Größe der Website. Die Neue Website ist jetzt nur noch wenige Kilobyte groß. Das Schöne an der Verteilmethode via Docker ist auch, dass es für den Server kaum Voraussetzungen gibt. So muss nur Docker installiert sein. Es empfiehlt sich zwar noch einen Webserver als HTTPS Proxy zu installieren. Dies ist aber nicht zwingend notwendig.</p>
     <h3>UPDATES:</h3>
     <ol><li>Ich habe mittlerweile einige neue Features implementiert. Dazu gehört ein Login System, mit welchem man seine eigenen Links einsehen und löschen kann. Dazu gibt es jetzt noch einen Darkmode, welcher automatisch eingeschaltet wird, wenn dies im Browser eingestellt ist. Dies waren jetzt die beiden Hauptänderungen, ich habe natürlich noch einiges mehr geändert / neu Implementiert, werde jetzt hier aber nicht alles aufzählen.</li><li>Überall wird aktuell ein Darkmode implementiert, warum also auch nicht hier.</li></ol>
@@ -53,48 +12,8 @@ include "../internal/getGravatar.php";
     Aktueller build Status: <img src="http://gitlab.jonasled.de/jonasled/url_shorter_docker/badges/master/pipeline.svg"><br>
     <img src="/img/kurz_ml_light.png">
     <img src="/img/kurz_ml_ldark.jpg">
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/blitzortung.php b/Projekte/blitzortung.php
index 3113342..e1745ad 100644
--- a/Projekte/blitzortung.php
+++ b/Projekte/blitzortung.php
@@ -1,51 +1,10 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("Blitzortung", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Blitzortung - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Blitzortung</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>Mir wurde in den letzten bei den Gewittern hier in Deutschland die Seite <a href="https://www.lightningmaps.org/#x=;m=sat;r=0;t=3;s=0;o=0;b=;">lightningmaps.org</a>&nbsp;vorgeschlagen, welche ihre Daten vom Gemeinnützigen Projekt blitzortung.org bezieht. Da ich technisch sehr interessiert bin wollte ich natürlich gleich wissen wie diese Seite funktioniert. Online stand dann auch unter <a href="http://de.blitzortung.org/cover_your_area.php">mitmachen</a>, dass sie Seite auf private Anlagen setzt. Beim weiteren Surfen auf der Seite habe ich dann herausgefunden, dass es ein <a href="http://de.blitzortung.org/station_list.php">Verzeichnis</a> aller Stationen gibt, aber ohne Karte. Beim weiteren nachdenken kam ich auf die Idee, dass man das ganze ja so ähnlich wie meine <a href="https://jonasled.tk/insecam/">insecam Karte</a> umsetzen kann. Es gab nur ein Problem, ich hatte keine Koordinaten, sonder nur Ortsangaben. Dies konnte ich aber über eine API von Google lösen. Als die Karte dann lief, ist mir eingefallen, dass ich vielleicht die Marker färben könnte und somit den Status der Station darstellen könnte.</p>
     <p>Diese drei Marker gibt es:</p>
     <p><a href="https://blitzortung.jonasled.de/red-dot.png"><img class="alignnone size-large" src="https://blitzortung.jonasled.de/red-dot.png" width="32" height="32"></a>Offline<br><a href="https://blitzortung.jonasled.de/green-dot.png"><img class="alignnone size-large" src="https://blitzortung.jonasled.de/green-dot.png" width="32" height="32"></a>Online<br><a href="https://blitzortung.jonasled.de/ltblue-dot.png"><img class="alignnone size-large" src="https://blitzortung.jonasled.de/ltblue-dot.png" width="32" height="32"></a>Idle<br><a href="https://blitzortung.jonasled.de/blue-dot.png"><img class="alignnone size-large" src="https://blitzortung.jonasled.de/blue-dot.png" width="32" height="32"></a>Unknown</p>
@@ -57,48 +16,8 @@ include "../internal/getGravatar.php";
     <p>Da Google für seine Karten auf eigenen Websites seit dem 16.Juli Geld verlangt habe ich die Karte auf leaflet umgeschrieben, welche die OSM Karten von Mapbox bezieht.</p><br>
     <a href="/files/blitzortung.zip"><button>Download V1</button></a>
     <a href="/files/blitzortung_v2.zip"><button>Download V2</button></a>
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/gclogLink.php b/Projekte/gclogLink.php
index e313b51..f6bc853 100644
--- a/Projekte/gclogLink.php
+++ b/Projekte/gclogLink.php
@@ -1,94 +1,13 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("Geocaching Premium Log link Generator", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Geocaching Premium Log link Generator - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Geocaching Premium Log link Generator</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>Da ich auf <a href="https://geocaching.com">Geocaching.com</a> keine Premium Mitgliedschaft besitze, aber meine Eltern schon, mache ich auch manchmal mit denen Geocaches, welche nur für Premium Nutzer gedacht sind. Das loggen dieser Caches ist trotzdem möglich, vorausgesetzt, man weiß wie der Link aufgebaut ist. Daher habe ich ein Script für <a href="https://tampermonkey.net/">Tampermonkey</a>&nbsp;entwickelt, welches einen Button unter die Premium Meldung platziert, welcher einen zum Log weiterleitet. Ein Screenshot ist unten zu sehen. Den Script habe ich auf&nbsp;<a href="https://greasyfork.org">greasyfork.org</a>&nbsp;veröffentlicht, da dies eine sehr bekannte Seite für Scripte ist. Der Link zu meinem Script lautet:&nbsp;<a href="https://greasyfork.org/de/scripts/372017-geocaching-log-premium-for-free">greasyfork.org/de/scripts/372017-geocaching-log-premium-for-free</a></p>
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/insecam.php b/Projekte/insecam.php
index b03304d..3145d47 100644
--- a/Projekte/insecam.php
+++ b/Projekte/insecam.php
@@ -1,51 +1,10 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("Insecam", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Insecam - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Insecam</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>Insecam ist eine Seite, auf der viele ungesicherte Kameras streams dargestellt werden. Leider wird die Darstellung auf der Seite von Insecam ohne Karte gemacht, obwohl die Position online steht. Daher kam ich auf die Idee selbst eine Karte zu programmieren. Herausgekommen ist <a href="https://insecam.jonasled.tk">diese</a> wunderschöne Karte. Wer sich den Quellcode genauer anschaut wird sich fragen ob es sinnvoll ist alle Daten der Kameras beim Seitenaufbau zu laden, da die Variabel ja mehrere Megabyte groß ist. Die Antwort ist ja, da der Browser nur die Teile lädt die er braucht. Ein Versuch eines Freund das ganze mit einer SQL Datenbank zu lösen war langsamer und aufwendiger, deswegen ist dies die beste Lösung. Aktuell werden nur deutsche Kameras gescannt, dies kann man aber durch das abändern der Länder variable ändern.</p>
     <h2>Update 1:</h2>
     <p>Da ich festgestellt habe, dass die Streams in manchen Browsern in der Vorschau blockiert werden, habe ich einen Proxy eingerichtet, welcher die Streams über eine verschlüsselte Verbindung überträgt. Dadurch sollten das Problem mit der Vorschau behoben sein. Der Proxy Script kann auf GitHub gefunden werden: <a href="https://github.com/jenssegers/php-proxy">https://github.com/jenssegers/php-proxy</a> . In der Config sollte man aber die anpassen, dass die URLs nicht codiert werden.</p>
@@ -58,48 +17,8 @@ include "../internal/getGravatar.php";
     <img src="/img/Insecam.png"><br>
     <p>Neue Karte mit Leaflet:</p>
     <img src="/img/insecam_neu.png"><br>
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/ledtisch1.php b/Projekte/ledtisch1.php
index ea67bbf..f458e76 100644
--- a/Projekte/ledtisch1.php
+++ b/Projekte/ledtisch1.php
@@ -1,51 +1,10 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("LED Tisch V1", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>LED Tisch v1 - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">LED Tisch v1</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <h2><span style="color: #ff0000;">Du betrachtest Version 1. Zu Version 2 geht es <a style="color: #ff0000;" href="https://jonasled.tk/?page_id=285">hier</a></span></h2>
     <h2> </h2>
     <h2>Materialien:</h2>
@@ -158,48 +117,8 @@ include "../internal/getGravatar.php";
         <li>Die LED sollte ausgehen.</li>
     </ul>
     <p><del>Den Quellcode findet ihr auf meinem <a href="https://git.jonasled.tk/jonasled/LED-Tisch">git Server</a> in der <a href="https://git.jonasled.tk/jonasled/LED-Tisch/src/branch/alt">alt Branch</a></del></p>
-    <h2>Kommentare:</h2>
     <?php
 
     $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
-
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+    getComments($article);
+    getFooter();
\ No newline at end of file
diff --git a/Projekte/ledtisch2.php b/Projekte/ledtisch2.php
index dafdd0d..df7f373 100644
--- a/Projekte/ledtisch2.php
+++ b/Projekte/ledtisch2.php
@@ -1,51 +1,10 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("LED Tisch V2", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>LED Tisch v2 - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">LED Tisch v2</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <h2>Materialien für den LED Tisch:</h2>
     <ul>
         <li><a href="https://goo.gl/Dz8cbq">Ikea Lack Tisch</a></li>
@@ -85,48 +44,8 @@ include "../internal/getGravatar.php";
     <p><strong>Quellcode:</strong></p>
     <ul><li><a href="https://gitlab.jonasled.de/jonasled/LED_Tisch">https://gitlab.jonasled.de/jonasled/LED_Tisch</a></li><li><a href="https://gitlab.jonasled.de/jonasled/LED_Tisch_App_Android">https://gitlab.jonasled.de/jonasled/LED_Tisch_App_Android</a></li><li><a href="https://gitlab.jonasled.de/jonasled/LED_Tisch_Rendering">https://gitlab.jonasled.de/jonasled/LED_Tisch_Rendering</a></li></ul><br>
     <img src="/img/ledTisch2.jpg">
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/mqttpush.php b/Projekte/mqttpush.php
index 37fc50d..4d49e35 100644
--- a/Projekte/mqttpush.php
+++ b/Projekte/mqttpush.php
@@ -1,97 +1,16 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("MQTT Push", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>MQTT Push - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">MQTT Push</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>MQTT Push ist ein kleines Programm, welches von mir entwickelt wurde. das Programm läuft auf Windows und sendet eine Toast Nachricht, wenn auf einem vorher eingestellten Topic des local gehostetem MQTT Server etwas gesendet wird. Einen Screenshot dazu habe ich unten angefügt. Der Client unterstützt Server mit und ohne Passwort,  es können auch mehrere gleichzeitig betrieben werden. Der quellcode ist auf meinem Git Server unter  <a href="https://gitlab.jonasled.de/jonasled/MQTT_Push">https://gitlab.jonasled.de/jonasled/MQTT_Push</a> zu finden. Desweiteren habe ich unten einen installer angehängt.</p>
     <a href="/files/MQTT_Message.zip"><button>Download</button></a><br>
     <img src="/img/MQTT-push.png">
     <img src="/img/MQTT-push-window.png">
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/proxdroid.php b/Projekte/proxdroid.php
index 2d6d4c1..5785508 100644
--- a/Projekte/proxdroid.php
+++ b/Projekte/proxdroid.php
@@ -1,102 +1,18 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("Proxdroid", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Proxdroid - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Proxdroid - Android Client für Proxmox</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>Ich setze schon seit einer ganzen weile auf meinem Homeserver auf Proxmox, leider gab es bisher für Android nur einen Client, dieser ist aber Kostenpflichtig, daher habe ich mir gedacht, wie wäre es mit einer kostenlosen Alternative, die besser ist. Was bei meinen Projekten natürlich auch wichtig ist, ist das veröffentlichen des Quellcodes, dass jeder helfen / seine eigene Version bereitstellen kann. Dieses mal habe ich aber nicht auf meine eigene Gitlab Instanz, sondern auf die öffentliche gesetzt, da ich dort die schnelleren Runner zur Verfügung habe. Die repo ist unter folgendem Link erreichbar: <a href="https://gitlab.com/jonasled/proxdroid">gitlab.com/jonasled/proxdroid</a> </p>
     <p>Natürlich habe ich die App auch im <a href="https://play.google.com/store/apps/details?id=de.jonasled.proxdroid">PlayStore</a> veröffentlicht, um sie so einfach wie möglich herunterladen zu können. Für die, die den PlayStore meiden wollen gibt es aber auch die <a href="https://gitlab.com/jonasled/proxdroid/-/releases">Releases</a> direkt auf GitLab. Um neue Features einzureichen oder sich untereinander zu helfen habe ich daneben noch einen <a href="https://discord.gg/JEuXW8h">Discord</a> eingerichtet.</p><br>
     <img src="/img/Nexus_6P_-_Screenshot_11-576x1024.png">
     <img src="/img/Nexus_6P_-_Screenshot_21-576x1024.png">
     <img src="/img/Nexus_6P_-_Screenshot_31-576x1024.png">
     <img src="/img/Nexus_6P_-_Screenshot_41-576x1024.png">
+<?php
 
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
-
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/regensensor.php b/Projekte/regensensor.php
index 10353a7..19a630a 100644
--- a/Projekte/regensensor.php
+++ b/Projekte/regensensor.php
@@ -1,51 +1,10 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("Regensensor", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Regensensor - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Regensensor</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>Da es in mein Zimmer bei offenem Fenster reinregnet habe ich mich dazu entschieden einen Regensensor zu bauen, welcher bei Regen einen Alarm auslöst um mich zu wecken. Der Regensensor besteht aus einer Lochrasterplatine, bei der jeweils abwechselnd eine Zeile an den Sensorpin und die andere an Masse geht, ähnlich wie bei den fertigen Sensoren, nur größer. (vgl. kurz.ml/zpjiM6) Dieser ist direkt mit dem Analogen Eingang des Arduinos verbunden, welcher über den internen Pullup auf 5V ligt, wenn nun ein Regentropfen zwei unterschiedliche Zeilen der Lochraster verbindet, sinkt die Spannung und der Sensor löst aus. Als Alarm dient ein Piezo, welcher über den tone Befehl des Arduinos angesteuert wird. Im Schaltplan gehen links bunte Kabel raus, da ich aus einem alten <a href="https://de.wikipedia.org/wiki/KVM-Switch">KVM Switch</a> noch einen Taster mit zweifarbiger LED übrig hatte. Die Stromversorgung des Aufbaus geschieht über USB. Die 3D Datei für das gehäuse findet ihr auf <a href="https://www.thingiverse.com/thing:2950996">Thingiverse</a> oder in der <a href="https://git.jonasled.tk/jonasled/Regensensor">Git Repo</a>. Für Einstellungen und logging (fals erwünscht) ist in der <a href="https://git.jonasled.tk/jonasled/Regensensor">Git Repo</a> noch eine Excel datei, mit Macro, über die das abläuft</p>
     <p>Belegung des Kabels:</p>
     <table>
@@ -73,48 +32,8 @@ include "../internal/getGravatar.php";
         </tbody>
     </table><br>
     <img src="/img/regensensor.jpg">
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/smartmirror.php b/Projekte/smartmirror.php
index db30f3e..a168615 100644
--- a/Projekte/smartmirror.php
+++ b/Projekte/smartmirror.php
@@ -1,51 +1,10 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("Smart Mirror", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Smart Mirror - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Smart Mirror</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>Da ich ja viel Smart unterwegs bin und auch gerne schnell meine Termine sehen möchte, habe ich mir einen Smart Mirror gebaut. Dieser zeigt neben Nachrichten auch E-Mails, Wetter Kalender und Daten der Schule wie z.B. Arbeiten an. Folgende Materialien habe ich dazu verwendet:</p>
     <ul>
         <li><a href="https://www.ikea.com/de/de/catalog/products/00378403/">Ikea Bilderrahmen Ribba</a></li>
@@ -61,49 +20,8 @@ include "../internal/getGravatar.php";
     <p>Den Quellcode von meiner Software findet ihr natürlich wieder auf meinem <a href="https://git.jonasled.de/jonasled/SmartMirror">Git  Server</a></p><br>
     <a href="/files/SmartMirror.zip"><button>Download</button></a><br><br>
     <img src="/img/Spiegel.jpg">
+<?php
 
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
-
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/snowboy.php b/Projekte/snowboy.php
index eb0e7bf..3963363 100644
--- a/Projekte/snowboy.php
+++ b/Projekte/snowboy.php
@@ -1,53 +1,10 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("Installation von Snowboy", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Installation von Snowboy - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <link href="/css/prism.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Installation von Snowboy</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>Heute stelle ich mal kein Projekt in dem Sinne vor wie sonst, sondern schreibe viel mehr eine Anleitung zur Installation von Snowboy, da dich viele Probleme dabei hatte und im Internet auch relativ wenig dazu stand. Wir sind in der Schule aktuell dabei einen Smarten Lautsprecher auf Basis des Google AIY Projekts aufzubauen. Das Problem war, dass uns das Hotword "ok, google" nicht gefallen hatte. Nach ein paar Minuten googlen sind wir dann auf die Bibliothek Snowboy gestoßen, mit welcher alle Probleme gelöst werden sollten. Das Problem war nur, dass wir die Bibilothek nicht kompiliert bekommen haben. Die folgende Anleitung sollte auf allen Linux Maschinen (Raspberry Pi, Ubuntu, Debian, ...) laufen. Es kann aber vorkommen dass noch vereinzelt weitere Pakete installiert werden müssen. In der folgenden Anleitung verwende ich eine Aktuelle LinuxMint Tara Version mit allen Updates von 1.Dezember 2018.</p>
     <p>Kommen wir nun zur Installationsanleitung:</p>
     <p>1.Updates installieren:</p>
@@ -84,49 +41,8 @@ make
     <p>Kleiner Ergänzung, bei der Installation auf einem Raspberry Pi bin ich auf zwei Fehler gestoßen. Der erste war, dass der Raspberry Pi keinen direkten Mikrofon Eingang hatte. Der zweiter war dann schon etwas exotischer, ich habe nämlich meine China USB Soundkarte zum testen angeschlossen. Dort kam aber nur als Fehler "Invalid Sample Rate". Das Problem der Soundkarte ist, dass sie nur 44kHz als Abtastrate unterstützt, Snowboy braucht aber eine Abtastrate von 16kHz wie ich daraufhin nachgelesen habe. Unten sind zwei Screenshots der Fehler angefügt.</p><br>
     <img src="/img/snowboy_no_mic.png">
     <img src="/img/snowboy_wrong_sample_rate.png">
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-<script src="/js/prism.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/websitecloner.php b/Projekte/websitecloner.php
index e8d18bd..7d30750 100644
--- a/Projekte/websitecloner.php
+++ b/Projekte/websitecloner.php
@@ -1,98 +1,16 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("Website Cloner", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Website Cloner - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Website Cloner</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
 <p>
     Da ich in letzter Zeit regelmäßig bei Projekten zur Dokumentation Screenshots der Websites gebraucht habe, habe ich mir dieses kleine Tool entwickelt, welches automatische Screenshots von einer Seite erstellt. Das Script ist in Python geschrieben und greift über Selenium auf den Firefox zurück. Zu finden ist der Quellcode unter
     <a href="//gitlab.jonasled.de/jonasled/WebsiteCloner">gitlab.jonasled.de/jonasled/WebsiteCloner</a>
 </p>
+<?php
 
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
-
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/Projekte/youtubedownloader.php b/Projekte/youtubedownloader.php
index 1609658..39a0a7c 100644
--- a/Projekte/youtubedownloader.php
+++ b/Projekte/youtubedownloader.php
@@ -1,95 +1,14 @@
 <?php
-include "../internal/mysql.php";
-include "../internal/getGravatar.php";
+include "../internal/header.php";
+include "../internal/footer.php";
+include "../internal/comments.php";
 
+getHeader("Youtube Downloader", "projekte");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>YouTube Downloader - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">YouTube Downloader</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <p>In letzter Zeit habe ich wieder vermehrt Musik, teilweise komplette Playlists, von YouTube heruntergeladen, leider war ich mit allen Tools, welche ich gefunden habe nicht besonders zufrieden, oder sie haben nach kurzer Zeit nicht mehr funktioniert. Das beste Tool, welches ich finden konnte war das Programm <a href="https://youtube-dl.org/">y</a><s><a href="https://youtube-dl.org/">outube-dl</a> leider gibt es aber für dieses Programm keine Oberfläch</s>e. (Update: Ich bin umgestiegen auf YoutubeExplode, welches für C# optimiert ist.) Jedesmal über die Konsole zu gehen wollte ich auch nicht, deswegen habe ich eine kleine und einfache Oberfläche in C# geschrieben. In diesen gibt man einfach den URL und den Speicherort ein, der Rest wird alles automatisch gemacht.</p>
     <p>Der Quellcode ist in der <a href="https://gitlab.jonasled.de/jonasled/Youtube-Downloader-YoutubeExplode">git Repo</a></p>
-    <h2>Kommentare:</h2>
-    <?php
-
-    $article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
-    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
-    if ($result->num_rows > 0) {
-        while($row = $result->fetch_assoc()) {
-            $name = $row["name"] . "<br>";
-            $gravatar = get_gravatar($row["email"]);
-            $content = $row["comment"];
-
-            echo(<<<EOF
-            <h3 class="commentTitle">$name</h3>
-            <div class="comment">
-                <img src="$gravatar">
-                <article class="commentArticle">
-                    <p class="commentText">$content</p>
-                </article>
-            </div>
-            EOF);
-        }
-    }
-    ?>
-
-    <div id="newComment">
-        <form action="/newComment.php" method="post">
-            <label for="name">Name:</label><br>
-            <input type="text" id="name" name="name"><br><br>
-
-            <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
-            <input type="text" id="email" name="email"><br><br>
-
-            <label for="comment">Kommentar:</label><br>
-            <textarea name="comment" id="comment"></textarea><br><br>
+<?php
 
-            <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
-            <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
-        </form>
-    </div>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
+getComments($article);
+getFooter();
\ No newline at end of file
diff --git a/about.html b/about.html
deleted file mode 100644
index 8b6ef34..0000000
--- a/about.html
+++ /dev/null
@@ -1,62 +0,0 @@
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>ÜBER MICH - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">ÜBER MICH</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
-    Hallo, mein Name ist Jonas Leder. Ich bin aktuell dualer Student an der <a href="https://www.mannheim.dhbw.de/">DHBW Mannheim</a> und in den Praxisfasen bei der <a href="https://www.jobrouter.com/de/">JobRouter AG</a>. In meiner Freizeit beschäftige ich mich viel mit Computern und der Softwareprogrammierung. Dabei verwende ich häufig folgende Programmiersprachen:
-    <ul>
-        <li>Python</li>
-        <li>C / C#</li>
-        <li>"HTML"</li>
-        <li>JavaScript</li>
-        <li>PHP</li>
-        <li>Java</li>
-        <li>Bash</li>
-    </ul>
-    <p>Die oben genannten Sprachen setzt ich auf PCs und Microcontrollern ein. Dabei verwende ich die Standard Arduino Boards (nano, mega, …) und spezielle, wie das ESP8266, welches WLAN unterstützt.</p>
-    <p>Daneben habe ich auch viel Erfahrung mit Betriebssystemen. So setzt ich auf meinem Server auf Ubuntu und benutze auch viel Windows Server.</p>
-    <p>Meine Programme veröffentliche ich meisten auf meiner GitLab Instanz. Diese ist unter&nbsp;<a href="https://gitlab.jonasled.de/">gitlab.jonasled.de</a>&nbsp;zu finden.</p>
-
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
diff --git a/about.php b/about.php
new file mode 100644
index 0000000..e4b57bc
--- /dev/null
+++ b/about.php
@@ -0,0 +1,22 @@
+<?php
+include "internal/header.php";
+include "internal/footer.php";
+include "internal/comments.php";
+
+getHeader("Blitzortung", "");
+?>
+    Hallo, mein Name ist Jonas Leder. Ich bin aktuell dualer Student an der <a href="https://www.mannheim.dhbw.de/">DHBW Mannheim</a> und in den Praxisfasen bei der <a href="https://www.jobrouter.com/de/">JobRouter AG</a>. In meiner Freizeit beschäftige ich mich viel mit Computern und der Softwareprogrammierung. Dabei verwende ich häufig folgende Programmiersprachen:
+    <ul>
+        <li>Python</li>
+        <li>C / C#</li>
+        <li>"HTML"</li>
+        <li>JavaScript</li>
+        <li>PHP</li>
+        <li>Java</li>
+        <li>Bash</li>
+    </ul>
+    <p>Die oben genannten Sprachen setzt ich auf PCs und Microcontrollern ein. Dabei verwende ich die Standard Arduino Boards (nano, mega, …) und spezielle, wie das ESP8266, welches WLAN unterstützt.</p>
+    <p>Daneben habe ich auch viel Erfahrung mit Betriebssystemen. So setzt ich auf meinem Server auf Ubuntu und benutze auch viel Windows Server.</p>
+    <p>Meine Programme veröffentliche ich meisten auf meiner GitLab Instanz. Diese ist unter&nbsp;<a href="https://gitlab.jonasled.de/">gitlab.jonasled.de</a>&nbsp;zu finden.</p>
+<?php
+getFooter();
\ No newline at end of file
diff --git a/bildquellen.html b/bildquellen.html
deleted file mode 100644
index aa40d6a..0000000
--- a/bildquellen.html
+++ /dev/null
@@ -1,57 +0,0 @@
-<?php
-include "../internal/mysql.php";
-
-?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Bildquellen - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Bildquellen</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
-<ul>
-    <li>Bild oben: Photo by <a href="https://unsplash.com/@hishahadat?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Shahadat Rahman</a>&nbsp;on&nbsp;<a href="https://unsplash.com/s/photos/programmer?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></li>
-    <li>Bild Startseite: Photo by&nbsp;<a href="https://unsplash.com/@grohsfabian?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Fabian Grohs</a>&nbsp;on&nbsp;<a href="https://unsplash.com/s/photos/programmer?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></li>
-</ul>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
diff --git a/bildquellen.php b/bildquellen.php
new file mode 100644
index 0000000..922c293
--- /dev/null
+++ b/bildquellen.php
@@ -0,0 +1,13 @@
+<?php
+include "internal/header.php";
+include "internal/footer.php";
+include "internal/comments.php";
+
+getHeader("Bildquellen", "");
+?>
+<ul>
+    <li>Bild oben: Photo by <a href="https://unsplash.com/@hishahadat?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Shahadat Rahman</a>&nbsp;on&nbsp;<a href="https://unsplash.com/s/photos/programmer?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></li>
+    <li>Bild Startseite: Photo by&nbsp;<a href="https://unsplash.com/@grohsfabian?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Fabian Grohs</a>&nbsp;on&nbsp;<a href="https://unsplash.com/s/photos/programmer?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></li>
+</ul>
+<?php
+getFooter();
\ No newline at end of file
diff --git a/datenschutzerklaerung.html b/datenschutzerklaerung.php
similarity index 95%
rename from datenschutzerklaerung.html
rename to datenschutzerklaerung.php
index 12b40e2..0f04665 100644
--- a/datenschutzerklaerung.html
+++ b/datenschutzerklaerung.php
@@ -1,50 +1,10 @@
 <?php
-include "../internal/mysql.php";
+include "internal/header.php";
+include "internal/footer.php";
+include "internal/comments.php";
 
+getHeader("DATENSCHUTZERKL&Auml;RUNG", "");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Datenschutzerklärung - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Datenschutzerklärung</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <h3 id="dsg-general-intro"> </h3>
     <p>Diese Datenschutzerklärung klärt Sie über die Art, den Umfang und Zweck der Verarbeitung von personenbezogenen Daten (nachfolgend kurz „Daten“) innerhalb unseres Onlineangebotes und der mit ihm verbundenen Webseiten, Funktionen und Inhalte sowie externen Onlinepräsenzen, wie z.B. unser Social Media Profile auf (nachfolgend gemeinsam bezeichnet als „Onlineangebot“). Im Hinblick auf die verwendeten Begrifflichkeiten, wie z.B. „Verarbeitung“ oder „Verantwortlicher“ verweisen wir auf die Definitionen im Art. 4 der Datenschutzgrundverordnung (DSGVO).</p>
     <h3 id="dsg-general-datatype">Arten der verarbeiteten Daten:</h3>
@@ -155,9 +115,5 @@ include "../internal/mysql.php";
     <h3 id="dsg-thirdparty-typekit">Typekit-Schriftarten von Adobe</h3>
     <p><span class="ts-muster-content">Wir setzen auf Grundlage unserer berechtigten Interessen (d.h. Interesse an der Analyse, Optimierung und wirtschaftlichem Betrieb unseres Onlineangebotes im Sinne des Art. 6 Abs. 1 lit. f. DSGVO) externe "Typekit"-Schriftarten des Anbieters Adobe Systems Software Ireland Limited, 4-6 Riverwalk, Citywest Business Campus, Dublin 24, Republic of Ireland ein. Adobe ist unter dem Privacy-Shield-Abkommen zertifiziert und bietet hierdurch eine Garantie, das europäische Datenschutzrecht einzuhalten (https://www.privacyshield.gov/participant?id=a2zt0000000TNo9AAG&amp;status=Active).</span></p>
     <p><a class="dsg1-5" href="https://datenschutz-generator.de" target="_blank" rel="nofollow noopener noreferrer">Erstellt mit Datenschutz-Generator.de von RA Dr. Thomas Schwenke</a></p>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+<?php
+getFooter();
\ No newline at end of file
diff --git a/impressum.php b/impressum.php
index 5756fa3..19f6742 100644
--- a/impressum.php
+++ b/impressum.php
@@ -1,50 +1,10 @@
 <?php
-include "internal/config.php";
+include "internal/header.php";
+include "internal/footer.php";
+include "internal/comments.php";
 
+getHeader("Impressum", "");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Impressum - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">Impressum</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=projekte"></div>
-</header>
-<div id="content">
     <h2>Angaben gem&auml;&szlig; &sect; 5 TMG</h2>
     <p>Jonas Leder</p>
 
@@ -57,10 +17,5 @@ include "internal/config.php";
     <h3>Haftung f&uuml;r Inhalte</h3> <p>Als Diensteanbieter sind wir gem&auml;&szlig; &sect; 7 Abs.1 TMG f&uuml;r eigene Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach &sect;&sect; 8 bis 10 TMG sind wir als Diensteanbieter jedoch nicht verpflichtet, &uuml;bermittelte oder gespeicherte fremde Informationen zu &uuml;berwachen oder nach Umst&auml;nden zu forschen, die auf eine rechtswidrige T&auml;tigkeit hinweisen.</p> <p>Verpflichtungen zur Entfernung oder Sperrung der Nutzung von Informationen nach den allgemeinen Gesetzen bleiben hiervon unber&uuml;hrt. Eine diesbez&uuml;gliche Haftung ist jedoch erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung m&ouml;glich. Bei Bekanntwerden von entsprechenden Rechtsverletzungen werden wir diese Inhalte umgehend entfernen.</p> <h3>Haftung f&uuml;r Links</h3> <p>Unser Angebot enth&auml;lt Links zu externen Websites Dritter, auf deren Inhalte wir keinen Einfluss haben. Deshalb k&ouml;nnen wir f&uuml;r diese fremden Inhalte auch keine Gew&auml;hr &uuml;bernehmen. F&uuml;r die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber der Seiten verantwortlich. Die verlinkten Seiten wurden zum Zeitpunkt der Verlinkung auf m&ouml;gliche Rechtsverst&ouml;&szlig;e &uuml;berpr&uuml;ft. Rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung nicht erkennbar.</p> <p>Eine permanente inhaltliche Kontrolle der verlinkten Seiten ist jedoch ohne konkrete Anhaltspunkte einer Rechtsverletzung nicht zumutbar. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Links umgehend entfernen.</p> <h3>Urheberrecht</h3> <p>Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Die Vervielf&auml;ltigung, Bearbeitung, Verbreitung und jede Art der Verwertung au&szlig;erhalb der Grenzen des Urheberrechtes bed&uuml;rfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers. Downloads und Kopien dieser Seite sind nur f&uuml;r den privaten, nicht kommerziellen Gebrauch gestattet.</p> <p>Soweit die Inhalte auf dieser Seite nicht vom Betreiber erstellt wurden, werden die Urheberrechte Dritter beachtet. Insbesondere werden Inhalte Dritter als solche gekennzeichnet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung aufmerksam werden, bitten wir um einen entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Inhalte umgehend entfernen.</p>
 
     <p>Quelle: <a href="https://www.e-recht24.de">https://www.e-recht24.de</a></p>
-
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+<?php
+getFooter();
\ No newline at end of file
diff --git a/index.php b/index.php
index 3693413..8eaa86a 100644
--- a/index.php
+++ b/index.php
@@ -1,51 +1,11 @@
 <?php
-include "./internal/mysql.php";
+include "internal/header.php";
+include "internal/footer.php";
+include "internal/mysql.php";
 
+getHeader("Blitzortung", "");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="/js/cookie.js"></script>
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-    <header>
-        <div class="header-wrapper">
-            <div class="header-homepage  color-overlay" data-parallax-depth="20">
-                <div class="header-description gridContainer content-on-center">
-                    <div class="row header-description-row">
-                        <div class="header-content header-content-centered">
-                            <div class="align-holder">
-                                <h1 class="heading8"> Jonas Leder</h1>
-                                <p class="header-subtitle"> </p>
-                                <div class="header-buttons-wrapper"></div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="header-separator header-separator-bottom ">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                    <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-                </svg>
-            </div>
-        </div>
-        <div id="mainMenu" includeHTML="/include/menue.php?page=home"></div>
-    </header>
-    <div class="center" id="content">
+    <div class="center">
         <img id="homeImage" src="img/bildHome.webp">
         <h2>&Uuml;ber mich</h2>
         <p>Hallo, mein Name ist Jonas Leder. Ich bin aktuell Student an der Dualen Hochschule Baden-Württemberg in Mannheim Fachrichtung Angewandte Informatik.</p>
@@ -97,12 +57,9 @@ include "./internal/mysql.php";
                We use cookies to enhance your experience. By continuing to visit this site you agree to our use of cookies. <a class="cookieinfo-link" href="http://wikipedia.org/wiki/HTTP_cookie">More info</a>
             </span>
     </div>
-    <footer includeHTML="include/footer.php">
-    </footer>
+    <script src="js/cookie.js"
     <script>
         checkHide();
     </script>
-
-    <script src="js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+<?php
+getFooter();
\ No newline at end of file
diff --git a/internal/comments.php b/internal/comments.php
new file mode 100644
index 0000000..7a11f0a
--- /dev/null
+++ b/internal/comments.php
@@ -0,0 +1,45 @@
+<?php
+
+function getComments($article){
+    include "mysql.php";
+    include "getGravatar.php";
+    echo("    <h2>Kommentare:</h2>");
+    $result = $conn->query("SELECT * FROM comments WHERE article='$article'");
+    if ($result->num_rows > 0) {
+        while($row = $result->fetch_assoc()) {
+            $name = $row["name"] . "<br>";
+            $gravatar = get_gravatar($row["email"]);
+            $content = $row["comment"];
+
+            echo(<<<EOF
+            <h3 class="commentTitle">$name</h3>
+            <div class="comment">
+                <img src="$gravatar">
+                <article class="commentArticle">
+                    <p class="commentText">$content</p>
+                </article>
+            </div>
+            EOF);
+        }
+    }
+    echo(<<<EOF
+
+<div id="newComment">
+    <form action="/newComment.php" method="post">
+        <label for="name">Name:</label><br>
+        <input type="text" id="name" name="name"><br><br>
+
+        <label for="email">E-Mail: (wird nicht ver&ouml;ffentlicht)</label><br>
+        <input type="text" id="email" name="email"><br><br>
+
+        <label for="comment">Kommentar:</label><br>
+        <textarea name="comment" id="comment"></textarea><br><br>
+
+        <input type="submit" value="Kommentar ver&ouml;ffentlichen"><br>
+        <p>Mit dem klick auf den obigen Button erkl&auml;ren sie sich mit der <a href="/datenschutzerklaerung.html">Datenschutzerkl&auml;rung</a> einverstanden.</p>
+    </form>
+</div>
+
+
+EOF);
+}
\ No newline at end of file
diff --git a/internal/footer.php b/internal/footer.php
new file mode 100644
index 0000000..a7b0356
--- /dev/null
+++ b/internal/footer.php
@@ -0,0 +1,11 @@
+<?php
+function getFooter(){
+    echo(<<<EOF
+    </div>
+    <footer includeHTML="/include/footer.php">
+    </footer>
+    <script src="/js/includeHTML.js"></script>
+    </body>
+    </html>
+    EOF);
+}
diff --git a/internal/header.php b/internal/header.php
new file mode 100644
index 0000000..e49b121
--- /dev/null
+++ b/internal/header.php
@@ -0,0 +1,49 @@
+<?php
+
+function getHeader($pagetitle, $navselect)
+{
+    echo( <<<EOF
+    <!DOCTYPE html >
+    <html lang = "de" >
+    <html >
+    <head >
+        <meta charset = "UTF-8" >
+        <meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
+        <title > $pagetitle - Jonas Leder </title >
+    
+        <link href = "/css/style.css" rel = "stylesheet" >
+        <link href = "/css/normalize.css" rel = "stylesheet" >
+        <link href = "/css/sourcesanspro.css" rel = "stylesheet" >
+        <link href = "/css/menue.css" rel = "stylesheet" >
+        <script src = "https://kit.fontawesome.com/038c6c1f0e.js" crossorigin = "anonymous" ></script >
+    </head >
+    <body >
+    <header >
+        <div class="header-wrapper" >
+            <div class="header-homepage  color-overlay" data - parallax - depth = "20" >
+                <div class="header-description gridContainer content-on-center" >
+                    <div class="row header-description-row" >
+                        <div class="header-content header-content-centered" >
+                            <div class="align-holder" >
+                                <h1 class="heading8" >$pagetitle</h1 >
+                                <p class="header-subtitle" > </p >
+                                <div class="header-buttons-wrapper" ></div >
+                            </div >
+                        </div >
+                    </div >
+                </div >
+            </div >
+            <div class="header-separator header-separator-bottom " >
+                <svg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 1000 100" preserveAspectRatio = "none" >
+                    <path class="svg-white-bg" d = "M737.9,94.7L0,0v100h1000V0L737.9,94.7z" ></path >
+                </svg >
+            </div >
+        </div >
+        <div id = "mainMenu" includeHTML = "/include/menue.php?page=$navselect" ></div >
+    </header >
+    <!--Matomo Image Tracker -->
+    <img src = "https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style = "border:0" alt = "" />
+    <!--End Matomo -->
+    <div id = "content" >
+EOF);
+}
\ No newline at end of file
diff --git a/ntpstatus.html b/ntpstatus.html
deleted file mode 100644
index 4e4627a..0000000
--- a/ntpstatus.html
+++ /dev/null
@@ -1,77 +0,0 @@
-<?php
-include "./internal/mysql.php";
-
-?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>NTP Server - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/ntp.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <link href="/css/menue.css" rel="stylesheet">
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8">NTP Server Status</h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php?page=status"></div>
-</header>
-<div id="content">
-    <p>Da ich selber viel auf NTP zur Zeitsynchronisation setze habe ich mich dazu entschlossen selber einen NTP Server, welche im ntp pool gelistet ist aufzusetzen. Unten sind die Statistiken zum Server für IPv4 und für IPv6</p>
-    <a href="https://www.ntppool.org/scores/185.216.212.128">
-        <div data-server-ip="185.216.212.128" class="graph"></div>
-    </a>
-    <a href="https://www.ntppool.org/scores/193.109.84.119">
-        <div data-server-ip="193.109.84.119" class="graph"></div>
-    </a>
-    <a href="https://www.ntppool.org/scores/2a0b:bbc0:0:1f5::4">
-        <div data-server-ip="2a0b:bbc0:0:1f5::4" class="graph"></div>
-    </a>
-    <a href="https://www.ntppool.org/scores/2001:470:1f14:da8::2">
-        <div data-server-ip="2001:470:1f14:da8::2" class="graph"></div>
-    </a>
-    <a href="https://www.ntppool.org/scores/2a01:367:c204::17:5b4">
-        <div data-server-ip="2a01:367:c204::17:5b4" class="graph"></div>
-    </a>
-</div>
-<footer includeHTML="include/footer.php">
-
-</footer>
-<script type="text/javascript">
-    if (!NP) var NP= {};
-</script>
-<script src="js/includeHTML.js"></script>
-<script type="text/javascript" src="https://jonasled.pages.gitlab.jonasled.de/pool.ntp.org-graph/jquery.js"></script>
-<script type="text/javascript" src="https://jonasled.pages.gitlab.jonasled.de/pool.ntp.org-graph/d3.js"></script>
-<script type="text/javascript" src="https://jonasled.pages.gitlab.jonasled.de/pool.ntp.org-graph/graphs.js"></script>
-</body>
-</html>
\ No newline at end of file
diff --git a/ntpstatus.php b/ntpstatus.php
new file mode 100644
index 0000000..dbb2da0
--- /dev/null
+++ b/ntpstatus.php
@@ -0,0 +1,33 @@
+<?php
+include "internal/header.php";
+include "internal/footer.php";
+
+getHeader("NTP Status", "status");
+?>
+    <link href="css/ntp.css" rel="stylesheet">
+    <p>Da ich selber viel auf NTP zur Zeitsynchronisation setze habe ich mich dazu entschlossen selber einen NTP Server, welche im ntp pool gelistet ist aufzusetzen. Unten sind die Statistiken zum Server für IPv4 und für IPv6</p>
+    <a href="https://www.ntppool.org/scores/185.216.212.128">
+        <div data-server-ip="185.216.212.128" class="graph"></div>
+    </a>
+    <a href="https://www.ntppool.org/scores/193.109.84.119">
+        <div data-server-ip="193.109.84.119" class="graph"></div>
+    </a>
+    <a href="https://www.ntppool.org/scores/2a0b:bbc0:0:1f5::4">
+        <div data-server-ip="2a0b:bbc0:0:1f5::4" class="graph"></div>
+    </a>
+    <a href="https://www.ntppool.org/scores/2001:470:1f14:da8::2">
+        <div data-server-ip="2001:470:1f14:da8::2" class="graph"></div>
+    </a>
+    <a href="https://www.ntppool.org/scores/2a01:367:c204::17:5b4">
+        <div data-server-ip="2a01:367:c204::17:5b4" class="graph"></div>
+    </a>
+    <script type="text/javascript">
+        if (!NP) var NP= {};
+    </script>
+    <script src="js/includeHTML.js"></script>
+    <script type="text/javascript" src="https://jonasled.pages.gitlab.jonasled.de/pool.ntp.org-graph/jquery.js"></script>
+    <script type="text/javascript" src="https://jonasled.pages.gitlab.jonasled.de/pool.ntp.org-graph/d3.js"></script>
+    <script type="text/javascript" src="https://jonasled.pages.gitlab.jonasled.de/pool.ntp.org-graph/graphs.js"></script>
+<?php
+getFooter();
+?>
\ No newline at end of file
diff --git a/post.php b/post.php
index 9c997bc..e89af9d 100644
--- a/post.php
+++ b/post.php
@@ -1,5 +1,8 @@
 <?php
 include "internal/mysql.php";
+include "internal/header.php";
+include "internal/footer.php";
+
 if(isset($_GET["template"])){
     $title = "[TITLE]";
     $content = "[CONTENT]";
@@ -21,57 +24,10 @@ if(isset($_GET["template"])){
     $id = $row["id"];
 }
 
-
+getHeader($title, "");
 ?>
-
-<!DOCTYPE html>
-<html lang="de">
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title><?php echo($title); ?> - Jonas Leder</title>
-
-    <link href="/css/style.css" rel="stylesheet">
-    <link href="/css/normalize.css" rel="stylesheet">
-    <link href="/css/sourcesanspro.css" rel="stylesheet">
-    <link href="/css/menue.css" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/038c6c1f0e.js" crossorigin="anonymous"></script>
-    <!-- Matomo Image Tracker-->
-    <img src="https://matomo.jonasled.de/matomo.php?idsite=1&amp;rec=1" style="border:0" alt="" />
-    <!-- End Matomo -->
-</head>
-<body>
-<header>
-    <div class="header-wrapper">
-        <div class="header-homepage  color-overlay" data-parallax-depth="20">
-            <div class="header-description gridContainer content-on-center">
-                <div class="row header-description-row">
-                    <div class="header-content header-content-centered">
-                        <div class="align-holder">
-                            <h1 class="heading8"><?php echo($title); ?></h1>
-                            <p class="header-subtitle"> </p>
-                            <div class="header-buttons-wrapper"></div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="header-separator header-separator-bottom ">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
-                <path class="svg-white-bg" d="M737.9,94.7L0,0v100h1000V0L737.9,94.7z"></path>
-            </svg>
-        </div>
-    </div>
-    <div id="mainMenu" includeHTML="/include/menue.php"></div>
-</header>
-<div id="content">
     <p>
         <?php echo($content); ?>
     </p>
-</div>
-<footer includeHTML="/include/footer.php">
-</footer>
-<script src="/js/includeHTML.js"></script>
-</body>
-</html>
\ No newline at end of file
+<?php
+getFooter();
\ No newline at end of file
-- 
GitLab