blboun3/personal-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

SEO optimizations

Browse Source 
SEO optimizations using astro-seo and SEO component
Modified i18n to incorporate complex SEO
This commit is contained in:
Cyril Šebek 2024-07-09 15:59:09 +02:00
parent 9a84d9acbb
commit 85d38eb3d5
Signed by: blboun3
SSH Key Fingerprint: SHA256:n9dMtOPzgsD+CCerUJslEnU2dzVanbaIv0XDQVRVjeg
14 changed files with 628 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
package.json
View File

@ -25,9 +25,11 @@
"@radix-ui/react-slot": "^1.0.2",
"@radix-ui/react-tabs": "^1.0.4",
"@radix-ui/react-tooltip": "^1.1.2",
"@tailwindcss/typography": "^0.5.13",
"@types/react": "^18.2.74",
"@types/react-dom": "^18.2.24",
"astro": "^4.11.5",
"astro-seo": "^0.8.4",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.0",
"cmdk": "^1.0.0",
@ -41,7 +43,6 @@
"tailwindcss": "^3.4.1",
"tailwindcss-animate": "^1.0.7",
"vaul": "^0.9.0",
"zod": "^3.23.8",
"@tailwindcss/typography": "^0.5.13"
"zod": "^3.23.8"
}
}

536
pnpm-lock.yaml
View File

File diff suppressed because it is too large Load Diff

3
src/i18n/cs.js
View File

@ -1,6 +1,6 @@
export const cs = {
title: "Cyril Šebek", // Title of the main page in browser's handlebard
description: "Personal website of one weird student", // HTML page description
escription: "Hi there, I am Cyril, one weird student from Czechia, also a programmer and a musician.",
favicon: "/favicon.svg",
/*
@ -106,6 +106,7 @@ export const cs = {
pageTitle: "Moje skladby @ Cyril Šebek",
title: "Moje skladby",
description: "Seznam mých skladeb.",
ogDescription: "This page lists all published compositions by Cyril Šebek",
downloadPDF: "Stáhnout PDF",
downloadMP3: "Stáhnout MP3",
downloadFLAC: "Stáhnout FLAC"

3
src/i18n/de.js
View File

@ -1,6 +1,6 @@
export const de = {
title: "Cyril Šebek", // Title of the main page in browser's handlebard
description: "Personal website of one weird student", // HTML page description
description: "Hi there, I am Cyril, one weird student from Czechia, also a programmer and a musician.",
favicon: "/favicon.svg",
/*
@ -106,6 +106,7 @@ export const de = {
pageTitle: "Music @ Cyril Šebek",
title: "My compositions",
description: "This is page is listing all my published musical compositions.",
ogDescription: "This page lists all published compositions by Cyril Šebek",
downloadPDF: "Download PDF",
downloadMP3: "Download MP3",
downloadFLAC: "Download FLAC"

3
src/i18n/en.js
View File

@ -1,6 +1,6 @@
export const en = {
title: "Cyril Šebek", // Title of the main page in browser's handlebard
description: "Personal website of one weird student", // HTML page description
description: "Hi there, I am Cyril, one weird student from Czechia, also a programmer and a musician.",
favicon: "/favicon.svg",
/*
@ -106,6 +106,7 @@ export const en = {
pageTitle: "Music @ Cyril Šebek",
title: "My compositions",
description: "This is page is listing all my published musical compositions.",
ogDescription: "This page lists all published compositions by Cyril Šebek",
downloadPDF: "Download PDF",
downloadMP3: "Download MP3",
downloadFLAC: "Download FLAC"

3
src/i18n/fr.js
View File

@ -1,6 +1,6 @@
export const fr = {
title: "Cyril Šebek", // Title of the main page in browser's handlebard
description: "Personal website of one weird student", // HTML page description
description: "Hi there, I am Cyril, one weird student from Czechia, also a programmer and a musician.",
favicon: "/favicon.svg",
/*
@ -106,6 +106,7 @@ export const fr = {
pageTitle: "Music @ Cyril Šebek",
title: "My compositions",
description: "This is page is listing all my published musical compositions.",
ogDescription: "This page lists all published compositions by Cyril Šebek",
downloadPDF: "Download PDF",
downloadMP3: "Download MP3",
downloadFLAC: "Download FLAC"

6
src/layouts/BlogPost.astro
View File

@ -1,17 +1,15 @@
---
import type { CollectionEntry } from "astro:content";
import SinglePageBlogMode from "./SinglePageBlogMode.astro";
import MainLayout from "./MainLayout.astro";
type Props = CollectionEntry<"blog">["data"];
const { title, description, language } = Astro.props;
const { title, description, language, openGraph } = Astro.props;
---
<MainLayout
title=`${title} @ Cyril Šebek`
description={description}
lang={language}
openGraph={openGraph}
>
<SinglePageBlogMode>
<slot />

8
src/layouts/MainLayout.astro
View File

@ -1,9 +1,10 @@
---
const { title, description, lang, themeOverride } = Astro.props;
const { title, description, lang, themeOverride, openGraph } = Astro.props;
import { ViewTransitions } from 'astro:transitions';
import Navbar from "../components/Navbar.astro";
import "../style/index.css";
import { useTranslations } from '../i18n/utils';
import { SEO } from "astro-seo";
const t = useTranslations(lang)
---
@ -20,6 +21,11 @@ const t = useTranslations(lang)
<link rel="shortcut icon" href={t("favicon")}>
<link rel="shortcut icon" href={t("favicon")} type="image/x-icon">
<title>{title}</title>
<SEO
title={title}
description={description}
openGraph={openGraph}
/>
<ViewTransitions />
</head>
<body class="bg-bkg" >

15
src/pages/[lang]/blog/[...slug].astro
View File

@ -25,9 +25,22 @@ const page = Astro.props;
const formattedDate = page.data.publishDate?.toLocaleString(lang);
const { Content } = await page.render();
const og = {
basic: {
title: page.data.title,
type: "article",
image: page.data.image.url
},
article: {
publishedTime: page.data.publishDate,
authors: [page.data.author],
tags: page.data.tags
}
}
---
<BlogPost {...page.data} language={lang}>
<BlogPost {...page.data} language={lang} openGraph={og}>
<article
class="prose prose-moi m-[auto] sm:prose-sm md:prose-md lg:prose-lg text-justify"
>

16
src/pages/[lang]/blog/index.astro
View File

@ -19,12 +19,26 @@ var posts = await getBlogPosts();
var filtered_posts = posts.filter(
(post) => post.data.language == Astro.currentLocale,
);
const og = {
basic: {
title: t("blog")["title"],
type: "website",
image: t("favicon")
},
optional: {
description: t("blog")["ogDescription"],
locale: getLangFromUrl(Astro.url),
siteName: "Cyril Šebek"
}
};
---
<MainLayout
title={t("blog")["title"]}
description={t("blog")["description"]}
description={t("blog")["ogDescription"]}
lang={Astro.currentLocale}
openGraph={og}
>
<SinglePageBlogMode>
<div class="p-4">

15
src/pages/[lang]/blog/tags/[tag].astro
View File

@ -33,9 +33,22 @@ const { lang, tag } = Astro.params;
const { posts } = Astro.props;
const filteredPosts = posts.filter((post) => post.data.tags?.includes(tag) && post.data.language == Astro.currentLocale);
const og = {
basic: {
title: `${t("postsTagged")} "${tag}"}`,
image: t("favicon"),
type: "website"
},
optional: {
description: t("blog")["ogDescription"],
locale: getLangFromUrl(Astro.url),
siteName: "Cyril Šebek"
}
}
---
<MainLayout title=`${tag} @ Cyril Šebek` description={"desc"} lang={lang}>
<MainLayout title=`${tag} @ Cyril Šebek` description={"desc"} lang={lang} openGraph={og}>
<SinglePageBlogMode>
<h1 class="text-2xl text-center font-bold text-content mb-10 mt-5">{t("postsTagged")} "{tag}"</h1>
<PostsList filteredPosts={filteredPosts} lang={Astro.currentLocale} />

16
src/pages/[lang]/index.astro
View File

@ -17,8 +17,22 @@ export async function getStaticPaths() {
return { params: { lang } };
});
}
const og = {
basic: {
title: t("title"),
type: "website",
image: t("favicon")
},
optional: {
description: t("description"),
locale: getLangFromUrl(Astro.url),
siteName: "Cyril Šebek"
}
}
---
<MainLayout title={t("title")} description={t("description")} lang={Astro.currentLocale} themeOverride="theme_auto">
<MainLayout title={t("title")} description={t("description")} openGraph={og} lang={Astro.currentLocale} themeOverride="theme_auto">
<FloatingLinks />
<Hero />
<About />

16
src/pages/[lang]/music/index.astro
View File

@ -17,12 +17,26 @@ export async function getStaticPaths() {
var songs = await getCompositions()
songs = songs.reverse()
const og = {
basic: {
title: t("music")["title"],
type: "website",
image: t("favicon")
},
optional: {
description: t("music")["ogDescription"],
locale: getLangFromUrl(Astro.url),
siteName: "Cyril Šebek"
}
};
---
<MainLayout
title={t("music")["pageTitle"]}
description={t("music")["description"]}
description={t("music")["ogDescription"]}
lang={Astro.currentLocale}
openGraph={og}
>
<SinglePageBlogMode>
<div class="p-4">

18
src/pages/index.astro
View File

@ -8,7 +8,7 @@ import Showcase from "../components/Showcase.astro";
import FloatingLinks from "../components/FloatingLinks.astro";
//@ts-ignore
import { getLangFromUrl, useTranslations } from "../i18n/utils";
import { getLangFromUrl, useTranslations } from "../../i18n/utils";
const t = useTranslations(getLangFromUrl(Astro.url));
@ -17,8 +17,22 @@ export async function getStaticPaths() {
return { params: { lang } };
});
}
const og = {
basic: {
title: t("title"),
type: "website",
image: t("favicon")
},
optional: {
description: t("description"),
locale: getLangFromUrl(Astro.url),
siteName: "Cyril Šebek"
}
}
---
<MainLayout title={t("title")} description={t("description")} lang={Astro.currentLocale} themeOverride="theme_auto">
<MainLayout title={t("title")} description={t("description")} openGraph={og} lang={Astro.currentLocale} themeOverride="theme_auto">
<head>
<meta http-equiv="refresh" content="0; url=https://cyrilsebek.cz/en">
<script type="text/javascript">