VS Code Schema.org Snippets

This extension includes VS Code snippets for implementing Schema.org JSON-LD. Currently working on snippets following the Google Structured Data Guide. Snippets include properties that are both required and recommended by Google. Structured data is very flexible, and certain optional properties may have undesired results. Follow the Google Structured Data Guide to ensure the intended use.

Installation

Launch the Command Pallete with Ctrl + Shift + P (Windows/Linux) or Cmd + Shift + P (OSX) and type Extensions. From there, you can search for this extension and click Install. You can also install it on the VS Code Extensions Marketplace.

Supported Languages/File Extensions

JavaScript (.js)
TypeScript (.ts)
JavaScript React (.jsx)
TypeScript React (.tsx)

Usage

Type part of a snippet and press enter or tab. If tab completion is disabled, go to File + Preferences + Settings (Windows/Linux) or Code + Preferences + Settings (OSX) and set editor.tabCompletion to true.

Snippets

Snippet	Content
`breadcrumb-list-schema`	Breadcrumb List Schema (Google, Schema.org)
`corporate-contact-schema`	Corporate Contact Schema (Google)
`event-schema`	Event Schema (Google, Schema.org)
`job-posting-schema`	Job Posting Schema (Google, Schema.org)
`product-aggregate-offer-schema`	Product Aggregate Offer Schema (Google, Schema.org)
`product-schema`	Product Schema (Google, Schema.org)
`recipe-schema`	Recipe Schema (Google, Schema.org)
`script-json-ld`	JSON-LD Script Tag
`sitelinks-searchbox-schema`	Sitelinks Searchbox Schema (Google, Schema.org)
`video-schema`	Video Schema (Google, Schema.org)

Contributing

Overview

The project utilizes a simple build system where varaibles can be defined in the src/snippets.json file and injected on build. Variables make it easier to add and maintain things such as ISO standards for tab completion suggestions.

Example:

{
// ...
    "Schema Name": {
        "prefix": "schema-name",
        "description": "Schema Description",
        "body": [
            "{",
            "\t\"@context\": \"http://schema.org\",",
            "\t\"@type\": \"SchemaName\",",
            "\t\"examplekey\": \"${1:|<%example%>|}\"", // <%example%> will be replaced on build
            "}"
        ]
    },
// ...
}

Defining the variable in the src/templates.js file:

// ...
function getTemplates() {

    // ...

    // Example
    let example = ["Suggestion 1", "Suggestion 2", "Suggestion 3"];
    example = example.join(','); // Format

    return {
        example, // The returned key must be the same as the variable name used in the snippet: <%example%>
        // ...
    };
}

module.exports = getTemplates();

Now whenever you run npm run build, the renderer will replace every occurrence of <%example%> with Suggestion 1,Suggestion 2,Suggestion 3 and export the file to the snippets/ directory.

Schema.org code snippets

austinleegordon