feat: add meta description

This commit is contained in:
Jewgeni Lewash 2024-03-08 07:36:18 +01:00
parent 4995df6376
commit 5266fe563d
5 changed files with 22 additions and 7 deletions

View File

@ -2,11 +2,18 @@
import '@/styles/globals.css';
import Header from '@/components/layout/Header.astro';
import Footer from '@/components/layout/Footer.astro';
const { title } = Astro.props;
interface Props {
title: string;
description: string;
}
const { title, description } = Astro.props as Props;
---
<html lang="en">
<head>
<title>{title}</title>
<meta name="description" content={description} />
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="theme-color" content="#61a8e1" />
@ -14,7 +21,6 @@ const { title } = Astro.props;
<link rel="apple-touch-icon" href="/apple-touch-icon-180x180.png" />
<link rel="manifest" href="/site.webmanifest" />
<link rel="sitemap" href="/sitemap-index.xml" />
<title>{title}</title>
</head>
<body class="flex min-h-screen flex-col dark:bg-secondary">
<Header />

View File

@ -5,7 +5,9 @@ import Heading from '@/components/ui/Heading.astro';
const allBlogposts = await getCollection('blog');
---
<BaseLayout title="Blog">
<BaseLayout
title="Blog"
description="Explore insightful articles on our Blog: Dive into a world of knowledge through posts crafted with expertise. Discover, learn, and grow with us.">
<div class="container mx-auto px-4 py-16 sm:py-24 lg:px-8 lg:py-32 xl:max-w-7xl">
<div class="mb-12 text-center text-zinc-900 dark:text-zinc-200">
<Heading level={1}>Blog</Heading>

View File

@ -19,10 +19,13 @@ interface Props {
const { entry } = Astro.props as Props;
const { Content } = await entry.render();
const components = { table: Table };
const { title } = entry.data;
const { title, description } = entry.data;
const descriptionMeta =
description.length > 160 ? description.substring(0, 150) + '...' : description;
---
<BaseLayout title={title}>
<BaseLayout title={title} description={descriptionMeta}>
<div class="container prose mx-auto px-4 py-16 dark:prose-invert lg:px-8 lg:py-32 xl:max-w-7xl">
<h1 class="text-4xl font-bold">{title}</h1>
<Content components={components} />

View File

@ -8,7 +8,9 @@ import index1 from '@/assets/images/index-1.png';
import index2 from '@/assets/images/index-2.png';
---
<BaseLayout title="Astro Deploy">
<BaseLayout
title="Astro Deploy"
description="Launch your site with Astro Deploy: A cutting-edge solution featuring Astro.js, Docker, and Tailwind CSS for seamless, scalable web development.">
<div class="mx-auto px-4 pb-20 pt-28 sm:px-6 lg:px-8">
<Heading level={1} classes="text-center text-zinc-900 dark:text-zinc-200">
Deploy Your

View File

@ -17,7 +17,9 @@ const recipes = await directus.request(
);
---
<BaseLayout title="Recipes">
<BaseLayout
title="Recipes"
description="Feast on favorite recipes: A curated collection of delightful dishes, sourced directly from our CMS. Discover new flavors and inspire your culinary journey.">
<div class="container mx-auto px-4 py-16 sm:py-24 lg:px-8 lg:py-32 xl:max-w-7xl">
<div class="mb-12 text-center text-zinc-900 dark:text-zinc-200">
<Heading level={1}>Recipes</Heading>