mihkelmk/portfolio_site
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix metadata and og image handling

Browse source
This commit is contained in:
Mihkel Martin Kasterpalu 2025-01-22 18:08:27 +02:00
parent 4d24b90afa
commit a93db5fdf7
5 changed files with 26 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/lib/config.ts
View file

@ -1,6 +1,11 @@
import type { GamesObj } from './types'; import type { GamesObj } from './types';
export const siteName = 'Stuff.Kasterpalu'; export const site = {
name: 'Stuff.Kasterpalu',
author: 'Mihkel Martin Kasterpalu',
description: 'Minimängud ja muud huvitavat.',
image: '/web-app-manifest-512x512.png'
};
export const baseURL = 'https://stuff.kasterpalu.ee'; export const baseURL = 'https://stuff.kasterpalu.ee';

6
src/routes/(games)/+layout.server.ts
View file

@ -1,5 +1,5 @@
import type { LayoutServerData } from './$types'; import type { LayoutServerData } from './$types';
import { games } from '$lib/config'; import { games, site } from '$lib/config';
export const load: LayoutServerData = async ({ url }) => { export const load: LayoutServerData = async ({ url }) => {
if (!url?.pathname) { if (!url?.pathname) {
@ -14,7 +14,7 @@ export const load: LayoutServerData = async ({ url }) => {
return { return {
name: game.name, name: game.name,
description: game.description, description: game.description || site.description,
image: game.image image: game.image || site.image
}; };
}; };

16
src/routes/(games)/+layout.svelte
View file

@ -1,22 +1,22 @@
<script lang="ts"> <script lang="ts">
import { siteName } from '$lib/config.js'; import { baseURL, site } from '$lib/config.js';
let { children, data } = $props(); let { children, data } = $props();
const title = data?.name ? `${data.name} | ${site.name}` : site.name;
</script> </script>
<svelte:head> <svelte:head>
{#if data.name} <title>{title}</title>
<title>{data.name} | {siteName}</title> <meta property="og:title" content={title} />
<meta property="og:title" content={data.name + ' | ' + siteName} />
{/if}
{#if data.desctiption} {#if data?.description}
<meta name="description" content={data.description} /> <meta name="description" content={data.description} />
<meta property="og:description" content={data.description} /> <meta property="og:description" content={data.description} />
{/if} {/if}
{#if data.image} {#if data?.image}
<meta property="og:image" content={data.image} /> <meta property="og:image" content={baseURL + data.image} />
{/if} {/if}
</svelte:head> </svelte:head>

3
src/routes/+layout.svelte
View file

@ -9,6 +9,7 @@
import Sun from 'lucide-svelte/icons/sun'; import Sun from 'lucide-svelte/icons/sun';
import Moon from 'lucide-svelte/icons/moon'; import Moon from 'lucide-svelte/icons/moon';
import LaptopMinimal from 'lucide-svelte/icons/laptop-minimal'; import LaptopMinimal from 'lucide-svelte/icons/laptop-minimal';
import { site } from '$lib/config';
let { children } = $props(); let { children } = $props();
@ -29,7 +30,7 @@
</script> </script>
<svelte:head> <svelte:head>
<meta name="author" content="Mihkel Martin Kasterpalu" /> <meta name="author" content={site.author} />
</svelte:head> </svelte:head>
<ModeWatcher /> <ModeWatcher />

14
src/routes/+page.svelte
View file

@ -1,18 +1,18 @@
<script lang="ts"> <script lang="ts">
import { games, siteName, baseURL } from '$lib/config'; import { games, site, baseURL } from '$lib/config';
</script> </script>
<svelte:head> <svelte:head>
<title>{siteName}</title> <title>{site.name}</title>
<meta property="og:title" content={siteName} /> <meta property="og:title" content={site.name} />
<meta name="description" content="Minimängud ja muud huvitavat." /> <meta name="description" content={site.description} />
<meta property="og:description" content="Minimängud ja muud huvitavat." /> <meta property="og:description" content={site.description} />
<meta property="og:image" content={baseURL + '/favicon.svg'} /> <meta property="og:image" content={baseURL + site.image} />
</svelte:head> </svelte:head>
<header class="font-title mb-24 flex flex-col items-center"> <header class="mb-24 flex flex-col items-center font-title">
<h1 class="mb-1 scroll-m-20 text-5xl font-extrabold tracking-tight lg:text-6xl"> <h1 class="mb-1 scroll-m-20 text-5xl font-extrabold tracking-tight lg:text-6xl">
stuff.kasterpalu.ee stuff.kasterpalu.ee
</h1> </h1>