[FEAT] SEO best practices
This commit is contained in:
@@ -17,17 +17,11 @@ const SITE_URL = 'https://spritesheetgenerator.online';
|
||||
const DEFAULT_IMAGE = '/og-image.png';
|
||||
|
||||
export function useSEO(metadata: SEOMetaData) {
|
||||
const fullTitle = metadata.title.includes(SITE_NAME)
|
||||
? metadata.title
|
||||
: `${metadata.title} - ${SITE_NAME}`;
|
||||
const fullTitle = metadata.title.includes(SITE_NAME) ? metadata.title : `${metadata.title} - ${SITE_NAME}`;
|
||||
|
||||
const fullUrl = metadata.url
|
||||
? `${SITE_URL}${metadata.url}`
|
||||
: SITE_URL;
|
||||
const fullUrl = metadata.url ? `${SITE_URL}${metadata.url}` : SITE_URL;
|
||||
|
||||
const imageUrl = metadata.image
|
||||
? `${SITE_URL}${metadata.image}`
|
||||
: `${SITE_URL}${DEFAULT_IMAGE}`;
|
||||
const imageUrl = metadata.image ? `${SITE_URL}${metadata.image}` : `${SITE_URL}${DEFAULT_IMAGE}`;
|
||||
|
||||
const metaTags: any[] = [
|
||||
// Primary Meta Tags
|
||||
@@ -72,8 +66,6 @@ export function useSEO(metadata: SEOMetaData) {
|
||||
useHead({
|
||||
title: fullTitle,
|
||||
meta: metaTags,
|
||||
link: [
|
||||
{ rel: 'canonical', href: fullUrl }
|
||||
]
|
||||
link: [{ rel: 'canonical', href: fullUrl }],
|
||||
});
|
||||
}
|
||||
|
||||
@@ -24,23 +24,20 @@ export function useStructuredData() {
|
||||
const schema = {
|
||||
'@context': 'https://schema.org',
|
||||
'@type': 'Organization',
|
||||
'name': SITE_NAME,
|
||||
'url': SITE_URL,
|
||||
'logo': `${SITE_URL}/og-image.png`,
|
||||
'description': 'Free online tool to create spritesheets for game development',
|
||||
'sameAs': [
|
||||
'https://gitea.adhd.sh/root/spritesheet-generator',
|
||||
'https://discord.gg/JTev3nzeDa'
|
||||
]
|
||||
name: SITE_NAME,
|
||||
url: SITE_URL,
|
||||
logo: `${SITE_URL}/og-image.png`,
|
||||
description: 'Free online tool to create spritesheets for game development',
|
||||
sameAs: ['https://gitea.adhd.sh/root/spritesheet-generator', 'https://discord.gg/JTev3nzeDa'],
|
||||
};
|
||||
|
||||
useHead({
|
||||
script: [
|
||||
{
|
||||
type: 'application/ld+json',
|
||||
children: JSON.stringify(schema)
|
||||
}
|
||||
]
|
||||
children: JSON.stringify(schema),
|
||||
},
|
||||
],
|
||||
});
|
||||
};
|
||||
|
||||
@@ -49,23 +46,23 @@ export function useStructuredData() {
|
||||
const schema = {
|
||||
'@context': 'https://schema.org',
|
||||
'@type': 'WebSite',
|
||||
'name': SITE_NAME,
|
||||
'url': SITE_URL,
|
||||
'description': 'Create professional spritesheets for your game development projects',
|
||||
'potentialAction': {
|
||||
name: SITE_NAME,
|
||||
url: SITE_URL,
|
||||
description: 'Create professional spritesheets for your game development projects',
|
||||
potentialAction: {
|
||||
'@type': 'SearchAction',
|
||||
'target': `${SITE_URL}/blog?search={search_term_string}`,
|
||||
'query-input': 'required name=search_term_string'
|
||||
}
|
||||
target: `${SITE_URL}/blog?search={search_term_string}`,
|
||||
'query-input': 'required name=search_term_string',
|
||||
},
|
||||
};
|
||||
|
||||
useHead({
|
||||
script: [
|
||||
{
|
||||
type: 'application/ld+json',
|
||||
children: JSON.stringify(schema)
|
||||
}
|
||||
]
|
||||
children: JSON.stringify(schema),
|
||||
},
|
||||
],
|
||||
});
|
||||
};
|
||||
|
||||
@@ -74,36 +71,36 @@ export function useStructuredData() {
|
||||
const schema = {
|
||||
'@context': 'https://schema.org',
|
||||
'@type': 'BlogPosting',
|
||||
'headline': post.title,
|
||||
'description': post.description,
|
||||
'image': `${SITE_URL}${post.image}`,
|
||||
'author': {
|
||||
headline: post.title,
|
||||
description: post.description,
|
||||
image: `${SITE_URL}${post.image}`,
|
||||
author: {
|
||||
'@type': 'Person',
|
||||
'name': post.author
|
||||
name: post.author,
|
||||
},
|
||||
'publisher': {
|
||||
publisher: {
|
||||
'@type': 'Organization',
|
||||
'name': SITE_NAME,
|
||||
'logo': {
|
||||
name: SITE_NAME,
|
||||
logo: {
|
||||
'@type': 'ImageObject',
|
||||
'url': `${SITE_URL}/og-image.png`
|
||||
}
|
||||
url: `${SITE_URL}/og-image.png`,
|
||||
},
|
||||
},
|
||||
'datePublished': post.datePublished,
|
||||
'dateModified': post.dateModified || post.datePublished,
|
||||
'mainEntityOfPage': {
|
||||
datePublished: post.datePublished,
|
||||
dateModified: post.dateModified || post.datePublished,
|
||||
mainEntityOfPage: {
|
||||
'@type': 'WebPage',
|
||||
'@id': `${SITE_URL}${post.url}`
|
||||
}
|
||||
'@id': `${SITE_URL}${post.url}`,
|
||||
},
|
||||
};
|
||||
|
||||
useHead({
|
||||
script: [
|
||||
{
|
||||
type: 'application/ld+json',
|
||||
children: JSON.stringify(schema)
|
||||
}
|
||||
]
|
||||
children: JSON.stringify(schema),
|
||||
},
|
||||
],
|
||||
});
|
||||
};
|
||||
|
||||
@@ -112,21 +109,21 @@ export function useStructuredData() {
|
||||
const schema = {
|
||||
'@context': 'https://schema.org',
|
||||
'@type': 'BreadcrumbList',
|
||||
'itemListElement': items.map((item, index) => ({
|
||||
itemListElement: items.map((item, index) => ({
|
||||
'@type': 'ListItem',
|
||||
'position': index + 1,
|
||||
'name': item.name,
|
||||
'item': `${SITE_URL}${item.url}`
|
||||
}))
|
||||
position: index + 1,
|
||||
name: item.name,
|
||||
item: `${SITE_URL}${item.url}`,
|
||||
})),
|
||||
};
|
||||
|
||||
useHead({
|
||||
script: [
|
||||
{
|
||||
type: 'application/ld+json',
|
||||
children: JSON.stringify(schema)
|
||||
}
|
||||
]
|
||||
children: JSON.stringify(schema),
|
||||
},
|
||||
],
|
||||
});
|
||||
};
|
||||
|
||||
@@ -135,30 +132,30 @@ export function useStructuredData() {
|
||||
const schema = {
|
||||
'@context': 'https://schema.org',
|
||||
'@type': 'Blog',
|
||||
'name': `${SITE_NAME} Blog`,
|
||||
'description': 'Latest articles about sprite sheet generation and game development',
|
||||
'url': `${SITE_URL}/blog`,
|
||||
'blogPost': posts.map(post => ({
|
||||
name: `${SITE_NAME} Blog`,
|
||||
description: 'Latest articles about sprite sheet generation and game development',
|
||||
url: `${SITE_URL}/blog`,
|
||||
blogPost: posts.map(post => ({
|
||||
'@type': 'BlogPosting',
|
||||
'headline': post.title,
|
||||
'description': post.description,
|
||||
'image': `${SITE_URL}${post.image}`,
|
||||
'author': {
|
||||
headline: post.title,
|
||||
description: post.description,
|
||||
image: `${SITE_URL}${post.image}`,
|
||||
author: {
|
||||
'@type': 'Person',
|
||||
'name': post.author
|
||||
name: post.author,
|
||||
},
|
||||
'datePublished': post.datePublished,
|
||||
'url': `${SITE_URL}${post.url}`
|
||||
}))
|
||||
datePublished: post.datePublished,
|
||||
url: `${SITE_URL}${post.url}`,
|
||||
})),
|
||||
};
|
||||
|
||||
useHead({
|
||||
script: [
|
||||
{
|
||||
type: 'application/ld+json',
|
||||
children: JSON.stringify(schema)
|
||||
}
|
||||
]
|
||||
children: JSON.stringify(schema),
|
||||
},
|
||||
],
|
||||
});
|
||||
};
|
||||
|
||||
@@ -167,6 +164,6 @@ export function useStructuredData() {
|
||||
addWebSiteSchema,
|
||||
addBlogPostSchema,
|
||||
addBreadcrumbSchema,
|
||||
addBlogListSchema
|
||||
addBlogListSchema,
|
||||
};
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user