create-ginko 0.4.0 → 0.6.0

package/templates/blog/app/pages/legal/[slug].vue

@@ -0,0 +1,46 @@
+<!-- Synced from templates/_features/site/app/pages/legal/[slug].vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+// One legal text (content/legal/): privacy policy, terms, imprint. Address: /legal/<slug> in every language.
+// The imprint starts with the details of content/site.md (name, address, register, VAT number, email, phone), so the
+// owner writes them once; the text below adds what site.md cannot hold. A detail site.md does not have is left out.
+// Email and phone are links (mailto:, tel:), like on the contact page.
+const route = useRoute()
+const entry = useGinkoEntry('legal', () => route.params.slug)
+const site = useGinko('site')
+const { t, format } = useI18n('site')
+const details = computed(() => {
+  const d = site.value.data
+  if (entry.value.data.legalType !== 'imprint') return []
+  const rows: { label: string, value?: string, href?: string }[] = [
+    { label: t('imprint.address'), value: [d.legalName, d.street, d.city ? `${d.postalCode ?? ''} ${d.city}` : undefined].filter(Boolean).join('\n') },
+    { label: t('imprint.registry'), value: [d.registryCourt, d.registryNumber].filter(Boolean).join(', ') },
+    { label: t('imprint.vat'), value: d.vatId },
+    { label: t('imprint.email'), value: d.email, href: d.email ? `mailto:${d.email}` : undefined },
+    { label: t('imprint.phone'), value: d.phone, href: d.phone ? telHref(d.phone) : undefined },
+  ]
+  return rows.filter((row) => row.value)
+})
+usePageSeo(() => ({ title: entry.value.data.title, description: entry.value.data.description }))
+</script>
+
+<template>
+  <div>
+    <BlockPageHeader
+      :title="entry.data.title"
+      :lead="entry.data.description"
+      :meta="t('updated', { date: format.date(entry.data.updatedAt) })"
+    />
+    <!-- Each value keeps the direction of its own text (bdi), as in the footer. A link gets its 44 px tap height from
+         padding with a negative margin, so it stays on its label's line. -->
+    <dl v-if="details.length" class="mx-auto grid max-w-page gap-x-8 gap-y-1 px-gutter pb-10 sm:grid-cols-[auto_1fr] sm:gap-y-3">
+      <template v-for="row in details" :key="row.label">
+        <dt class="text-small text-muted-foreground max-sm:not-first:mt-3">{{ row.label }}</dt>
+        <dd class="whitespace-pre-line">
+          <a v-if="row.href" :href="row.href" dir="ltr" class="-my-2.5 inline-block py-2.5 underline underline-offset-4">{{ row.value }}</a>
+          <bdi v-else>{{ row.value }}</bdi>
+        </dd>
+      </template>
+    </dl>
+    <ProseBody :value="entry.data.body" />
+  </div>
+</template>

package/templates/blog/app/pages/news/[slug].vue

@@ -0,0 +1,94 @@
+<!-- Synced from templates/_features/blog/app/pages/news/[slug].vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+import type { Component } from 'vue'
+import { postJsonLd } from '@lupinum/ginko/basics'
+import { ArrowLeft, ArrowRight } from '@lucide/vue'
+
+// One post: title, summary, date and reading time, authors (initials and role, linked to their page when people have
+// one), cover (3:2), text and tags (linked to their pages), with BlogPosting JSON-LD; then the older and the newer
+// post and a link to all news, so a visitor who comes from a share or the feed does not end above the footer. A template
+// may bring `app/components/site/PageCta.vue`, its closing band: it shows at the end of the post.
+const cta = Object.values(import.meta.glob<Component>('../../components/site/PageCta.vue', { eager: true, import: 'default' }))[0]
+const route = useRoute()
+const entry = useGinkoEntry('posts', () => route.params.slug)
+const posts = useBlogPosts()
+const tagPath = useTagPath()
+const path = useGinkoPath()
+const { url } = useGinkoSite()
+const { t, format, language } = useI18n('blog')
+// Read the entry first: it answers 404 for an unknown or hidden slug, also in a language whose list is empty (there
+// `find` never calls its callback). Past that line the entry is visible, so the list has it.
+const index = computed(() => {
+  const id = entry.value.id
+  return posts.value.findIndex((item) => item.id === id)
+})
+const post = computed(() => posts.value[index.value]!)
+// The list is newest first: the newer post comes before this one, the older one after it.
+const newer = computed(() => posts.value[index.value - 1])
+const older = computed(() => posts.value[index.value + 1])
+const absolute = (path: string) => new URL(path, url).href
+usePageSeo(() => ({
+  title: post.value.title,
+  description: post.value.description,
+  image: post.value.image,
+  jsonLd: [postJsonLd({
+    title: post.value.title,
+    url: absolute(route.path),
+    date: post.value.date,
+    modified: entry.value.updatedAt,
+    description: post.value.description,
+    image: post.value.image ? absolute(post.value.image.url) : undefined,
+    authors: post.value.authors.map((author) => ({ name: author.name, url: author.to ? absolute(author.to) : undefined })),
+    tags: post.value.tags,
+    lang: language.value,
+  })],
+}))
+</script>
+
+<template>
+  <div>
+    <article>
+      <BlockPageHeader :title="post.title" :lead="post.description">
+        <p class="text-small text-muted-foreground tabular-nums">
+          <time :datetime="post.date">{{ format.date(post.date) }}</time>
+          <template v-if="post.minutes"><span aria-hidden="true"> · </span><span class="sr-only">, </span>{{ t('minutes', { count: post.minutes }) }}</template>
+        </p>
+        <BlogByline :authors="post.authors" />
+      </BlockPageHeader>
+      <div v-if="post.image" class="mx-auto max-w-page px-gutter pb-10">
+        <GinkoImage :image="post.image" eager sizes="(min-width: 1216px) 896px, 100vw" class="aspect-3/2 w-full max-w-4xl rounded-block bg-muted object-cover" />
+      </div>
+      <ProseBody :value="entry.data.body" />
+      <div v-if="post.tags.length" class="mx-auto max-w-page px-gutter pt-10">
+        <h2 class="sr-only">{{ t('tags') }}</h2>
+        <ul class="flex flex-wrap gap-2">
+          <li v-for="tag in post.tags" :key="tag">
+            <NuxtLink :to="tagPath(tag)" rel="tag" class="inline-flex min-h-11 items-center rounded-md border px-4 text-small transition-[color,background-color,border-color] duration-150 hover:bg-accent">{{ tagLabel(tag) }}</NuxtLink>
+          </li>
+        </ul>
+      </div>
+      <nav v-if="older || newer" :aria-label="t('pager')" class="mx-auto max-w-page px-gutter pt-10">
+        <ul class="grid max-w-4xl gap-3 sm:grid-cols-2">
+          <li v-if="older">
+            <NuxtLink :to="older.to" rel="prev" class="flex h-full min-h-11 flex-col gap-1 rounded-block border p-5 transition-colors duration-150 hover:bg-accent">
+              <span class="inline-flex items-center gap-2 text-small text-muted-foreground"><ArrowLeft class="size-4 rtl:-scale-x-100" aria-hidden="true" />{{ t('older') }}</span>
+              <span class="font-medium">{{ older.title }}</span>
+            </NuxtLink>
+          </li>
+          <li v-if="newer" class="sm:col-start-2">
+            <NuxtLink :to="newer.to" rel="next" class="flex h-full min-h-11 flex-col items-end gap-1 rounded-block border p-5 text-end transition-colors duration-150 hover:bg-accent">
+              <span class="inline-flex items-center gap-2 text-small text-muted-foreground">{{ t('newer') }}<ArrowRight class="size-4 rtl:-scale-x-100" aria-hidden="true" /></span>
+              <span class="font-medium">{{ newer.title }}</span>
+            </NuxtLink>
+          </li>
+        </ul>
+      </nav>
+      <div class="mx-auto max-w-page px-gutter pt-10">
+        <NuxtLink :to="path('news')" class="inline-flex min-h-11 items-center gap-2 font-medium text-primary underline-offset-4 hover:underline">
+          {{ t('latest') }}<ArrowRight class="size-4 rtl:-scale-x-100" aria-hidden="true" />
+        </NuxtLink>
+      </div>
+    </article>
+    <component :is="cta" v-if="cta" />
+  </div>
+</template>

package/templates/blog/app/pages/news/index.vue

@@ -0,0 +1,54 @@
+<!-- Synced from templates/_features/blog/app/pages/news/index.vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+import { Rss } from '@lucide/vue'
+import type { BlogPost } from '~/composables/useBlog'
+
+// The news: every post, newest first (content/posts/), grouped by year once they span more than one, with the tags
+// as links to their pages above them. The feed of this language is linked in the head and below the list. The address
+// per language comes from `pages.news` in ginko.config.ts.
+const posts = useBlogPosts()
+const tags = useBlogTags()
+const feed = useFeedPath()
+const route = useRoute()
+const { name, url } = useGinkoSite()
+const { t, language } = useI18n('blog')
+const years = computed(() => {
+  const groups: { year: string, posts: BlogPost[] }[] = []
+  for (const post of posts.value) {
+    const year = post.date.slice(0, 4)
+    if (groups.at(-1)?.year === year) groups.at(-1)!.posts.push(post)
+    else groups.push({ year, posts: [post] })
+  }
+  return groups
+})
+useHead(() => ({ link: [{ rel: 'alternate', type: 'application/rss+xml', title: t('feed'), href: feed.value }] }))
+usePageSeo(() => ({
+  title: t('title'),
+  description: t('lead'),
+  jsonLd: [{ '@context': 'https://schema.org', '@type': 'Blog', name: `${name}: ${t('title')}`, description: t('lead'), url: new URL(route.path, url).href, inLanguage: language.value }],
+}))
+</script>
+
+<template>
+  <div>
+    <BlockPageHeader :title="t('title')" :lead="t('lead')" />
+    <div class="mx-auto max-w-page px-gutter">
+      <div class="max-w-4xl">
+        <nav v-if="tags.length" :aria-label="t('tags')" class="pb-8">
+          <BlogTagList :tags="tags" />
+        </nav>
+        <template v-if="years.length > 1">
+          <section v-for="group in years" :key="group.year" :aria-labelledby="`year-${group.year}`" class="pt-6 first:pt-0">
+            <h2 :id="`year-${group.year}`" class="pb-2 text-h3 tabular-nums">{{ group.year }}</h2>
+            <BlogPostList :items="group.posts" heading-level="h3" />
+          </section>
+        </template>
+        <BlogPostList v-else-if="posts.length" :items="posts" />
+        <BlockEmpty v-else :title="t('empty')" path="content/posts/" />
+        <a :href="feed" class="mt-6 inline-flex min-h-11 items-center gap-2 text-small text-muted-foreground underline-offset-4 hover:text-foreground hover:underline">
+          <Rss class="size-4" aria-hidden="true" />{{ t('feed') }}
+        </a>
+      </div>
+    </div>
+  </div>
+</template>

package/templates/blog/app/pages/news/tags/[tag].vue

@@ -0,0 +1,41 @@
+<!-- Synced from templates/_features/blog/app/pages/news/tags/[tag].vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+import { ArrowRight } from '@lucide/vue'
+
+// One tag: the posts that carry it, newest first. Tags are free text in each language's files, so a tag has no
+// translation: the page names only its own language as alternate (a link to another language's news page would be a
+// false hreflang), so the switch shows it as not translated. A tag no visible post carries is a 404. The address is
+// the news page's, then the word for `tags` in app/routes.ts (`segments`), then the tag.
+definePageMeta({
+  i18nAlternates: (to, { locale }) => ({ [locale]: to.path }),
+})
+const route = useRoute()
+const posts = useBlogPosts()
+const tags = useBlogTags()
+const path = useGinkoPath()
+const { t } = useI18n('blog')
+const slug = computed(() => String(route.params.tag))
+// Thrown on every read while no post carries the tag, like useGinkoEntry: fatal, so client navigation shows the 404.
+const tag = toRef(() => {
+  const found = tags.value.find((item) => item.slug === slug.value)
+  if (!found) throw createError({ statusCode: 404, statusMessage: 'Not found', fatal: true })
+  return found
+})
+const tagged = computed(() => posts.value.filter((post) => post.tags.some((name) => tagSlug(name) === tag.value.slug)))
+const title = computed(() => t('tagged', { tag: tag.value.name }))
+usePageSeo(() => ({ title: title.value, description: t('count', { count: tag.value.count }) }))
+</script>
+
+<template>
+  <div>
+    <BlockPageHeader :title="title" :meta="t('count', { count: tag.count })" />
+    <div class="mx-auto max-w-page px-gutter">
+      <div class="max-w-4xl">
+        <BlogPostList :items="tagged" />
+        <NuxtLink :to="path('news')" class="mt-6 inline-flex min-h-11 items-center gap-2 font-medium text-primary underline-offset-4 hover:underline">
+          {{ t('all') }}<ArrowRight class="size-4 rtl:-scale-x-100" aria-hidden="true" />
+        </NuxtLink>
+      </div>
+    </div>
+  </div>
+</template>

package/templates/blog/app/pages/team.vue

@@ -0,0 +1,40 @@
+<!-- Synced from templates/_features/people/app/pages/team.vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+import type { Component } from 'vue'
+import { personJsonLd } from '@lupinum/ginko/basics'
+
+// The team or board: every entry of content/people/ in its order, with Person JSON-LD. The address per language
+// comes from `pages.team` in ginko.config.ts. A template may bring `app/components/people/TeamContact.vue` (the
+// company: its service line and office); the page then shows it between the header and the people, without a copy
+// of this page per template.
+const contact = Object.values(import.meta.glob<Component>('../components/people/TeamContact.vue', { eager: true, import: 'default' }))[0]
+const people = useGinko('people')
+const locale = useGinkoLocale()
+const { name, url } = useGinkoSite()
+const { t } = useI18n('people')
+usePageSeo(() => ({
+  title: t('title'),
+  description: t('lead'),
+  jsonLd: people.value.items.map((person) => personJsonLd({
+    name: person.data.name,
+    role: person.data.role,
+    bio: person.data.bio,
+    email: person.data.email,
+    phone: person.data.phone,
+    image: person.data.photo ? new URL(person.data.photo.url, url).href : undefined,
+    url: person.urls?.[locale.value] ? new URL(person.urls[locale.value]!, url).href : undefined,
+    worksFor: { name, url },
+  })),
+}))
+</script>
+
+<template>
+  <div>
+    <BlockPageHeader :title="t('title')" :lead="t('lead')" />
+    <div class="mx-auto flex max-w-page flex-col gap-12 px-gutter md:gap-16">
+      <component :is="contact" v-if="contact" />
+      <PeopleList v-if="people.items.length" :items="people.items" />
+      <BlockEmpty v-else :title="t('empty')" path="content/people/" />
+    </div>
+  </div>
+</template>

package/templates/blog/app/routes.ts

@@ -0,0 +1,31 @@
+// The languages of this site and the web address of each page per language (TEMPLATES T8). The first language is
+// the main one: its addresses have no prefix, the others start with /<code>. `npm create ginko -- --locales` edits
+// the `locales` list and drops the dropped languages' entries from the maps below.
+export const locales = ['en', 'de'] as const
+export type SiteLocale = (typeof locales)[number]
+
+/**
+ * The words of the addresses, per language: `localized('/posts/[slug]')` gives `/de/beitraege/[slug]` in German. A
+ * part of a path that is not listed here stays as it is. Slugs allow only a–z, 0–9 and `-`. To rename a section,
+ * change its word here; the pages and links follow. `tags` is the word of a tag's page under the posts
+ * (`/posts/topics/birds`).
+ */
+export const segments: Record<string, Partial<Record<SiteLocale, string>>> = {
+  posts: { en: 'posts', de: 'beitraege' },
+  tags: { en: 'topics', de: 'themen' },
+  about: { en: 'about', de: 'ueber-uns' },
+  legal: { en: 'legal', de: 'rechtliches' },
+}
+
+/** The path prefix of a language: none for the main language, `/de` for German as a second language. */
+export const prefix = (locale: SiteLocale) => (locale === locales[0] ? '' : `/${locale}`)
+
+/** A path of `localized`: a route keeps its `[slug]`, so the result still fits a collection's `route`. */
+type Localized<P extends string> = P extends `${string}[slug]${string}` ? `/${string}[slug]${string}` : `/${string}`
+
+/** One address per language from a path in its English form, with the words of `segments`: `localized('/posts')`. */
+export function localized<const P extends `/${string}`>(path: P): Record<SiteLocale, Localized<P>> {
+  const words = (locale: SiteLocale) => path.split('/').map((part) => segments[part]?.[locale] ?? part).join('/')
+  // Object.fromEntries loses the key and value types; the keys are exactly `locales`, and the words never touch `[slug]`.
+  return Object.fromEntries(locales.map((locale) => [locale, String(path) === '/' ? prefix(locale) || '/' : `${prefix(locale)}${words(locale)}`])) as Record<SiteLocale, Localized<P>>
+}

package/templates/blog/app/utils/telHref.ts

@@ -0,0 +1,3 @@
+// Synced from templates/_features/site/app/utils/telHref.ts by `pnpm templates sync`. Edit the source, not this copy.
+/** The `tel:` link for a phone number written for people ("+49 30 1234"): only digits and "+" are kept. */
+export const telHref = (phone: string) => `tel:${phone.replace(/[^\d+]/g, '')}`

package/templates/blog/components.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "https://shadcn-vue.com/schema.json",
+  "style": "new-york",
+  "typescript": true,
+  "tailwind": {
+    "config": "",
+    "css": "app/assets/css/main.css",
+    "baseColor": "zinc",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "aliases": {
+    "components": "@/components",
+    "composables": "@/composables",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib"
+  },
+  "registries": {}
+}

package/templates/blog/content/home.de.md

@@ -0,0 +1,4 @@
+---
+title: Notizen über die Natur in und um die Stadt
+lead: Wir gehen los, schauen hin und schreiben es auf. Ein neuer Beitrag, wenn wir etwas gesehen haben, das sich zu erzählen lohnt, über Vögel, Bäume, den Fluss und die Küste eine Stunde entfernt.
+---

package/templates/blog/content/home.md

@@ -0,0 +1,4 @@
+---
+title: Notes on the nature in and around the city
+lead: We walk, look and write it down. A new post when we have seen something worth telling, on birds, trees, the river and the coast an hour away.
+---

package/templates/blog/content/legal/1.privacy.de.md

@@ -0,0 +1,30 @@
+---
+# Platzhalter-Hinweis: Ersetze den Text unten durch deine eigene Datenschutzerklärung, bevor der Blog online geht.
+# Welche Regeln gelten, hängt von deinem Land und davon ab, was deine Website tut. Frag im Zweifel eine Anwältin, einen Anwalt oder eine Datenschutzberatung.
+title: Datenschutzerklärung
+description: Wie dieser Blog mit personenbezogenen Daten umgeht.
+slug: datenschutz
+---
+
+> **Platzhalter:** Text aus der Vorlage, keine Rechtsberatung. Ersetze ihn, bevor die Website online geht.
+
+## Was dieser Blog ohne Änderungen tut
+
+So wie er aus der Vorlage kommt, gilt für diesen Blog:
+
+- Er setzt nur dann ein Cookie, wenn du die Sprache wechselst (`ginko_locale`, es merkt sich deine Wahl ein Jahr lang), und speichert sonst nichts in deinem Browser außer deiner Wahl zwischen hellem und dunklem Design.
+- Er misst keine Besuche und lädt nichts von anderen Unternehmen: Schriften und Bilder kommen von dieser Website selbst.
+- Er hat keine Kommentare und keine Formulare; E-Mail-Links öffnen dein eigenes E-Mail-Programm.
+- Er bietet einen Feed (RSS) pro Sprache. Ein Feedreader, der ihn lädt, sendet dieselben Anfragedaten wie ein Browser.
+
+Der Server, auf dem der Blog läuft, speichert jede Anfrage (Adresse, Zeit, Seite, Browser) in seinen Protokollen.
+Nenne deinen Hoster und wie lange er diese Protokolle aufbewahrt. Wenn du einen Newsletter-Dienst verlinkst, nenne
+ihn hier und sag, was er speichert.
+
+## Verantwortlich
+
+Name und Kontakt der Person, die für diesen Blog verantwortlich ist.
+
+## Deine Rechte
+
+Erkläre, wie man erfährt, welche Daten du speicherst, und wie man sie berichtigen oder löschen lässt.

package/templates/blog/content/legal/1.privacy.md

@@ -0,0 +1,30 @@
+---
+# Placeholder note: replace the text below with your own privacy policy before the blog goes live.
+# Which rules apply depends on your country and on what your site does. If you are unsure, ask a lawyer or a data protection advisor.
+title: Privacy policy
+description: How this blog handles personal data.
+legalType: privacy
+updatedAt: 2026-10-16
+---
+
+> **Placeholder:** template text, not legal advice. Replace it before the site goes live.
+
+## What this blog does out of the box
+
+As it comes from the template, this blog:
+
+- sets one cookie only when you switch the language (`ginko_locale`, which keeps your choice for a year), and otherwise stores nothing in your browser except your choice of light or dark mode;
+- runs no analytics and loads nothing from other companies: fonts and images come from this website itself;
+- has no comments and no forms; email links open your own email program;
+- offers a feed (RSS) per language. A feed reader that loads it sends the same request data as a browser.
+
+The server that hosts the blog records each request (address, time, page, browser) in its logs. Name your host and
+how long it keeps these logs. If you link a newsletter service, name it here and say what it stores.
+
+## Who is responsible
+
+Name and contact of the person responsible for this blog.
+
+## Your rights
+
+Explain how people can ask what data you hold about them, and have it corrected or deleted.

package/templates/blog/content/legal/2.terms.de.md

@@ -0,0 +1,22 @@
+---
+# Fotos: MEDIA.md nennt die Fotos der Vorlage und ihre Quellen.
+# Ersetze den Text unten durch deine eigenen Bedingungen, oder lösche die Datei (content/legal/2.terms.de.md und 2.terms.md), wenn du keine brauchst.
+title: Nutzungsbedingungen
+description: Was du mit den Texten und Fotos dieses Blogs tun darfst.
+slug: nutzungsbedingungen
+---
+
+> **Platzhalter:** Text aus der Vorlage, keine Rechtsberatung. Ersetze ihn, bevor die Website online geht.
+
+## Unsere Texte
+
+Sag, ob man deine Beiträge zitieren oder weiterverwenden darf und wie man dich dabei nennt, zum Beispiel unter einer
+Creative-Commons-Lizenz.
+
+## Fotos
+
+Sag, wer die Fotos gemacht hat und unter welcher Lizenz sie gezeigt werden.
+
+## Links
+
+Sag, dass du für die Inhalte der Websites, auf die du verlinkst, nicht verantwortlich bist.

package/templates/blog/content/legal/2.terms.md

@@ -0,0 +1,23 @@
+---
+# Photos: MEDIA.md lists the template's photos and their sources.
+# Replace the text below with your own terms, or delete content/legal/2.terms.md and its translations if you need none.
+title: Terms of use
+description: What you may do with the texts and photos of this blog.
+legalType: terms
+updatedAt: 2026-10-16
+---
+
+> **Placeholder:** template text, not legal advice. Replace it before the site goes live.
+
+## Our texts
+
+Say whether people may quote or reuse your posts, and how they should name you, for example under a Creative Commons
+licence.
+
+## Photos
+
+Say who took the photos and under which licence they are shown.
+
+## Links
+
+Say that you are not responsible for the content of the websites you link to.

package/templates/blog/content/legal/3.imprint.de.md

@@ -0,0 +1,14 @@
+---
+# In manchen Ländern (zum Beispiel Deutschland und Österreich) braucht auch ein Blog ein Impressum, sobald er mehr als privat ist.
+# Die Angaben oben kommen aus content/site.md: Trag dort Name und Anschrift ein (legalName, street, postalCode, city, und phone, wenn du willst).
+# Ersetze den Text unten durch das, was dein Land sonst verlangt, oder lösche die Datei (content/legal/3.imprint.de.md und 3.imprint.md), wenn dein Land kein Impressum verlangt.
+title: Impressum
+description: Wer diesen Blog betreibt.
+slug: impressum
+---
+
+> **Platzhalter:** Text aus der Vorlage, keine Rechtsberatung. Ersetze ihn, bevor die Website online geht.
+
+## Verantwortlich für den Inhalt
+
+Die Person, die für die Texte verantwortlich ist, mit Anschrift, wenn dein Land das verlangt.

package/templates/blog/content/legal/3.imprint.md

@@ -0,0 +1,15 @@
+---
+# Some countries (for example Germany and Austria) require an imprint, also for a blog that is more than private.
+# The details above the text come from content/site.md: add your name and address there (legalName, street, postalCode, city, and phone if you want).
+# Replace the text below with what else your country requires, or delete content/legal/3.imprint.md and its translations if your country does not require an imprint.
+title: Imprint
+description: Who runs this blog.
+legalType: imprint
+updatedAt: 2026-10-16
+---
+
+> **Placeholder:** template text, not legal advice. Replace it before the site goes live.
+
+## Responsible for the content
+
+The person responsible for the texts, with their address, if your country asks for it.

package/templates/blog/content/notices/1.sample.de.md

@@ -0,0 +1,3 @@
+---
+text: "Wir sind ein paar Wochen auf dem Küstenweg unterwegs, darum dauert der nächste Beitrag etwas länger."
+---

package/templates/blog/content/notices/1.sample.md

@@ -0,0 +1,4 @@
+---
+text: "We are out on the coast path for a few weeks, so the next post will take a little longer."
+until: 2027-01-29
+---

package/templates/blog/content/people/1.ida-wren.de.md

@@ -0,0 +1,4 @@
+---
+role: "Schreibt über Vögel und die Küste"
+bio: "Ida zählt Vögel vor dem Frühstück und hat in jeder Jacke ein Notizbuch. Seit zwölf Jahren geht sie denselben Weg am Fluss entlang und findet dort immer noch Neues."
+---

package/templates/blog/content/people/1.ida-wren.md

@@ -0,0 +1,5 @@
+---
+name: Ida Wren
+role: "Writes about birds and the coast"
+bio: "Ida counts birds before breakfast and keeps a notebook in every coat. She has walked the same river path for twelve years and still finds something new on it."
+---

package/templates/blog/content/people/2.tom-marsh.de.md

@@ -0,0 +1,4 @@
+---
+role: "Schreibt über Bäume und Spaziergänge"
+bio: "Tom kartiert die Bäume seiner Straße, Block für Block. Er mag Wege, die an einer Straßenbahnhaltestelle beginnen und dich zurückbringen, bevor es dunkel wird."
+---

package/templates/blog/content/people/2.tom-marsh.md

@@ -0,0 +1,5 @@
+---
+name: Tom Marsh
+role: "Writes about trees and walks"
+bio: "Tom maps the trees of his street, one block at a time. He likes routes you can walk from a tram stop and back before the light goes."
+---

package/templates/blog/content/posts/counting-street-trees.de.md

@@ -0,0 +1,24 @@
+---
+title: "Straßenbäume zählen, Block für Block"
+slug: strassenbaeume-zaehlen
+description: "Im März haben die Straßenbäume keine Blätter, und genau dann lernst du sie am besten kennen. Rinde, Knospen und Wuchs reichen."
+tags: ["Bäume"]
+---
+
+Diesen Winter habe ich angefangen, jeden Baum meiner Straße aufzuschreiben, jeden Sonntag einen Block. Die Straße hat vier Blöcke, im Februar war die Liste fertig. Es stehen 61 Bäume darauf, in fünf Arten.
+
+## Bäume ohne Blätter erkennen
+
+Die meisten Bestimmungsbücher fangen mit den Blättern an. Im März gibt es keine, also habe ich die Bäume an Rinde, Knospen und Wuchs gelernt. Das ist leichter, als es klingt:
+
+- **Platane:** Rinde, die in Flecken abblättert und eine Karte aus Grau, Grün und Creme hinterlässt. Runde Fruchtkugeln hängen noch an den Zweigen.
+- **Linde:** Zweige, die im Zickzack von Knospe zu Knospe laufen, mit kleinen, glänzend roten Knospen.
+- **Spitzahorn:** Knospen paarweise, gegenüber am Zweig.
+- **Rosskastanie:** große, klebrige braune Knospen. Die verwechselst du mit nichts.
+- **Eberesche:** ein kleiner Baum mit dunklen, filzigen Knospen; die Beeren haben im Herbst die Vögel geholt.
+
+## Wofür die Liste gut ist
+
+Jetzt sehe ich die Straße anders. Die Platanen sind die ältesten Bäume und stehen dort, wo die alten Häuser stehen; die jungen Ebereschen wurden gepflanzt, wo die Straße neu gebaut wurde. Zwei Lücken in der Reihe sind Stümpfe, letztes Jahr gefällt. Ich habe der Stadt geschrieben und gefragt, was dort gepflanzt wird.
+
+Nächsten Monat kommen die Blätter, und ich kann jede Zeile der Liste prüfen.

package/templates/blog/content/posts/counting-street-trees.md

@@ -0,0 +1,25 @@
+---
+title: "Counting street trees, one block at a time"
+description: "In March the street trees have no leaves, and that is the best time to learn them. Bark, buds and shape are enough."
+date: 2026-03-15
+authors: [people/tom-marsh]
+tags: ["Trees"]
+---
+
+This winter I started a list of every tree on my street, one block each Sunday. The street has four blocks, so the list was done by February. It has 61 trees on it, in five kinds.
+
+## Learning trees without leaves
+
+Most guides start with leaves. In March there are none, so I learned the trees by their bark, their buds and their shape instead. It is easier than it sounds:
+
+- **Plane:** bark that flakes off in patches, leaving a map of grey, green and cream. Round seed balls still hang from the branches.
+- **Lime:** twigs that zigzag from bud to bud, with small, shiny red buds.
+- **Norway maple:** buds in pairs, opposite each other on the twig.
+- **Horse chestnut:** big, sticky brown buds. You will not mix it up with anything else.
+- **Rowan:** a small tree with dark, woolly buds; the birds took its berries in autumn.
+
+## What the list is good for
+
+Now I see the street differently. The planes are the oldest trees and stand where the old houses are; the young rowans were planted where the road was rebuilt. Two gaps in the row are stumps, cut last year. I have written to the city to ask what will be planted there.
+
+Next month the leaves come out, and I get to check every line of the list.

package/templates/blog/content/posts/forest-at-the-end-of-the-line.de.md

@@ -0,0 +1,26 @@
+---
+title: "Der Wald an der Endstation"
+slug: wald-an-der-endstation
+description: "Vierzig Minuten vom Zentrum öffnet sich hinter der letzten Haltestelle ein alter Buchenwald. Ein Weg für einen grauen Morgen."
+tags: ["Spaziergänge", "Bäume"]
+image:
+  alt: "Ein Weg durch einen nebligen Wald mit hohen Bäumen, daneben eine Holzbank und ein Tisch"
+---
+
+Die meisten fahren aus Versehen bis zur Endstation. Ich fahre mit Absicht hin, an den grauesten Morgen, denn der Wald hinter der Wendeschleife ist im Nebel am schönsten.
+
+## Der Weg
+
+Von der Haltestelle überquerst du die Straße und nimmst den breiten Weg an den Kleingärten vorbei. Nach zehn Minuten enden die Gärten, und die Buchen beginnen. An der ersten Gabelung hältst du dich links; der Weg steigt sanft an, etwa zwei Kilometer bis zu einer Lichtung mit Bank und Tisch. Von dort sind es zurück zur Straßenbahn noch drei Kilometer, meist bergab.
+
+Die ganze Runde verläuft auf festen Wegen. Gute Schuhe reichen, und in weniger als zwei Stunden bist du wieder an der Haltestelle.
+
+## Worauf du achten kannst
+
+Buchen behalten ihr trockenes Laub an den unteren Ästen bis weit in den Winter, deshalb leuchten die Bäume unten kupferfarben, während die Kronen schon kahl sind. Schau dir auch die Stämme an: In der glatten grauen Rinde stehen alte eingeritzte Initialen, breit gezogen, weil der Baum um sie herumgewachsen ist.
+
+Im Nebel wird der Wald so still, wie es die Stadt nie ist. Du hörst das Tropfen von den Blättern, irgendwo oben einen Kleiber und ganz weit weg die Klingel der Straßenbahn.
+
+## Bevor du losgehst
+
+Am Wochenende fährt die Straßenbahn alle zwanzig Minuten, frühmorgens seltener. Auf der Lichtung gibt es keinen Unterstand, nimm also eine Jacke mehr für die Bank mit.