🚀 Socket Launch Week 🚀 Day 3: Socket Acquires Coana.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

astro-seo-schema

Package Overview
Dependencies
Maintainers
0
Versions
25
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

astro-seo-schema

Easily insert valid Schema.org JSON-LD in your Astro apps.

5.0.0
latest
Source
npm
Version published
Weekly downloads
6.3K
-6.11%
Maintainers
0
Weekly downloads
 
Created
Source

🚀 Astro JSON-LD Schema

version downloads github actions typescript makepr

Easily insert valid Schema.org JSON-LD in your Astro apps.

The <Schema> component is inspired by react-schemaorg and powered by the schema-dts package for full TypeScript definitions.

This <Schema> component:

  • Adds type checking to validate user-provided schema JSON
  • Escapes the JSON data.
  • Outputs a <script type="type="application/ld+json"> with the escaped schema.

📦 Installation

First, install the schema-dts & astro-seo-schema packages using your package manager. (If you aren’t sure which package manager you’re using, run the first command.)

Using PNPM

pnpm install schema-dts astro-seo-schema

Using NPM

npm install schema-dts astro-seo-schema

Using Yarn

yarn add schema-dts astro-seo-schema

🥑 Usage

To insert a simple JSON-LD snippet in any of your Astro pages, import Schema component and then use the component inside the <head> section of your HTML:

---
import { Schema } from "astro-seo-schema"
---

<html lang="en">
    <head>
        <Schema
            item={{
                "@context": "https://schema.org",
                "@type": "Person",
                name: "Grace Brewster",
                alternateName: "Grace Brewster Murray Hopper",
                alumniOf: {
                    "@type": "CollegeOrUniversity",
                    name: ["Yale University", "Vassar College"],
                },
                knowsAbout: ["Compilers", "Computer Science"],
            }}
        />
    </head>

    <body>
        <h1>Hello from astro</h1>
    </body>
</html>

Looking for a simpler approach ?

If you are not into schema.org and want a simpler approach, you might want to check another alternative astro-seo-meta.

astro-seo-meta helps you to add tags that are relevant for search engine optimization (SEO) to your astro pages.

Changelog

Please see the Changelog for more information on what has changed recently.

Acknowledgements

Keywords

astro
astro-component
json-ld
schema-org
semantic-web
seo

FAQs

Package last updated on 03 Dec 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

Introducing Module Reachability: Focus on the Vulnerabilities That Matter

Product

Introducing Module Reachability: Focus on the Vulnerabilities That Matter

Module Reachability filters out unreachable CVEs so you can focus on vulnerabilities that actually matter to your application.

By Trevor Norris  -  Apr 23, 2025