From 63fa3c2846732512c1e4aa85871d7ca36fbc020c Mon Sep 17 00:00:00 2001
From: robin <binkrassdufass@gmail.com>
Date: Sun, 19 Nov 2023 18:16:14 +0000
Subject: [PATCH] seo...

---
 api/collections/medialib.yml                  | 22 ++++++++++++++++++-
 .../lib/components/Pagebuilder/Rows.svelte    |  2 +-
 .../components/widgets/Worldcard/card.svelte  |  6 ++++-
 .../src/lib/components/widgets/events.svelte  |  1 +
 .../lib/components/widgets/iconBlock.svelte   |  7 ++++--
 .../src/lib/components/widgets/image.svelte   |  9 ++++++--
 .../lib/components/widgets/infoBoard.svelte   |  3 ++-
 .../src/lib/components/widgets/persons.svelte |  6 +++--
 types/global.d.ts                             |  2 ++
 9 files changed, 48 insertions(+), 10 deletions(-)

diff --git a/api/collections/medialib.yml b/api/collections/medialib.yml
index 9910bdd..5f4e3ee 100644
--- a/api/collections/medialib.yml
+++ b/api/collections/medialib.yml
@@ -21,7 +21,7 @@ meta:
         enabled: true
         fields:
             - title
-            - description
+            - alt
             - file
 
     # "defaultImageFilter" dient auch hier nur zur Reduzierung der
@@ -120,6 +120,26 @@ fields:
               de: Datei
               en: File
 
+    - name: alt
+      type: string
+      meta:
+          label:
+              de: Alternativtext
+              en: Alternative text
+          helperText:
+              de: Der Alternativtext wird angezeigt, wenn die Datei nicht geladen werden kann.
+              en: The alternative text is displayed if the file cannot be loaded.
+
+    - name: title
+      type: string
+      meta:
+          label:
+              de: Titel
+              en: Title
+          helperText:
+              de: Der Titel wird angezeigt, wenn die Datei geladen wird.
+              en: The title is displayed when the file is loaded.
+
     - name: sort
       type: number
       meta:
diff --git a/frontend/src/lib/components/Pagebuilder/Rows.svelte b/frontend/src/lib/components/Pagebuilder/Rows.svelte
index bbd30c2..c4c164d 100644
--- a/frontend/src/lib/components/Pagebuilder/Rows.svelte
+++ b/frontend/src/lib/components/Pagebuilder/Rows.svelte
@@ -71,7 +71,7 @@
         {#if page?.active === false}
             <meta name="robots" content="noindex" />
         {/if}
-        <link rel="canonical" href="{baseURL + page.path}" />
+        <link rel="canonical" href="{baseURL + page?.path}" />
     {/key}
 </svelte:head>
 <div class="rows" class:HP="{path == '/'}">
diff --git a/frontend/src/lib/components/widgets/Worldcard/card.svelte b/frontend/src/lib/components/widgets/Worldcard/card.svelte
index 61cdd57..39f0923 100644
--- a/frontend/src/lib/components/widgets/Worldcard/card.svelte
+++ b/frontend/src/lib/components/widgets/Worldcard/card.svelte
@@ -24,7 +24,11 @@
 </script>
 
 <div class="card">
-    <img src="{apiBaseURL}medialib/{card.image}/{$mediaLibrary?.[card?.image]?.file?.src}" alt="card" />
+    <img
+        src="{apiBaseURL}medialib/{card.image}/{$mediaLibrary?.[card?.image]?.file?.src}"
+        alt="{$mediaLibrary[card?.image]?.alt || ''}"
+        title="{$mediaLibrary[card?.image]?.title || ''}"
+    />
 
     <div class="content">
         <div
diff --git a/frontend/src/lib/components/widgets/events.svelte b/frontend/src/lib/components/widgets/events.svelte
index 02e88f3..6b9cafb 100644
--- a/frontend/src/lib/components/widgets/events.svelte
+++ b/frontend/src/lib/components/widgets/events.svelte
@@ -49,6 +49,7 @@
                     href="{apiBaseURL}medialib/{nE.file}/{$mediaLibrary?.[nE?.file]?.file?.src}"
                     style="text-decoration: none;"
                     download="{apiBaseURL}medialib/{nE.file}/{$mediaLibrary?.[nE?.file]?.file?.src}"
+                    
                 >
                     <button class="more">mehr</button></a
                 >
diff --git a/frontend/src/lib/components/widgets/iconBlock.svelte b/frontend/src/lib/components/widgets/iconBlock.svelte
index 11b41c0..3283c6d 100644
--- a/frontend/src/lib/components/widgets/iconBlock.svelte
+++ b/frontend/src/lib/components/widgets/iconBlock.svelte
@@ -10,7 +10,11 @@
 <div class="iconBlock">
     {#each col.iconBlocks as icon}
         <div class="icon">
-            <img src="{`${apiBaseURL}medialib/${icon.icon}/${$mediaLibrary?.[icon?.icon]?.file?.src}`}" alt="img" />
+            <img
+                alt="{$mediaLibrary[icon.icon]?.alt || ''}"
+                title="{$mediaLibrary[icon.icon]?.title || ''}"
+                src="{`${apiBaseURL}medialib/${icon.icon}/${$mediaLibrary?.[icon?.icon]?.file?.src}`}"
+            />
             <div class="text">
                 <em>{icon.bigText}</em>
                 <p>{icon.smallText}</p>
@@ -46,7 +50,6 @@
             img {
                 width: 75%;
                 height: auto;
-                
             }
             .text {
                 display: flex;
diff --git a/frontend/src/lib/components/widgets/image.svelte b/frontend/src/lib/components/widgets/image.svelte
index 2e9a7ff..2af8d6d 100644
--- a/frontend/src/lib/components/widgets/image.svelte
+++ b/frontend/src/lib/components/widgets/image.svelte
@@ -7,7 +7,11 @@
 </script>
 
 <div class="image-container">
-    <img src="{`${apiBaseURL}medialib/${image}/${$mediaLibrary[image]?.file?.src}`}" alt="img" />
+    <img
+        src="{`${apiBaseURL}medialib/${image}/${$mediaLibrary[image]?.file?.src}`}"
+        alt="{$mediaLibrary[image]?.alt || ''}"
+        title="{$mediaLibrary[image]?.title || ''}"
+    />
 </div>
 {#if col && col.icons}
     <div class="icons">
@@ -16,7 +20,8 @@
                 <a href="{icon.link}" style="text-decoration: none;" target="_blank">
                     <img
                         src="{`${apiBaseURL}medialib/${icon.icon}/${$mediaLibrary[icon.icon]?.file?.src}`}"
-                        alt="img"
+                        alt="{$mediaLibrary[icon.icon]?.alt || ''}"
+                        title="{$mediaLibrary[icon.icon]?.title || ''}"
                     />
                 </a>
             </div>
diff --git a/frontend/src/lib/components/widgets/infoBoard.svelte b/frontend/src/lib/components/widgets/infoBoard.svelte
index 64180fe..8af0302 100644
--- a/frontend/src/lib/components/widgets/infoBoard.svelte
+++ b/frontend/src/lib/components/widgets/infoBoard.svelte
@@ -11,7 +11,8 @@
         <div class="icon">
             <img
                 src="{`${apiBaseURL}medialib/${col.infoBoard.icon}/${$mediaLibrary[col.infoBoard.icon]?.file?.src}`}"
-                alt="img"
+                alt="{$mediaLibrary[col.infoBoard.icon]?.alt || ''}"
+                title="{$mediaLibrary[col.infoBoard.icon]?.title || ''}"
             />
         </div>
         <div class="title">
diff --git a/frontend/src/lib/components/widgets/persons.svelte b/frontend/src/lib/components/widgets/persons.svelte
index 5c9cd35..d405ce9 100644
--- a/frontend/src/lib/components/widgets/persons.svelte
+++ b/frontend/src/lib/components/widgets/persons.svelte
@@ -25,8 +25,9 @@
                     src="{`${apiBaseURL}medialib/${p?.personPreview?.initialImage}/${
                         $mediaLibrary[p?.personPreview?.initialImage]?.file?.src
                     }`}"
-                    alt="img"
                     style="opacity: {hover == i ? 0 : 1}"
+                    alt="{$mediaLibrary[p?.personPreview?.initialImage]?.alt || ''}"
+                    title="{$mediaLibrary[p?.personPreview?.initialImage]?.title || ''}"
                 />
                 <!-- Hover Image -->
                 <img
@@ -34,8 +35,9 @@
                     src="{`${apiBaseURL}medialib/${p?.personPreview?.hoverImage}/${
                         $mediaLibrary[p?.personPreview?.hoverImage]?.file?.src
                     }`}"
-                    alt="img"
                     style="opacity: {hover == i ? 1 : 0}"
+                    alt="{$mediaLibrary[p?.personPreview?.hoverImage]?.alt || ''}"
+                    title="{$mediaLibrary[p?.personPreview?.hoverImage]?.title || ''}"
                 />
             </div>
             <div class="text">
diff --git a/types/global.d.ts b/types/global.d.ts
index 503b223..e0b0cab 100644
--- a/types/global.d.ts
+++ b/types/global.d.ts
@@ -60,6 +60,8 @@ type Column =
 
 interface MediaLibrary {
     file: FileField
+    alt: string
+    title: string
     id: string
 }