From 2f478600466d9fb8a1caf02739c22713518fc0a0 Mon Sep 17 00:00:00 2001
From: Alexander Bocken <alexander@bocken.org>
Date: Tue, 10 Oct 2023 10:03:43 +0200
Subject: [PATCH] SEO/ better URL Previews

---
 src/routes/(rezepte)/rezepte/+page.svelte        | 11 ++++++++++-
 src/routes/(rezepte)/rezepte/[name]/+page.svelte |  9 +++++++++
 src/routes/(rezepte)/rezepte/add/+page.svelte    |  5 +++++
 3 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/routes/(rezepte)/rezepte/+page.svelte b/src/routes/(rezepte)/rezepte/+page.svelte
index 9d0ec1c..6acc7aa 100644
--- a/src/routes/(rezepte)/rezepte/+page.svelte
+++ b/src/routes/(rezepte)/rezepte/+page.svelte
@@ -6,7 +6,7 @@
     	import Search from '$lib/components/Search.svelte';
     	export let data: PageData;
     	export let current_month = new Date().getMonth() + 1
-	const categories = ["Hauptspeise", "Nudel", "Brot", "Dessert", "Suppe", "Beilage", "Salat", "Kuchen", "Sauce", "Zutat", "Getränk", "Aufstrich", "Guetzli"]
+	const categories = ["Hauptspeise", "Nudel", "Brot", "Dessert", "Suppe", "Beilage", "Salat", "Kuchen", "Sauce", "Zutat", "Getränk", "Aufstrich", "Guetzli", "Unterwegs"]
 </script>
 <style>
 h1{
@@ -17,6 +17,15 @@ h1{
 	font-size: 4rem;
 }
 </style>
+<svelte:head>
+	<title>Bocken Rezepte</title>
+	<meta name="description" content="Eine stetig wachsende Ansammlung an Rezepten aus der Bockenschen Küche." />
+	<meta property="og:image" content="https://bocken.org/static/rezepte/thumb/al_ragu.webp" />
+	<meta property="og:image:secure_url" content="https://bocken.org/static/rezepte/thumb/al_ragu.webp" />
+	<meta property="og:image:type" content="image/webp" />
+	<meta property="og:image:alt" content="Pasta al Ragu mit Linguine" />
+</svelte:head>
+
 <h1>Rezepte</h1>
 <section>
 <MediaScroller title="In Saison">
diff --git a/src/routes/(rezepte)/rezepte/[name]/+page.svelte b/src/routes/(rezepte)/rezepte/[name]/+page.svelte
index f5e5ded..1cd5431 100644
--- a/src/routes/(rezepte)/rezepte/[name]/+page.svelte
+++ b/src/routes/(rezepte)/rezepte/[name]/+page.svelte
@@ -205,6 +205,15 @@ h4{
 	margin-top: -0.5em;
 }
 </style>
+<svelte:head>
+	<title>Bocken - {@html data.name}</title>
+	<meta name="description" content="{data.description}" />
+	<meta property="og:image" content="https://bocken.org/static/rezepte/thumb/{data.short_name}.webp" />
+	<meta property="og:image:secure_url" content="https://bocken.org/static/rezepte/thumb/{data.short_name}.webp" />
+	<meta property="og:image:type" content="image/webp" />
+	<meta property="og:image:alt" content="{@html data.name}" />
+</svelte:head>
+
 <TitleImgParallax src={hero_img_src} {placeholder_src}>
 	<div class=title>
 		<a class="icon" href='/rezepte/icon/{data.icon}'>{data.icon}</a>
diff --git a/src/routes/(rezepte)/rezepte/add/+page.svelte b/src/routes/(rezepte)/rezepte/add/+page.svelte
index 11768db..223cc71 100644
--- a/src/routes/(rezepte)/rezepte/add/+page.svelte
+++ b/src/routes/(rezepte)/rezepte/add/+page.svelte
@@ -251,6 +251,11 @@ button.action_button{
 	margin: 0;
 }
 </style>
+<svelte:head>
+	<title>Rezept erstellen</title>
+	<meta name="description" content="Hier können neue Rezepte hinzugefügt werden" />
+</svelte:head>
+
 <h1>Rezept erstellen</h1>
 
 <CardAdd {card_data}></CardAdd>