schema-org-graph
schema-org-graph copied to clipboard
Build Schema.org graphs for JavaScript Runtimes (Browser, Node, etc). Improve your sites SEO with quick and easy Rich Results.
Moved to Unhead.
The quickest and easiest way to build Schema.org graphs for JavaScript Runtimes (Browser, Node, etc).
Status: 🔨 In Development Please report any issues 🐛 Made possible by my Sponsor Program 💖 Follow me @harlan_zw 🐦 |
Background
This package provides a JS low-level API that frameworks can build their Schema.org implementations from, without any specific JS runtimes requirements.
It was built for @vueuse/schema-org.
Features
- 😎 Choose your own provider: Simple (Google and Yoast best practices) and Full (schema-dts)
- 🧙 30+ Nodes with automated relations, date, URL resolving and more for best practice Schema.org
- 💡 Simple global meta provides for minimal boilerplate
- 🌳 Minimal code, optimised for tree-shaking and SSR
Install
npm add -D schema-org-graph-js
For temporary documentation you can visit vue-schema-org.netlify.app, proper documentation will come soon.
Setup Example
import { createSchemaOrgGraph, renderCtxToSchemaOrgJson } from 'schema-org-graph-js'
import { defineWebPage, defineWebSite, defineOrganization } from 'schema-org-graph-js/simple'
const ctx = createSchemaOrgGraph()
ctx.addNode([
useSchemaOrg([
defineOrganization({
name: 'Nuxt.js',
logo: '/logo.png',
sameAs: [
'https://twitter.com/nuxt_js'
]
}),
defineWebSite({
name: 'Nuxt',
}),
defineWebPage(),
])
])
const schemaJson = renderCtxToSchemaOrgJson(ctx, {
host: 'https://v3.nuxtjs.org/',
path: '/getting-started/quick-start',
title: 'Nuxt 3 - Quick Start',
description: 'Starting fresh? Getting started with Nuxt 3 is straightforward!',
})
Output
{
"@context": "https://schema.org",
"@graph": [
{
"@type": "Organization",
"@id": "https://v3.nuxtjs.org/#identity",
"url": "https://v3.nuxtjs.org/getting-started/quick-start",
"name": "Nuxt.js",
"logo": {
"@type": "ImageObject",
"inLanguage": "en",
"@id": "https://v3.nuxtjs.org/#logo",
"url": "https://v3.nuxtjs.org/logo.png",
"caption": "Nuxt.js",
"contentUrl": "https://v3.nuxtjs.org/logo.png"
},
"sameAs": [
"https://twitter.com/nuxt_js"
],
"image": {
"@id": "https://v3.nuxtjs.org/#logo"
}
},
{
"@type": "WebPage",
"@id": "https://v3.nuxtjs.org/getting-started/quick-start#webpage",
"url": "https://v3.nuxtjs.org/getting-started/quick-start",
"title": "Nuxt 3 - Quick Start",
"description": "Starting fresh? Getting started with Nuxt 3 is straightforward!",
"potentialAction": [
{
"@type": "ReadAction",
"target": [
"https://v3.nuxtjs.org/"
]
}
],
"about": {
"@id": "https://v3.nuxtjs.org/#identity"
},
"primaryImageOfPage": {
"@id": "https://v3.nuxtjs.org/#logo"
},
"isPartOf": {
"@id": "https://v3.nuxtjs.org/#website"
}
},
{
"@type": "WebSite",
"@id": "https://v3.nuxtjs.org/#website",
"url": "https://v3.nuxtjs.org/",
"inLanguage": "en",
"name": "Nuxt",
"publisher": {
"@id": "https://v3.nuxtjs.org/#identity"
}
}
]
}
Sponsors
License
MIT License © 2022-PRESENT Harlan Wilton