Add description and keywords to meta tags
All checks were successful
Build and deploy website / build (push) Successful in 37s

This commit is contained in:
Martin Berg Alstad 2025-03-01 09:52:10 +01:00
parent a2584b97a1
commit ebb3db8645
Signed by: martials
GPG Key ID: 706F53DD087A91DE
4 changed files with 23 additions and 9 deletions

11
TODO.md
View File

@ -14,13 +14,13 @@
## Layout
- [ ] Dark mode toggle
- [ ] Navigate using pathname / breadcrumbs
- [ ] Better style for <code /> blocks
- [ ] Better style for \<code /> blocks
## Accessibility
- [ ] All interactable elements have labels
## I18N
- [ ] Markdown for text
- [ ] Markdown for translations
## ~/
- [ ] About me description
@ -33,16 +33,19 @@
## ~/projects
- [ ] Translate projects
- [ ] NixOS on desktop
- [ ] RSS Feed
## ~/projects/[project]
- [ ] Only use Gitea icon for Gitea links
- [ ] Bachelor project
- [ ] Sparebank1 ActualBudget service
- [x] Sparebank1 ActualBudget service
- [ ] More about this website
- [ ] NixOS on desktop
- [ ] Copy link to h tag and scroll to h tag on load
- [x] External links should open in new tab
- [x] Add keywords to meta tag
- [x] Add description to meta tag
- [ ] Source on image if "borrowed" from somewhere
## ~/slashes
- [ ] List of all slashes

View File

@ -22,6 +22,7 @@ const {
title,
description,
tags,
keywords,
heroImage,
heroImageAlt,
source,
@ -37,7 +38,12 @@ function localeDateString(isoString: string): string {
}
---
<Layout title={title} class="mx-auto max-w-[750px]">
<Layout
title={title}
class="mx-auto max-w-[750px]"
description={description}
keywords={keywords}
>
<div class="flex justify-between my-2">
<div>
<h2>{title}</h2>

View File

@ -5,7 +5,7 @@ description: "Welcome to my homepage / portfolio"
heroImage: "assets/recursive-meme.png"
heroImageAlt: "A recursive meme that says: Self-reference, recursive meme is self-referential"
tags: [Astro, Svelte, TypeScript, I18n, TailwindCSS, Docker]
keywords: []
keywords: [Martin Berg Alstad, portfolio, homepage, website, martials, emberal]
source: "https://git.martials.no/martials/martials.no"
createdAt: "2024-09-22"
updatedAt: "2025-02-15"

View File

@ -6,9 +6,11 @@ import { resolvePathname } from "@/utils/linking"
interface Props {
title: string
description?: string
keywords?: ReadonlyArray<string>
class?: string
}
const { title, class: clazz } = Astro.props
const { title, description, keywords, class: clazz } = Astro.props
const mainClass =
"grow max-w-[1000px] m-auto sm:min-w-[500px] not-sm:w-full px-5"
---
@ -17,13 +19,16 @@ const mainClass =
<html lang={languageTag()} dir={"ltr"}>
<head>
<meta charset="UTF-8" />
<meta name="description" content="Astro description" />
<meta name="author" content="Martin Berg Alstad" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
{description && <meta name="description" content={description} />}
{keywords && <meta name="keywords" content={keywords.join(", ")} />}
<link rel="sitemap" href="/sitemap-index.xml" />
<link rel="icon" type="image/jpg" href="/favicon.jpg" />
<meta name="generator" content={Astro.generator} />
<title>{title} | Martin Berg Alstad</title>
</head>
<body class="flex flex-col min-h-screen bg-cat-base text-cat-text">
<Header />
<main class:list={[mainClass, clazz]}>