diff --git a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/default.tsconfig.twig b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/default.tsconfig.twig
index a7300948..092e7db6 100644
--- a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/default.tsconfig.twig
+++ b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/default.tsconfig.twig
@@ -12,6 +12,16 @@ mod {
                         rowCount = 1
                         rows {
                             1 {
+                                columns {
+                                    1 {
+                                        name = LLL:EXT:{{ package.extensionKey }}/Resources/Private/Language/locallang_be.xlf:backend_layout.column.stage
+                                        colPos = 1
+                                        identifier = stage
+                                        slideMode = slide
+                                    }
+                                }
+                            }
+                            2 {
                                 columns {
                                     1 {
                                         name = LLL:EXT:{{ package.extensionKey }}/Resources/Private/Language/locallang_be.xlf:backend_layout.column.normal
@@ -23,7 +33,7 @@ mod {
                         }
                     }
                 }
-                icon = EXT:{{ package.extensionKey }}/Resources/Public/Icons/BackendLayouts/example.svg
+                icon = EXT:{{ package.extensionKey }}/Resources/Public/Icons/BackendLayouts/default.svg
             }
         }
     }
diff --git a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/example.tsconfig.twig b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/subpage.tsconfig.twig
similarity index 85%
rename from resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/example.tsconfig.twig
rename to resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/subpage.tsconfig.twig
index ef3256af..16c461bc 100644
--- a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/example.tsconfig.twig
+++ b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/subpage.tsconfig.twig
@@ -4,8 +4,8 @@
 mod {
     web_layout {
         BackendLayouts {
-            example {
-                title = LLL:EXT:{{ package.extensionKey }}/Resources/Private/Language/locallang_be.xlf:backend_layout.example
+            Subpage {
+                title = LLL:EXT:{{ package.extensionKey }}/Resources/Private/Language/locallang_be.xlf:backend_layout.subpage
                 config {
                     backend_layout {
                         colCount = 2
@@ -15,9 +15,10 @@ mod {
                                 columns {
                                     1 {
                                         name = LLL:EXT:{{ package.extensionKey }}/Resources/Private/Language/locallang_be.xlf:backend_layout.column.stage
-                                        colPos = 0
-                                        identifier = stage
+                                        colPos = 1
                                         colspan = 2
+                                        identifier = stage
+                                        slideMode = slide
                                     }
                                 }
                             }
@@ -31,15 +32,15 @@ mod {
                                     2 {
                                         name = LLL:EXT:{{ package.extensionKey }}/Resources/Private/Language/locallang_be.xlf:backend_layout.column.right
                                         colPos = 2
-                                        identifier = right
-                                        slideMode = slide
+                                        identifier = sidebar
+                                        slideMode = collectReverse
                                     }
                                 }
                             }
                         }
                     }
                 }
-                icon = EXT:{{ package.extensionKey }}/Resources/Public/Icons/BackendLayouts/example.svg
+                icon = EXT:{{ package.extensionKey }}/Resources/Public/Icons/BackendLayouts/subpage.svg
             }
         }
     }
diff --git a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/Navigation/breadcrumb.typoscript b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/Navigation/breadcrumb.typoscript
new file mode 100644
index 00000000..ca963b5d
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/Navigation/breadcrumb.typoscript
@@ -0,0 +1,12 @@
+page {
+  10 {
+    dataProcessing {
+      30 = menu
+      30 {
+        special = rootline
+        special.range = 0|-1
+        as = breadcrumb
+      }
+    }
+  }
+}
diff --git a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/Navigation/menu.typoscript b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/Navigation/menu.typoscript
new file mode 100644
index 00000000..2355f8f4
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/Navigation/menu.typoscript
@@ -0,0 +1,7 @@
+page {
+  10 {
+    dataProcessing {
+      20 = menu
+    }
+  }
+}
diff --git a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/configuration.typoscript b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/configuration.typoscript
new file mode 100644
index 00000000..0fdf274a
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/configuration.typoscript
@@ -0,0 +1,9 @@
+// Part 4: global site configuration
+config {
+  # Adjust the title tag to be displayed as “website - page title”
+  pageTitleSeparator = -
+  pageTitleSeparator.noTrimWrap = | | |
+
+  # Display the Admin Panel at the bottom of pages to logged in backend users
+  admPanel = 1
+}
diff --git a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/page.typoscript.twig b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/page.typoscript.twig
new file mode 100644
index 00000000..f2456775
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/TypoScript/page.typoscript.twig
@@ -0,0 +1,16 @@
+page = PAGE
+page {
+  10 = PAGEVIEW
+  10 {
+    paths {
+      0 = EXT:{{ package.extensionKey }}/Resources/Private/PageView/
+      10 = {${{ package.packageName }}.template_path}
+    }
+
+    dataProcessing {
+      # makes content elements available as {content} in Fluid template
+      10 = page-content
+    }
+  }
+  shortcutIcon = {${{ package.packageName }}.favicon}
+}
diff --git a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/settings.definitions.yaml.twig b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/settings.definitions.yaml.twig
new file mode 100644
index 00000000..38e0b12b
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/settings.definitions.yaml.twig
@@ -0,0 +1,38 @@
+categories:
+  {{ package.packageName }}:
+    label: '{{ package.title }}'
+  {{ package.packageName }}.templates:
+    label: 'Templates'
+    parent: {{ package.packageName }}
+  {{ package.packageName }}.layout:
+    label: 'Layout'
+    parent: {{ package.packageName }}
+
+settings:
+  {{ package.packageName }}.template_path:
+    label: 'Page template path'
+    category: {{ package.packageName }}.templates
+    description: 'Path to the templates of the {{ package.title }}.'
+    type: string
+    default: 'EXT:{{ package.extensionKey }}/Resources/Private/Templates/'
+
+  {{ package.packageName }}.logo:
+    label: 'Logo'
+    category: {{ package.packageName }}.layout
+    description: 'Path to the logo of {{ package.title }}.'
+    type: string
+    default: 'EXT:{{ package.extensionKey }}/Resources/Public/Images/logo.svg'
+
+  {{ package.packageName }}.logo-alt:
+    label: 'Logo Alt text'
+    category: {{ package.packageName }}.layout
+    description: 'Alternative text of the logo for the visually impaired'
+    type: string
+    default: 'Logo'
+
+  {{ package.packageName }}.favicon:
+    label: 'Favicon'
+    description: 'This icon is displayed in search engine results and in the browser tab'
+    category: {{ package.packageName }}.layout
+    type: string
+    default: 'EXT:{{ package.extensionKey }}/Resources/Public/Icons/favicon.ico'
diff --git a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/settings.yaml.twig b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/settings.yaml.twig
index 7862ca31..042dc5f9 100644
--- a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/settings.yaml.twig
+++ b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/settings.yaml.twig
@@ -1,28 +1,12 @@
 styles:
-  templates:
-    layoutRootPath: 'EXT:{{ package.extensionKey }}/Resources/Private/ContentElements/Layouts/'
-    partialRootPath: 'EXT:{{ package.extensionKey }}/Resources/Private/ContentElements/Partials/'
-    templateRootPath: 'EXT:{{ package.extensionKey }}/Resources/Private/ContentElements/Templates/'
-
-page:
-  pageview:
-    paths: 'EXT:{{ package.extensionKey }}/Resources/Private/PageView/'
-
-  meta:
-    viewport: 'width=device-width, initial-scale=1'
-    robots: 'index,follow'
-    apple-mobile-web-app-capable: 'no'
-    compatible: 'IE=edge'
-
-  tracking:
-    google:
-      trackingID: ''
-      anonymizeIp: '1'
-
-config:
-  no_cache: '0'
-  removeDefaultJS: '0'
-  admPanel: '1'
-  prefixLocalAnchors: 'all'
-  headerComment: 'build by sitepackagebuilder.com'
-  sendCacheHeaders: '1'
+    templates:
+        layoutRootPath: EXT:{{ package.extensionKey }}/Resources/Private/ContentElements/Layouts
+        partialRootPath: EXT:{{ package.extensionKey }}/Resources/Private/ContentElements/Partials
+        templateRootPath: EXT:{{ package.extensionKey }}/Resources/Private/ContentElements/Templates
+    content:
+        textmedia:
+            maxW: 1200
+            maxWInText: 600
+            linkWrap:
+                lightboxEnabled: true
+                lightboxCssClass: lightbox
diff --git a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/setup.typoscript.twig b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/setup.typoscript.twig
index af881eb5..5509a99f 100644
--- a/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/setup.typoscript.twig
+++ b/resources/packages/site_package_tutorial/13.4/src/Configuration/Sets/SitePackage/setup.typoscript.twig
@@ -1,102 +1,2 @@
-##############
-#### PAGE ####
-##############
-page = PAGE
-page {
-    typeNum = 0
-    shortcutIcon = EXT:{{ package.extensionKey }}/Resources/Public/Icons/favicon.ico
-
-    10 = PAGEVIEW
-    10 {
-        paths {
-            0 = EXT:{{ package.extensionKey }}/Resources/Private/PageView/
-            1 = {$page.pageview.paths}
-        }
-        dataProcessing {
-            10 = files
-            10 {
-                references.fieldName = media
-            }
-            20 = menu
-            20 {
-                levels = 2
-                includeSpacer = 1
-                as = mainnavigation
-            }
-            30 = page-content
-        }
-    }
-
-    meta {
-        viewport = {$page.meta.viewport}
-        robots = {$page.meta.robots}
-        apple-mobile-web-app-capable = {$page.meta.apple-mobile-web-app-capable}
-
-        X-UA-Compatible = {$page.meta.compatible}
-        X-UA-Compatible {
-            attribute = http-equiv
-        }
-    }
-
-    includeCSSLibs {
-
-    }
-
-    includeCSS {
-        {{ package.extensionKey }}_layout = EXT:{{ package.extensionKey }}/Resources/Public/Css/layout.css
-    }
-
-    includeJSLibs {
-
-    }
-
-    includeJS {
-
-    }
-
-    includeJSFooterlibs {
-
-    }
-
-    includeJSFooter {
-        {{ package.extensionKey }}_scripts = EXT:{{ package.extensionKey }}/Resources/Public/JavaScript/main.js
-    }
-}
-
-
-################
-#### CONFIG ####
-################
-config {
-    absRefPrefix = auto
-    no_cache = {$config.no_cache}
-    uniqueLinkVars = 1
-    pageTitleFirst = 1
-    linkVars = L
-    prefixLocalAnchors = {$config.prefixLocalAnchors}
-    renderCharset = utf-8
-    metaCharset = utf-8
-    doctype = html5
-    removeDefaultJS = {$config.removeDefaultJS}
-    inlineStyle2TempFile = 1
-    admPanel = {$config.admPanel}
-    debug = 0
-    cache_period = 86400
-    sendCacheHeaders = {$config.sendCacheHeaders}
-    intTarget =
-    extTarget =
-    disablePrefixComment = 1
-    index_enable = 1
-    index_externals = 1
-    index_metatags = 1
-    headerComment = {$config.headerComment}
-
-    // Disable Image Upscaling
-    noScaleUp = 1
-
-    // Compression and Concatenation of CSS and JS Files
-    compressJs = 0
-    compressCss = 0
-    concatenateJs = 0
-    concatenateCss = 0
-}
+@import './TypoScript/*.typoscript'
+@import './TypoScript/Navigation/*.typoscript'
diff --git a/resources/packages/site_package_tutorial/13.4/src/Initialisation/Site/main/config.yaml.twig b/resources/packages/site_package_tutorial/13.4/src/Initialisation/Site/main/config.yaml.twig
index 237a99bd..199a6926 100644
--- a/resources/packages/site_package_tutorial/13.4/src/Initialisation/Site/main/config.yaml.twig
+++ b/resources/packages/site_package_tutorial/13.4/src/Initialisation/Site/main/config.yaml.twig
@@ -11,4 +11,4 @@ languages:
     navigationTitle: English
     flag: us
 rootPageId: 1
-websiteTitle: 'Example site'
+websiteTitle: '{{ package.title }}'
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/Language/locallang_be.xlf.twig b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/Language/locallang_be.xlf.twig
index 4f7dd7ce..542eb196 100644
--- a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/Language/locallang_be.xlf.twig
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/Language/locallang_be.xlf.twig
@@ -9,6 +9,9 @@
             <trans-unit id="backend_layout.default">
                 <source>Default</source>
             </trans-unit>
+            <trans-unit id="backend_layout.subpage">
+                <source>Subpage</source>
+            </trans-unit>
             <trans-unit id="backend_layout.column.stage">
                 <source>Stage</source>
             </trans-unit>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Layouts/Default.html.twig b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Layouts/Default.html.twig
deleted file mode 100644
index ad57953f..00000000
--- a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Layouts/Default.html.twig
+++ /dev/null
@@ -1,21 +0,0 @@
-<ul>
-    <f:for each="{mainnavigation}" as="mainnavigationItem">
-        <li class="{f:if(condition: mainnavigationItem.active, then:'active')}">
-            <a href="{mainnavigationItem.link}" target="{mainnavigationItem.target}" title="{mainnavigationItem.title}">
-                {mainnavigationItem.title}
-            </a>
-            <f:if condition="{mainnavigationItem.children}">
-                <ul>
-                    <f:for each="{mainnavigationItem.children}" as="child">
-                        <li class="{f:if(condition: child.active, then:'active')}">
-                            <a href="{child.link}" target="{child.target}" title="{child.title}">
-                                {child.title}
-                            </a>
-                        </li>
-                    </f:for>
-                </ul>
-            </f:if>
-        </li>
-    </f:for>
-</ul>
-<f:render section="Main" />
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Layouts/PageLayout.html.twig b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Layouts/PageLayout.html.twig
new file mode 100644
index 00000000..604adf2c
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Layouts/PageLayout.html.twig
@@ -0,0 +1,9 @@
+<f:asset.css identifier="bootstrap" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" />
+<f:asset.css identifier="main" href="EXT:{{ package.extensionKey }}/Resources/Public/Css/main.css" />
+<main>
+    <f:render partial="Header" arguments="{_all}"/>
+    <f:render section="Main"/>
+    <f:render partial="Footer" arguments="{_all}"/>
+</main>
+<f:asset.script identifier="bootstrap" src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" />
+<f:asset.script identifier="main" src="EXT:{{ package.extensionKey }}/Resources/Public/JavaScript/main.js" />
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Default.html.twig b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Default.html.twig
index 4df9efcd..aae3534b 100644
--- a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Default.html.twig
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Default.html.twig
@@ -1,19 +1,10 @@
-<f:layout name="Default" />
+<f:layout name="PageLayout"/>
 <f:section name="Main">
 
-    <div style="background-color: yellow; padding: 0.5em 1em;">
-        <dl>
-            <dt>Template file</dt>
-            <dd>
-                <code>packages/{{ package.extensionKey }}/Resources/Private/PageView/Pages/Default.html</code>
-            </dd>
-            <dt>Backend Configuration</dt>
-            <dd>
-                <code>packages/{{ package.extensionKey }}/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/default.tsconfig</code>
-            </dd>
-        </dl>
-    </div>
+    <f:render partial="Stage" arguments="{_all}"/>
 
-    <f:render partial="Content" arguments="{records: content.main.records}"/>
+    <div class="container">
+        <f:render partial="Content" arguments="{records: content.main.records}"/>
+    </div>
 
 </f:section>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Example.html.twig b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Example.html.twig
deleted file mode 100644
index 33e25065..00000000
--- a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Example.html.twig
+++ /dev/null
@@ -1,26 +0,0 @@
-<f:layout name="Default" />
-<f:section name="Main">
-
-    <div style="background-color: yellow; padding: 0.5em 1em;">
-        <dl>
-            <dt>Template file</dt>
-            <dd>
-                <code>packages/{{ package.extensionKey }}/Resources/Private/PageView/Pages/Default.html</code>
-            </dd>
-            <dt>Backend Configuration</dt>
-            <dd>
-                <code>packages/{{ package.extensionKey }}/Configuration/Sets/SitePackage/PageTsConfig/BackendLayouts/default.tsconfig</code>
-            </dd>
-        </dl>
-    </div>
-
-    <div class="stage">
-        <f:render partial="Content" arguments="{records: content.stage.records}"/>
-    </div>
-    <div class="main">
-        <f:render partial="Content" arguments="{records: content.main.records}"/>
-    </div>
-    <div class="right">
-        <f:render partial="Content" arguments="{records: content.right.records}"/>
-    </div>
-</f:section>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Subpage.html.twig b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Subpage.html.twig
new file mode 100644
index 00000000..4db1efbc
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Pages/Subpage.html.twig
@@ -0,0 +1,18 @@
+<f:layout name="PageLayout"/>
+<f:section name="Main">
+
+    <f:render partial="Stage" arguments="{_all}"/>
+    <f:render partial="Navigation/Breadcrumb" arguments="{_all}"/>
+
+    <div class="container">
+        <div class="row">
+            <div class="col-md-8">
+                <f:render partial="Content" arguments="{records: content.main.records}"/>
+            </div>
+            <div class="col-md-4">
+                <f:render partial="Content" arguments="{records: content.sidebar.records}"/>
+            </div>
+        </div>
+    </div>
+
+</f:section>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Content.html.twig b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Content.html.twig
index 8ce77703..073e6525 100644
--- a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Content.html.twig
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Content.html.twig
@@ -1,7 +1,7 @@
 <f:for each="{records}" as="record">
     <f:cObject
-            typoscriptObjectPath="{record.mainType}"
-            data="{record}"
-            table="{record.mainType}"
+        typoscriptObjectPath="{record.mainType}"
+        data="{record}"
+        table="{record.mainType}"
     />
 </f:for>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Footer.html.twig b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Footer.html.twig
new file mode 100644
index 00000000..88141be5
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Footer.html.twig
@@ -0,0 +1,13 @@
+<div class="container">
+    <footer class="d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">
+        <div class="col-md-4 d-flex align-items-center">
+
+            <f:link.page pageUid="{site.rootPageId}" class="mb-3 me-2 mb-md-0 text-body-secondary text-decoration-none lh-1">
+                <f:image src="{settings.{{ package.packageName }}.logo}" alt="{settings.{{ package.packageName }}.logo-alt}" height="24" class="bi" />
+            </f:link.page>
+            <span class="mb-3 mb-md-0 text-body-secondary">&copy; <f:format.date format="Y">now</f:format.date> {site.configuration.websiteTitle}</span>
+        </div>
+
+        <f:render partial="Navigation/FooterMenu.html" arguments="{_all}"/>
+    </footer>
+</div>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Header.html.twig b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Header.html.twig
new file mode 100644
index 00000000..bd6b0ffb
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Header.html.twig
@@ -0,0 +1,15 @@
+<nav class="navbar navbar-expand-lg bg-body-tertiary mb-4">
+    <div class="container">
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#menuToggler" aria-controls="menuToggler" aria-expanded="false" aria-label="Toggle navigation">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="menuToggler">
+            <f:link.page pageUid="{site.rootPageId}" class="navbar-brand">
+                <f:image src="{settings.{{ package.packageName }}.logo}" alt="{settings.{{ package.packageName }}.logo-alt}" class="pe-3" />
+                {site.configuration.websiteTitle}
+            </f:link.page>
+
+            <f:render partial="Navigation/Menu" arguments="{_all}"/>
+        </div>
+    </div>
+</nav>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Navigation/Breadcrumb.html b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Navigation/Breadcrumb.html
new file mode 100644
index 00000000..c1b4c28b
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Navigation/Breadcrumb.html
@@ -0,0 +1,22 @@
+<f:if condition="{breadcrumb}">
+    <div class="container">
+        <nav aria-label="breadcrumb">
+            <ol class="breadcrumb breadcrumb-chevron p-3 bg-body-tertiary">
+                <f:for each="{breadcrumb}" as="item">
+                    <f:if condition="{item.current}">
+                        <f:then>
+                            <li class="breadcrumb-item active" aria-current="page">{item.title}</li>
+                        </f:then>
+                        <f:else>
+                            <li class="breadcrumb-item">
+                                <a class="link-body-emphasis fw-semibold text-decoration-none" href="{item.link}" title="{item.title}">
+                                    <span class="breadcrumb-text">{item.title}</span>
+                                </a>
+                            </li>
+                        </f:else>
+                    </f:if>
+                </f:for>
+            </ol>
+        </nav>
+    </div>
+</f:if>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Navigation/FooterMenu.html b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Navigation/FooterMenu.html
new file mode 100644
index 00000000..270a85da
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Navigation/FooterMenu.html
@@ -0,0 +1,4 @@
+<ul class="nav col-md-4 justify-content-end">
+    <li class="nav-item"><a href="#" class="nav-link px-2 text-body-secondary">Data privacy</a></li>
+    <li class="nav-item"><a href="#" class="nav-link px-2 text-body-secondary">Imprint</a></li>
+</ul>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Navigation/Menu.html b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Navigation/Menu.html
new file mode 100644
index 00000000..2a326864
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Navigation/Menu.html
@@ -0,0 +1,13 @@
+<ul class="navbar-nav me-auto mb-2 mb-lg-0">
+    <f:for each="{menu}" as="menuItem">
+        <li class="nav-item">
+            <a class="nav-link {f:if(condition: menuItem.active, then:'active')}"
+               href="{menuItem.link}"
+               target="{menuItem.target}"
+               title="{menuItem.title}"
+            >
+                {menuItem.title}
+            </a>
+        </li>
+    </f:for>
+</ul>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Stage.html b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Stage.html
new file mode 100644
index 00000000..f4c88252
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Private/PageView/Partials/Stage.html
@@ -0,0 +1,9 @@
+<f:for each="{content.stage.records}" as="record">
+    <div class="container">
+        <f:cObject
+            typoscriptObjectPath="{record.mainType}"
+            data="{record}"
+            table="{record.mainType}"
+        />
+    </div>
+</f:for>
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Css/main.css b/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Css/main.css
new file mode 100644
index 00000000..37ee76e5
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Css/main.css
@@ -0,0 +1,21 @@
+:root {
+    --bs-border-radius: 0;
+    --bs-border-radius-sm: 0;
+    --bs-border-radius-lg: 0;
+    --bs-primary: #ff8700;
+    --bs-primary-bg-subtle: #ffcc99;
+}
+
+.nav {
+    --bs-nav-link-color: var(--bs-body-color);
+    --bs-nav-link-hover-color: var(--bs-dark);
+}
+
+.navbar-expand-lg .navbar-nav .nav-link.active {
+    border-bottom: 2px solid var(--bs-primary);
+}
+
+.navbar-expand-lg .navbar-nav .nav-link:hover {
+    border-bottom: 2px solid var(--bs-primary-bg-subtle);
+}
+
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Icons/Extension.svg b/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Icons/Extension.svg
index d8536373..bca7a175 100644
--- a/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Icons/Extension.svg
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Icons/Extension.svg
@@ -1,3 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="83.098" height="84.172" viewBox="43.201 42.122 83.098 84.172">
-  <path fill="#FF8700" d="M106.074 100.128c-1.247.368-2.242.506-3.549.506-10.689 0-26.389-37.359-26.389-49.793 0-4.577 1.083-6.104 2.613-7.415-13.084 1.527-28.784 6.329-33.806 12.433-1.085 1.529-1.743 3.926-1.743 6.98 0 19.41 20.718 63.455 35.332 63.455 6.765.001 18.164-11.112 27.542-26.166M99.25 42.122c13.52 0 27.049 2.18 27.049 9.812 0 15.483-9.819 34.246-14.832 34.246-8.942 0-20.065-24.867-20.065-37.301.001-5.67 2.181-6.757 7.848-6.757"/>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="#FF8700" d="M0 0h64v64H0z"/><path fill="#FFF" d="M42.8 32.8c-3.6 0-8.1-10.1-8.1-15.1 0-2.3.9-2.7 3.2-2.7 5.5 0 11 .9 11 4-.1 6.2-4 13.8-6.1 13.8zM28.5 18.5c0 5 6.4 20.2 10.7 20.2.5 0 .9-.1 1.4-.2-3.8 6.1-8.4 10.6-11.2 10.6-5.9 0-14.3-17.9-14.3-25.7 0-1.2.3-2.2.7-2.8 2-2.5 8.4-4.4 13.7-5-.6.4-1 1-1 2.9z"/></svg>
\ No newline at end of file
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Icons/favicon.ico b/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Icons/favicon.ico
index 46d4c14d..90fdfe18 100644
Binary files a/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Icons/favicon.ico and b/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Icons/favicon.ico differ
diff --git a/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Images/logo.svg b/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Images/logo.svg
new file mode 100644
index 00000000..bca7a175
--- /dev/null
+++ b/resources/packages/site_package_tutorial/13.4/src/Resources/Public/Images/logo.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="#FF8700" d="M0 0h64v64H0z"/><path fill="#FFF" d="M42.8 32.8c-3.6 0-8.1-10.1-8.1-15.1 0-2.3.9-2.7 3.2-2.7 5.5 0 11 .9 11 4-.1 6.2-4 13.8-6.1 13.8zM28.5 18.5c0 5 6.4 20.2 10.7 20.2.5 0 .9-.1 1.4-.2-3.8 6.1-8.4 10.6-11.2 10.6-5.9 0-14.3-17.9-14.3-25.7 0-1.2.3-2.2.7-2.8 2-2.5 8.4-4.4 13.7-5-.6.4-1 1-1 2.9z"/></svg>
\ No newline at end of file