---
// SEO Component for page-specific structured data
// Use in the head slot of BaseLayout for additional schema markup
interface BreadcrumbItem {
name: string;
url: string;
}
interface Props {
type?: 'WebPage' | 'BlogPosting' | 'Article' | 'Service' | 'AboutPage' | 'ContactPage' | 'FAQPage';
breadcrumbs?: BreadcrumbItem[];
article?: {
author: string;
datePublished: string;
dateModified?: string;
category?: string;
tags?: string[];
image?: string;
wordCount?: number;
};
service?: {
name: string;
description: string;
};
faq?: Array<{
question: string;
answer: string;
}>;
}
const { type = 'WebPage', breadcrumbs, article, service, faq } = Astro.props;
const baseUrl = 'https://workroot.in';
const currentUrl = Astro.url.href;
// Get page title and description from parent layout props
const pageTitle = (Astro.props as any).title || 'WorkRoot IT Solutions';
const pageDescription = (Astro.props as any).description || 'Professional IT services including web development, cloud solutions, and digital transformation for businesses.';
// Generate BreadcrumbList schema
const breadcrumbSchema = breadcrumbs ? {
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": breadcrumbs.map((item, index) => ({
"@type": "ListItem",
"position": index + 1,
"name": item.name,
"item": `${baseUrl}${item.url}`
}))
} : null;
// Generate BlogPosting schema for blog posts (more specific than Article)
const blogPostingSchema = article && type === 'BlogPosting' ? {
"@context": "https://schema.org",
"@type": "BlogPosting",
"headline": pageTitle,
"description": pageDescription,
"image": article.image ? {
"@type": "ImageObject",
"url": article.image,
"width": 1200,
"height": 675
} : undefined,
"author": {
"@type": "Person",
"name": article.author,
"url": `${baseUrl}/about`
},
"datePublished": article.datePublished,
"dateModified": article.dateModified || article.datePublished,
"publisher": {
"@type": "Organization",
"name": "WorkRoot IT Solutions",
"url": baseUrl,
"logo": {
"@type": "ImageObject",
"url": `${baseUrl}/logo.png`,
"width": 512,
"height": 512
}
},
"mainEntityOfPage": {
"@type": "WebPage",
"@id": currentUrl
},
"keywords": article.tags?.join(', '),
"articleSection": article.category,
"wordCount": article.wordCount,
"inLanguage": "en-US"
} : null;
// Generate Service schema
const serviceSchema = service ? {
"@context": "https://schema.org",
"@type": "Service",
"name": service.name,
"description": service.description,
"provider": {
"@type": "Organization",
"name": "WorkRoot IT Solutions",
"url": baseUrl
},
"areaServed": "Worldwide",
"serviceType": service.name
} : null;
// Generate WebPage schema for standard pages
const webPageSchema = type === 'WebPage' && Astro.url.pathname !== '/' ? {
"@context": "https://schema.org",
"@type": "WebPage",
"name": pageTitle,
"description": pageDescription,
"url": currentUrl,
"inLanguage": "en-US",
"isPartOf": {
"@type": "WebSite",
"@id": `${baseUrl}/#website`
},
"about": {
"@type": "Organization",
"name": "WorkRoot IT Solutions"
},
"primaryImageOfPage": {
"@type": "ImageObject",
"url": `${baseUrl}/og-image.jpg`
}
} : null;
// Generate FAQPage schema
const faqPageSchema = faq && faq.length > 0 ? {
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": faq.map((item) => ({
"@type": "Question",
"name": item.question,
"acceptedAnswer": {
"@type": "Answer",
"text": item.answer
}
}))
} : null;
// Generate AboutPage schema
const aboutPageSchema = type === 'AboutPage' ? {
"@context": "https://schema.org",
"@type": "AboutPage",
"name": pageTitle,
"description": pageDescription,
"url": currentUrl,
"inLanguage": "en-US",
"mainEntity": {
"@type": "Organization",
"name": "WorkRoot IT Solutions",
"url": baseUrl
}
} : null;
// Generate ContactPage schema
const contactPageSchema = type === 'ContactPage' ? {
"@context": "https://schema.org",
"@type": "ContactPage",
"name": pageTitle,
"description": pageDescription,
"url": currentUrl,
"inLanguage": "en-US",
"mainEntity": {
"@type": "Organization",
"name": "WorkRoot IT Solutions",
"url": baseUrl
}
} : null;
---
{breadcrumbSchema && (
)}
{blogPostingSchema && (
)}
{serviceSchema && (
)}
{webPageSchema && (
)}
{faqPageSchema && (
)}
{aboutPageSchema && (
)}
{contactPageSchema && (
)}