markus/AMPERION_Webpage
1
0
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

SEOOptimierungenAlex07092025

Browse source
This commit is contained in:
astosic 2025-09-08 01:15:11 +02:00
parent 6828c3f835
commit b7f8f2ac5e
34 changed files with 4426 additions and 253 deletions
Download patch file Download diff file Expand all files Collapse all files

169
layouts/partials/related.html Normal file
View file

@ -0,0 +1,169 @@
{{/* related.html (Enhanced UI + robust image fallback) */}}
{{ if not .IsHome }}
{{ $page := . }}
{{ $max := .Params.related_max | default 4 }}
{{ $tags := .Params.tags | default (slice) }}
{{ $exclude := .Params.related_exclude | default (slice) }}
{{ $manual := .Params.related_manual | default (slice) }}
{{ $pages := slice }}
{{/* Manuelle Auswahl? */}}
{{ if gt (len $manual) 0 }}
{{ range $manual }}
{{ $p := site.GetPage . }}
{{ if not $p }}{{ $p = site.GetPage (printf "/%s" (strings.TrimPrefix "/" .)) }}{{ end }}
{{ if $p }}{{ $pages = $pages | append $p }}{{ end }}
{{ end }}
{{ $pages = first $max $pages }}
{{ else }}
{{/* Automatisch */}}
{{ $recs := slice }}
{{ range site.RegularPages }}
{{ if or
(eq .RelPermalink $page.RelPermalink)
(in (slice "impressum" "datenschutz" "agb" "privacy") .Section)
(in $exclude .RelPermalink)
(in $exclude .File.TranslationBaseName)
}}
{{/* skip */}}
{{ else }}
{{ $candTags := .Params.tags | default (slice) }}
{{ $tagScore := len (intersect $candTags $tags) }}
{{/* Sektion-Priorität */}}
{{ $secScore := 0 }}
{{ if eq $page.Section "leistungen" }}
{{ if or (eq .Section "fokusthemen") (in (slice "post" "posts" "blog" "blogs" "news") .Section) }}{{ $secScore = 1 }}{{ end }}
{{ else if or (eq $page.Section "fokusthemen") (eq $page.Section "themen") }}
{{ if or (eq .Section "leistungen") (in (slice "post" "posts" "blog" "blogs" "news") .Section) }}{{ $secScore = 1 }}{{ end }}
{{ else if in (slice "post" "posts" "blog" "blogs" "news") $page.Section }}
{{ if or (eq .Section "leistungen") (eq .Section "fokusthemen") (eq .Section "themen") }}{{ $secScore = 1 }}{{ end }}
{{ end }}
{{ $score := add (mul $tagScore 10) $secScore }}
{{ if gt $score 0 }}
{{ $recs = $recs | append (dict "p" . "s" $score "d" .Date) }}
{{ end }}
{{ end }}
{{ end }}
{{ $recs = sort $recs "s" "desc" "d" "desc" }}
{{ range first $max $recs }}
{{ $pages = $pages | append .p }}
{{ end }}
{{ end }}
{{ if gt (len $pages) 0 }}
<section class="related section" aria-label="Verwandte Inhalte">
<div class="container my-container">
<h3 class="related-title">Verwandte Inhalte</h3>
<div class="related-grid">
{{ range $pages }}
{{/* Sektion-Label */}}
{{ $sec := .Section | default "" }}
{{ $secLabel := "" }}
{{ if eq $sec "leistungen" }}{{ $secLabel = "Leistungen" }}
{{ else if or (eq $sec "fokusthemen") (eq $sec "themen") }}{{ $secLabel = "Fokusthemen" }}
{{ else if or (eq $sec "post") (eq $sec "posts") (eq $sec "blog") (eq $sec "blogs") (eq $sec "news") }}{{ $secLabel = "Wissen" }}
{{ else }}{{ $secLabel = (title $sec) }}{{ end }}
{{/* Robust: Thumb finden (card_image → image → images[0] → Auto-Discovery) */}}
{{ $thumb := .Params.card_image | default .Params.image }}
{{ if not $thumb }}
{{ $imgs := .Params.images }}
{{ if $imgs }}
{{ $first := index $imgs 0 }}
{{ if (reflect.IsMap $first) }}
{{ $thumb = $first.src }}
{{ else }}
{{ $thumb = $first }}
{{ end }}
{{ end }}
{{ end }}
{{ if not $thumb }}
{{ $slug := .Params.slug | default .File.TranslationBaseName }}
{{ $cands := slice
(printf "static/images/%s/%s1.webp" .Section $slug)
(printf "static/images/leistungen/%s1.webp" $slug)
(printf "static/images/fokusthemen/%s1.webp" $slug)
(printf "static/images/%s1.webp" $slug)
}}
{{ range $cands }}
{{ if and (not $thumb) (fileExists .) }}
{{ $thumb = replace . "static" "" }}
{{ end }}
{{ end }}
{{ end }}
<article class="related-item">
<a class="related-link" href="{{ .RelPermalink }}">
<div class="related-thumb-wrap">
{{ if $thumb }}
{{ partial "img.html" (dict
"src" $thumb
"alt" .Title
"class" "related-thumb"
"loading" "lazy"
"page" $
) }}
{{ else }}
<div class="related-thumb related-thumb--placeholder" aria-hidden="true">
<svg viewBox="0 0 24 24" width="48" height="48">
<path d="M21 19V5a2 2 0 0 0-2-2H5C3.9 3 3 3.9 3 5v14c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2ZM8.5 13.5l2.5 3 3.5-4.5 4.5 6H5l3.5-4.5Z" fill="currentColor" opacity=".28"/>
<circle cx="8" cy="8" r="2" fill="currentColor" opacity=".28"/>
</svg>
</div>
{{ end }}
{{ if $secLabel }}<span class="related-badge">{{ $secLabel }}</span>{{ end }}
<span class="related-overlay" aria-hidden="true"></span>
</div>
<h4 class="related-name">{{ .Title }}</h4>
</a>
</article>
{{ end }}
</div>
</div>
<style>
.related-title{ text-align:center; margin:0 0 1.25rem }
.related-grid{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)) }
.related-item{ background:#fff; border-radius:14px; box-shadow:0 2px 12px rgba(0,0,0,.06); overflow:hidden; transition:transform .25s ease, box-shadow .25s ease }
.related-link{ display:block; color:inherit; text-decoration:none; outline:none }
.related-link:focus-visible{ box-shadow:0 0 0 3px rgba(4,110,110,.35) }
.related-thumb-wrap{ position:relative; aspect-ratio:16/9; overflow:hidden; background:#f3f3f3 }
.related-thumb{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease }
.related-thumb--placeholder{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:#9ca3af }
.related-badge{ position:absolute; left:12px; top:12px; padding:6px 10px; font-size:.75rem; border-radius:999px; background:rgba(4,110,110,.92); color:#fff; box-shadow:0 2px 8px rgba(0,0,0,.15) }
.related-overlay{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.22)); opacity:0; transition:opacity .25s ease }
.related-item:hover .related-overlay{ opacity:1 }
.related-item:hover{ transform:translateY(-2px); box-shadow:0 10px 28px rgba(0,0,0,.10) }
.related-item:hover .related-thumb{ transform:scale(1.03) }
.related-name{ margin:12px 14px 16px; line-height:1.3 }
@media (max-width:640px){
.related-grid{ gap:12px; grid-template-columns:1fr }
.related-name{ margin:10px 12px 14px }
.related-badge{ left:10px; top:10px; padding:5px 9px }
}
@media (prefers-color-scheme:dark){
.related-item{ background:#023d3d; box-shadow:0 2px 10px rgba(0,0,0,.4) }
.related-thumb--placeholder{ background:#0b0f17; color:#6b7280 }
.related-badge{ background:rgba(245,166,35,.95); color:#111 }
.related-name{ color:#e5e7eb }
}
@media (prefers-reduced-motion:reduce){
.related-item, .related-thumb, .related-overlay{ transition:none !important }
}
</style>
</section>
{{ end }}
{{ end }}