My Blog Post
This is an example blog post showcasing the usage of the svead package.
Here’s the code for this page:
<script lang="ts">
import { page } from '$app/stores';
import {
Head,
SchemaOrg,
type SchemaOrgProps,
type SeoConfig,
} from 'svead';
export let data;
let { Copy } = data;
const get_current_iso_date = () => new Date().toISOString();
const seo_config: SeoConfig = {
url: $page.url.href,
website: 'https://example.com',
title: 'My Blog Post',
description:
'This is an example blog post showcasing the usage of the svead package.',
open_graph_image:
'https://example.com/images/blog-post-image.jpg',
author_name: 'John Doe',
language: 'en',
twitter_handle: '@johndoe',
site_name: 'Example Blog',
};
const schema_org: SchemaOrgProps['schema'] = {
'@type': 'WebPage',
'@id': $page.url.href,
url: $page.url.href,
name: seo_config.title,
description: seo_config.description,
inLanguage: seo_config.language,
...(seo_config.website && {
isPartOf: {
'@type': 'WebSite',
'@id': seo_config.website,
},
}),
...(seo_config.open_graph_image && {
primaryImageOfPage: {
'@type': 'ImageObject',
url: seo_config.open_graph_image,
},
}),
datePublished: get_current_iso_date(),
dateModified: get_current_iso_date(),
author: {
'@type': 'Person',
name: seo_config.author_name,
...(seo_config.website && {
url: `${seo_config.website}/author/${seo_config.author_name?.toLowerCase().replace(' ', '-')}`,
}),
},
potentialAction: [
{
'@type': 'ReadAction',
target: $page.url.href,
},
],
mainEntity: {
'@type': 'BlogPosting',
'@id': `${$page.url.href}#article`,
headline: seo_config.title,
description: seo_config.description,
...(seo_config.open_graph_image && {
image: seo_config.open_graph_image,
}),
datePublished: get_current_iso_date(),
dateModified: get_current_iso_date(),
author: {
'@type': 'Person',
name: seo_config.author_name,
...(seo_config.website && {
url: `${seo_config.website}/author/${seo_config.author_name?.toLowerCase().replace(' ', '-')}`,
}),
},
publisher: {
'@type': 'Organization',
name: seo_config.site_name,
...(seo_config.website && { url: seo_config.website }),
...(seo_config.website && {
logo: {
'@type': 'ImageObject',
url: `${seo_config.website}/logo.png`,
},
}),
},
mainEntityOfPage: {
'@type': 'WebPage',
'@id': $page.url.href,
},
inLanguage: seo_config.language,
},
};
</script>
<Head {seo_config} />
<SchemaOrg schema={schema_org} />
<article>
<h1>{seo_config.title}</h1>
<p>{seo_config.description}</p>
<!-- Rest of your blog post content -->
<Copy />
</article>