From: Kai Moritz <kai.milan.moritz@googlemail.com>
Date: Sat, 6 Jun 2026 11:20:29 +0000 (+0000)
Subject: Add homepage and standalone pages; fix BlogNav off-state logic
X-Git-Url: https://juplo.de/gitweb/?a=commitdiff_plain;h=424077ea6a8765354d27c52ebe5177a48f6ff9a6;p=website

Add homepage and standalone pages; fix BlogNav off-state logic

- Implement src/pages/index.astro: full BaseLayout with pack/bg/cf
  panels, 5 recent posts, and EU-funding marginalcontent aside
- Add src/pages/about.html.astro, impressum.html.astro,
  datenschutz.html.astro with content from Hugo _index.html sources
- Fix BlogNav: Archive/Categories/Tags now get 'off' class when the
  current page is not in any blog section (e.g. homepage, about page);
  previously they were only off on taxonomy-term pages
- Remove Projects/About subtree from BlogNav submenu — Hugo does not
  render them either, because the tree.html partial filters them out

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---

diff --git a/src/components/BlogNav.astro b/src/components/BlogNav.astro
index fa44f530..bc3c32ee 100644
--- a/src/components/BlogNav.astro
+++ b/src/components/BlogNav.astro
@@ -69,12 +69,12 @@ const categoriesSelected = onCategoriesIndex || onCategoryTerm;
 const tagsSelected = onTagsIndex || onTagTerm;
 
 // "off" class logic derived from Hugo nav output:
-// On archive pages: Categories and Tags are off; Archive is normal (selected)
-// On category term: Archive and Tags are off
-// On tag term: Archive and Categories are off
-const archiveOff = onCategoryTerm || onTagTerm;
-const categoriesOff = onArchive || onTagTerm;
-const tagsOff = onArchive || onCategoryTerm;
+// Archive/Categories/Tags are all off when not in blog context (e.g. homepage, About)
+// Within blog context: Archive is off on taxonomy term pages only
+//                      Categories/Tags are off on archive pages and the sibling taxonomy term
+const archiveOff = !blogSelected || onCategoryTerm || onTagTerm;
+const categoriesOff = !blogSelected || onArchive || onTagTerm;
+const tagsOff = !blogSelected || onArchive || onCategoryTerm;
 
 // Determine active section
 const activeSection = mainSections.find(s => {
@@ -217,16 +217,6 @@ const activeTagSlug = onTagTerm ? currentUrl.replace(/^\/tags\//, '').replace(/\
         )}
       </ul>
     </li>
-    {/* Projects subtree — always off in blog context */}
-    <li class="s sub off">
-      <a href="/projects/" class="s">Projects</a>
-      <ul class="s"></ul>
-    </li>
-    {/* About subtree — always off in blog context */}
-    <li class="s sub off">
-      <a href="/about.html" class="s">About</a>
-      <ul class="s"></ul>
-    </li>
   </ul>
   <hr class="n"/>
 </nav>
diff --git a/src/pages/about.html.astro b/src/pages/about.html.astro
new file mode 100644
index 00000000..aeb3904e
--- /dev/null
+++ b/src/pages/about.html.astro
@@ -0,0 +1,66 @@
+---
+import BaseLayout from '../layouts/BaseLayout.astro';
+import Breadcrumb from '../components/Breadcrumb.astro';
+
+const crumbs = [
+  { title: 'Home', url: '/' },
+  { title: 'About' },
+];
+---
+
+<BaseLayout title="About">
+  <Fragment slot="breadcrumb">
+    <Breadcrumb crumbs={crumbs} />
+  </Fragment>
+
+  <Fragment slot="article">
+    <header>
+      <h1>About</h1>
+    </header>
+    <p>
+      <span class="logo">juplo</span> is the place, where I collect and share
+      my more or less private projects.
+      It is a lab for experiments, that help me to do my job as a freelancer
+      at the desired level of quality.
+      Here, I can play with all the fancy new stuff, that might be a little
+      bit to much bleeding edge, to be used on a production site of a paying
+      client.
+    </p>
+    <p>
+      I decided to share all this stuff, because I am always learning a lot
+      from the internet-community.
+      I wanted to give back a little and try to help and teach others, as I
+      was helped and teached.
+      Also, this is a good oportunity, to show what I am doing and to do a
+      little self-publicity...
+    </p>
+    <p><span class="logo">juplo</span> mainly consists of two parts:</p>
+    <ul>
+      <li>
+        In the <a href="/blog/">blog</a>, I summarize, how I solved
+        some every-day problems, other people might stumble across too.
+        I am introducing new projects there and announcing new versions and/or
+        bugfixes to older projects.
+      </li>
+      <li>
+        The other part of the site is the <a href="/projects/">projects-section</a>.
+        This is where I am hosting all projects, that I have made publicy available.
+      </li>
+    </ul>
+    <p>
+      If you want to hire me, you can find out more on the
+      <a href="/contact.html">contact-page</a>.
+    </p>
+  </Fragment>
+
+  <Fragment slot="marginalcontent">
+    <aside class="m">
+      <h2>Funded by the Europian Union</h2>
+      <p>As partner of the company <a href="http://yourshouter.com" title="Visit the Homepage of the company">yourSHOUTER UG (haftungsbeschränkt)</a> we publish results of a <a href="http://yourshouter.com/projekte/crowdgest%C3%BCtzte-veranstaltungs-suchmaschine.html" title="Show details about the funded resarch-project">resarch-project</a>, that is funded by the European Union and the federal state Northrhine-Westphalia.</p>
+      <a class="img" href="http://yourshouter.com/projekte/crowdgest%C3%BCtzte-veranstaltungs-suchmaschine.html" title="Show details about the funded resarch-project">
+        <img alt="Europäische Union: Investitionen in unsere Zukunft - Europäischer Fonds für regionale Entwicklung" src="/img/EFRE_Foerderhinweis_deutsch_farbig.svg" width="100%">
+        <img alt="EFRE.NRW 2014-2020: Invesitionen in Wachstum und Beschäftigung" src="/img/Ziel2NRW_4c_1809_eps.svg" width="100%">
+      </a>
+    </aside>
+  </Fragment>
+</BaseLayout>
diff --git a/src/pages/datenschutz.html.astro b/src/pages/datenschutz.html.astro
new file mode 100644
index 00000000..6772e17c
--- /dev/null
+++ b/src/pages/datenschutz.html.astro
@@ -0,0 +1,109 @@
+---
+import BaseLayout from '../layouts/BaseLayout.astro';
+import Breadcrumb from '../components/Breadcrumb.astro';
+
+const crumbs = [
+  { title: 'Home', url: '/' },
+  { title: 'Datenschutz' },
+];
+---
+
+<BaseLayout title="Datenschutz">
+  <Fragment slot="breadcrumb">
+    <Breadcrumb crumbs={crumbs} />
+  </Fragment>
+
+  <Fragment slot="article">
+    <header>
+      <h1>Datenschutz</h1>
+    </header>
+
+    <section id="allgemein">
+      <h2>Allgemeine Hinweise zum Datenschutz</h2>
+      <p>Die Nutzung unserer Webseite ist in der Regel ohne Angabe personenbezogener Daten möglich. Soweit auf unseren Seiten personenbezogene Daten (beispielsweise Name, Anschrift oder eMail-Adressen) erhoben werden, erfolgt dies, soweit möglich, stets auf freiwilliger Basis. Diese Daten werden ohne Ihre ausdrückliche Zustimmung nicht an Dritte weitergegeben.</p>
+      <p>Wir weisen darauf hin, dass die Datenübertragung im Internet (z.B. bei der Kommunikation per E-Mail) Sicherheitslücken aufweisen kann. Ein lückenloser Schutz der Daten vor dem Zugriff durch Dritte ist nicht möglich.</p>
+      <p>Der Nutzung von im Rahmen der Impressumspflicht veröffentlichten Kontaktdaten durch Dritte zur Übersendung von nicht ausdrücklich angeforderter Werbung und Informationsmaterialien wird hiermit ausdrücklich widersprochen. Die Betreiber der Seiten behalten sich ausdrücklich rechtliche Schritte im Falle der unverlangten Zusendung von Werbeinformationen, etwa durch Spam-Mails, vor.</p>
+    </section>
+
+    <section class="jump" id="google-analytics">
+      <h2>Google Analytics</h2>
+      <p>Unsere Website benutzt Google Analytics, einen Webanalysedienst der Google Inc. ("Google"). Google Analytics verwendet sog. "Cookies", Textdateien, die auf Ihrem Computer gespeichert werden und die eine Analyse der Benutzung der Website durch Sie ermöglichen. Die durch den Cookie erzeugten Informationen über Ihre Benutzung dieser Website werden in der Regel an einen Server von Google in den USA übertragen und dort gespeichert. Im Falle der Aktivierung der IP-Anonymisierung auf dieser Webseite wird Ihre IP-Adresse von Google jedoch innerhalb von Mitgliedstaaten der Europäischen Union oder in anderen Vertragsstaaten des Abkommens über den Europäischen Wirtschaftsraum zuvor gekürzt.</p>
+      <p>Nur in Ausnahmefällen wird die volle IP-Adresse an einen Server von Google in den USA übertragen und dort gekürzt. Im Auftrag des Betreibers dieser Website wird Google diese Informationen benutzen, um Ihre Nutzung der Website auszuwerten, um Reports über die Websiteaktivitäten zusammenzustellen und um weitere mit der Websitenutzung und der Internetnutzung verbundene Dienstleistungen gegenüber dem Websitebetreiber zu erbringen. Die im Rahmen von Google Analytics von Ihrem Browser übermittelte IP-Adresse wird nicht mit anderen Daten von Google zusammengeführt.</p>
+      <p>Sie können die Speicherung der Cookies durch eine entsprechende Einstellung Ihrer Browser-Software verhindern; wir weisen Sie jedoch darauf hin, dass Sie in diesem Fall gegebenenfalls nicht sämtliche Funktionen dieser Website vollumfänglich werden nutzen können. Sie können darüber hinaus die Erfassung der durch das Cookie erzeugten und auf Ihre Nutzung der Website bezogenen Daten (inkl. Ihrer IP-Adresse) an Google sowie die Verarbeitung dieser Daten durch Google verhindern, indem sie das unter dem folgenden Link verfügbare Browser-Plugin herunterladen und installieren:</p>
+      <p><a href="http://tools.google.com/dlpage/gaoptout?hl=de" title="Das Plugin jetzt herunterladen...">http://tools.google.com/dlpage/gaoptout?hl=de</a>.</p>
+    </section>
+
+    <section class="jump" id="dsgvo">
+      <h2>Ausführliche Angaben zum Datenschutz nach den Vorgaben der DSGVO</h2>
+
+      <h3>I. Allgemeines zur Datenverarbeitung</h3>
+
+      <h4>1. Umfang der Verarbeitung personenbezogener Daten</h4>
+      <p>Wir verarbeiten personenbezogene Daten unserer Nutzer grundsätzlich nur, soweit dies zur Bereitstellung einer funktionsfähigen Website sowie unserer Inhalte und Leistungen erforderlich ist. Die Verarbeitung personenbezogener Daten unserer Nutzer erfolgt regelmäßig nur nach Einwilligung des Nutzers. Eine Ausnahme gilt in solchen Fällen, in denen eine vorherige Einholung einer Einwilligung aus tatsächlichen Gründen nicht möglich ist und die Verarbeitung der Daten durch gesetzliche Vorschriften gestattet ist.</p>
+
+      <h4>2. Rechtsgrundlage für die Verarbeitung personenbezogener Daten</h4>
+      <p>Soweit wir für Verarbeitungsvorgänge personenbezogener Daten eine Einwilligung der betroffenen Person einholen, dient Art.&nbsp;6 Abs.&nbsp;1 lit.&nbsp;a EU-Datenschutzgrundverordnung (DSGVO) als Rechtsgrundlage.</p>
+      <p>Bei der Verarbeitung von personenbezogenen Daten, die zur Erfüllung eines Vertrages, dessen Vertragspartei die betroffene Person ist, erforderlich ist, dient Art.&nbsp;6 Abs.&nbsp;1 lit.&nbsp;b DSGVO als Rechtsgrundlage. Dies gilt auch für Verarbeitungsvorgänge, die zur Durchführung vorvertraglicher Maßnahmen erforderlich sind.</p>
+      <p>Soweit eine Verarbeitung personenbezogener Daten zur Erfüllung einer rechtlichen Verpflichtung erforderlich ist, der unser Unternehmen unterliegt, dient Art.&nbsp;6 Abs.&nbsp;1 lit.&nbsp;c DSGVO als Rechtsgrundlage.</p>
+      <p>Für den Fall, dass lebenswichtige Interessen der betroffenen Person oder einer anderen natürlichen Person eine Verarbeitung personenbezogener Daten erforderlich machen, dient Art.&nbsp;6 Abs.&nbsp;1 lit.&nbsp;d DSGVO als Rechtsgrundlage.</p>
+      <p>Ist die Verarbeitung zur Wahrung eines berechtigten Interesses unseres Unternehmens oder eines Dritten erforderlich und überwiegen die Interessen, Grundrechte und Grundfreiheiten des Betroffenen das erstgenannte Interesse nicht, so dient Art.&nbsp;6 Abs.&nbsp;1 lit.&nbsp;f DSGVO als Rechtsgrundlage für die Verarbeitung.</p>
+
+      <h4>3. Datenlöschung und Speicherdauer</h4>
+      <p>Die personenbezogenen Daten der betroffenen Person werden gelöscht oder gesperrt, sobald der Zweck der Speicherung entfällt. Eine Speicherung kann darüber hinaus erfolgen, wenn dies durch den europäischen oder nationalen Gesetzgeber in unionsrechtlichen Verordnungen, Gesetzen oder sonstigen Vorschriften, denen der Verantwortliche unterliegt, vorgesehen wurde. Eine Sperrung oder Löschung der Daten erfolgt auch dann, wenn eine durch die genannten Normen vorgeschriebene Speicherfrist abläuft, es sei denn, dass eine Erforderlichkeit zur weiteren Speicherung der Daten für einen Vertragsabschluss oder eine Vertragserfüllung besteht.</p>
+
+      <h3>II. Bereitstellung der Website und Erstellung von Logfiles</h3>
+
+      <h4>1. Beschreibung und Umfang der Datenverarbeitung</h4>
+      <p>Bei jedem Aufruf unserer Internetseite erfasst unser System automatisiert Daten und Informationen vom Computersystem des aufrufenden Rechners. Folgende Daten werden hierbei erhoben:</p>
+      <ol>
+        <li>Informationen über den Browsertyp und die verwendete Version</li>
+        <li>Das Betriebssystem des Nutzers</li>
+        <li>Die IP-Adresse des Nutzers</li>
+        <li>Datum und Uhrzeit des Zugriffs</li>
+        <li>Websites, von denen das System des Nutzers auf unsere Internetseite gelangt</li>
+        <li>Websites, die vom System des Nutzers über unsere Website aufgerufen werden</li>
+      </ol>
+      <p>Die Daten werden ebenfalls in den Logfiles unseres Systems gespeichert. Eine Speicherung dieser Daten zusammen mit anderen personenbezogenen Daten des Nutzers findet nicht statt.</p>
+
+      <h4>2. Rechtsgrundlage für die Datenverarbeitung</h4>
+      <p>Rechtsgrundlage für die vorübergehende Speicherung der Daten und der Logfiles ist Art.&nbsp;6 Abs.&nbsp;1 lit.&nbsp;f DSGVO.</p>
+
+      <h4>3. Zweck der Datenverarbeitung</h4>
+      <p>Die Speicherung in Logfiles erfolgt, um die Funktionsfähigkeit der Website sicherzustellen. Zudem dienen uns die Daten zur Optimierung der Website und zur Sicherstellung der Sicherheit unserer informationstechnischen Systeme. Eine Auswertung der Daten zu Marketingzwecken findet in diesem Zusammenhang nicht statt.</p>
+      <p>In diesen Zwecken liegt auch unser berechtigtes Interesse an der Datenverarbeitung nach Art.&nbsp;6 Abs.&nbsp;1 lit.&nbsp;f DSGVO.</p>
+
+      <h4>4. Dauer der Speicherung</h4>
+      <p>Die Daten werden gelöscht, sobald sie für die Erreichung des Zweckes ihrer Erhebung nicht mehr erforderlich sind. Im Falle der Speicherung der Daten in Logfiles ist dies nach spätestens sieben Tagen der Fall. Eine darüberhinausgehende Speicherung ist möglich. In diesem Fall werden die IP-Adressen der Nutzer gelöscht oder verfremdet, sodass eine Zuordnung des aufrufenden Clients nicht mehr möglich ist.</p>
+
+      <h4>5. Widerspruchs- und Beseitigungsmöglichkeit</h4>
+      <p>Die Erfassung der Daten zur Bereitstellung der Website und die Speicherung der Daten in Logfiles ist für den Betrieb der Internetseite zwingend erforderlich. Es besteht folglich seitens des Nutzers keine Widerspruchsmöglichkeit.</p>
+
+      <h3>III. Verwendung von Cookies</h3>
+
+      <h4>1. Beschreibung und Umfang der Datenverarbeitung</h4>
+      <p>Unsere Webseite verwendet Cookies. Bei Cookies handelt es sich um Textdateien, die im Internetbrowser bzw. vom Internetbrowser auf dem Computersystem des Nutzers gespeichert werden. Ruft ein Nutzer eine Website auf, so kann ein Cookie auf dem Betriebssystem des Nutzers gespeichert werden. Dieser Cookie enthält eine charakteristische Zeichenfolge, die eine eindeutige Identifizierung des Browsers beim erneuten Aufrufen der Website ermöglicht.</p>
+      <p>Wir verwenden auf unserer Website Cookies, die eine Analyse des Surfverhaltens der Nutzer ermöglichen. Auf diese Weise können folgende Daten übermittelt werden:</p>
+      <ol>
+        <li>Eingegebene Suchbegriffe</li>
+        <li>Häufigkeit von Seitenaufrufen</li>
+        <li>Inanspruchnahme von Website-Funktionen</li>
+      </ol>
+      <p>Die auf diese Weise erhobenen Daten der Nutzer werden durch technische Vorkehrungen pseudonymisiert. Daher ist eine Zuordnung der Daten zum aufrufenden Clients nicht mehr möglich. Die Daten werden nicht gemeinsam mit sonstigen personenbezogenen Daten der Nutzer gespeichert.</p>
+      <p>Beim Aufruf unserer Website werden die Nutzer durch einen Infobanner über die Verwendung von Cookies zu Analysezwecken informiert und auf diese Datenschutzerklärung verwiesen. Es erfolgt in diesem Zusammenhang auch ein Hinweis darauf, wie die Speicherung von Cookies in den Browsereinstellungen unterbunden werden kann.</p>
+
+      <h4>2. Rechtsgrundlage für die Datenverarbeitung</h4>
+      <p>Die Rechtsgrundlage für die Verarbeitung personenbezogener Daten unter Verwendung von Cookies zu Analysezwecken ist bei Vorliegen einer diesbezüglichen Einwilligung des Nutzers Art.&nbsp;6 Abs.&nbsp;1 lit.&nbsp;a DSGVO.</p>
+
+      <h4>3. Zweck der Datenverarbeitung</h4>
+      <p>Die Verwendung der Analyse-Cookies erfolgt zu dem Zweck, die Qualität unserer Website und ihre Inhalte zu verbessern. Durch die Analyse-Cookies erfahren wir, wie die Website genutzt wird und können so unser Angebot stetig optimieren. In diesen Zwecken liegt auch unser berechtigtes Interesse in der Verarbeitung der personenbezogenen Daten nach Art.&nbsp;6 Abs.&nbsp;1 lit.&nbsp;f DSGVO.</p>
+
+      <h4>4. Dauer der Speicherung, Widerspruchs- und Beseitigungsmöglichkeit</h4>
+      <p>Cookies werden auf dem Rechner des Nutzers gespeichert und von diesem an unserer Seite übermittelt. Daher haben Sie als Nutzer auch die volle Kontrolle über die Verwendung von Cookies. Durch eine Änderung der Einstellungen in Ihrem Internetbrowser können Sie die Übertragung von Cookies deaktivieren oder einschränken. Bereits gespeicherte Cookies können jederzeit gelöscht werden. Dies kann auch automatisiert erfolgen. Werden Cookies für unsere Website deaktiviert, können möglicherweise nicht mehr alle Funktionen der Website vollumfänglich genutzt werden.</p>
+    </section>
+  </Fragment>
+
+  <Fragment slot="footerlinks">
+    <li class="f"><a class="f" href="/impressum.html">Impressum</a></li>
+    <li class="f"><strong class="f">Datenschutz</strong></li>
+  </Fragment>
+</BaseLayout>
diff --git a/src/pages/impressum.html.astro b/src/pages/impressum.html.astro
new file mode 100644
index 00000000..ed9c01b9
--- /dev/null
+++ b/src/pages/impressum.html.astro
@@ -0,0 +1,42 @@
+---
+import BaseLayout from '../layouts/BaseLayout.astro';
+import Breadcrumb from '../components/Breadcrumb.astro';
+
+const crumbs = [
+  { title: 'Home', url: '/' },
+  { title: 'Impressum' },
+];
+---
+
+<BaseLayout title="Impressum">
+  <Fragment slot="breadcrumb">
+    <Breadcrumb crumbs={crumbs} />
+  </Fragment>
+
+  <Fragment slot="article">
+    <header>
+      <h1>Impressum</h1>
+    </header>
+    <p><em>Angaben gemäß § 5 TMG:</em></p>
+    <p>
+      Kai Moritz<br>
+      juplo.de<br>
+      Zumsandestr. 29a<br>
+      48145 Münster
+    </p>
+    <p>Telefon: +49 (0) 176 20 50 47 47</p>
+    <p>E-Mail: <a href="mailto:kai@juplo.de">kai@juplo.de</a></p>
+    <p>Umsatzsteuer-Identifikationsnummer gemäß §27 a Umsatzsteuergesetz: DE 23 500 84 56</p>
+    <p>Aufsichtsbehörde: Stadt Münster</p>
+    <h2>Contact</h2>
+    <p>
+      More contact-information (Facebook, Google+, ...) can be found on the
+      <a href="/contact.html" title="Show all contact-informations">contact-page</a>.
+    </p>
+  </Fragment>
+
+  <Fragment slot="footerlinks">
+    <li class="f"><strong class="f">Impressum</strong></li>
+    <li class="f"><a class="f" href="/datenschutz.html">Datenschutz</a></li>
+  </Fragment>
+</BaseLayout>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 561196ba..a982425e 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,17 +1,66 @@
 ---
+import { getCollection } from 'astro:content';
+import BaseLayout from '../layouts/BaseLayout.astro';
+import BlogNav from '../components/BlogNav.astro';
 
+const currentUrl = '/';
+
+const recentPosts = (await getCollection('blog', ({ data }) => !data.draft))
+  .sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
+  .slice(0, 5);
+
+function postUrl(post: any): string {
+  return post.data.url ?? `/${post.id}/`;
+}
 ---
 
-<html lang="en">
-	<head>
-		<meta charset="utf-8" />
-		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-		<link rel="icon" href="/favicon.ico" />
-		<meta name="viewport" content="width=device-width" />
-		<meta name="generator" content={Astro.generator} />
-		<title>Astro</title>
-	</head>
-	<body>
-		<h1>Astro</h1>
-	</body>
-</html>
+<BaseLayout title="juplo">
+  <Fragment slot="article">
+    <div class="pack bg cf">
+      <div class="p right">
+        <h2>Hibernate Maven Plugin</h2>
+        <p><strong>A simple Plugin for generating a Database-Schema from Hibernate Mappings</strong></p>
+        <p>hibernate-maven-plugin is a plugin for generating a database-schema from your Hibernate mappings and create or update your database accordingly. Its main usage is to automatically create and populate a test-database for unit-tests in cooperation with the dbunit-maven-plugin.</p>
+        <p><a href="/hibernate-maven-plugin/index.html" title="Visit the plugin-documentation">Learn more...</a></p>
+      </div>
+      <div class="p left">
+        <h2>Work In Progress…</h2>
+        <p>Due to lack of time, this page is still under construction.</p>
+        <p style="text-align: center"><img alt="Man bashing his head on a computer-keyboard" src="/img/wip.gif"></p>
+        <p>So, please be patiance with me…</p>
+      </div>
+    </div>
+    <div class="single">
+      <h2 class="widgettitle">Recent Posts</h2>
+      <ul>
+        {recentPosts.map(post => (
+          <li><a href={postUrl(post)}>{post.data.title}</a></li>
+        ))}
+      </ul>
+    </div>
+  </Fragment>
+
+  <Fragment slot="marginalcontent">
+    <aside class="m">
+      <h2>About juplo</h2>
+      <ul>
+        <li><a href="/about.html" title="Visit my about-page">More about juplo</a></li>
+        <li><a href="/blog/" title="(Hopefully) helpful stuff">Blog</a></li>
+        <li><a href="/projects/" title="All current projects">Projects</a></li>
+        <li><a href="/contact.html" title="All contact-information on a glance">Contact</a></li>
+      </ul>
+    </aside>
+    <aside class="m">
+      <h2>Funded by the Europian Union</h2>
+      <p>As partner of the company <a href="http://yourshouter.com" title="Visit the Homepage of the company">yourSHOUTER UG (haftungsbeschränkt)</a> we publish results of a <a href="http://yourshouter.com/projekte/crowdgest%C3%BCtzte-veranstaltungs-suchmaschine.html" title="Show details about the funded resarch-project">resarch-project</a>, that is funded by the European Union and the federal state Northrhine-Westphalia.</p>
+      <a class="img" href="http://yourshouter.com/projekte/crowdgest%C3%BCtzte-veranstaltungs-suchmaschine.html" title="Show details about the funded resarch-project">
+        <img alt="Europäische Union: Investitionen in unsere Zukunft - Europäischer Fonds für regionale Entwicklung" src="/img/EFRE_Foerderhinweis_deutsch_farbig.svg" width="100%">
+        <img alt="EFRE.NRW 2014-2020: Invesitionen in Wachstum und Beschäftigung" src="/img/Ziel2NRW_4c_1809_eps.svg" width="100%">
+      </a>
+    </aside>
+  </Fragment>
+
+  <Fragment slot="menu">
+    <BlogNav currentUrl={currentUrl} />
+  </Fragment>
+</BaseLayout>