---
title: "WebApplication Schema"
description: "Add WebApplication structured data to your Sanity documents. Identify web-based tools and SaaS products for search engines with schema.org markup."
canonical: https://sanity-plugin-seofields.thehardik.in/docs/schema-org/web-application
---

# WebApplication Schema

Add WebApplication structured data to your Sanity documents to help search engines identify web-based tools and SaaS products.

## About WebApplication Schema

WebApplication schema identifies web-based tools and SaaS products for search engines. It helps Google and other search engines understand that your page represents an interactive application rather than a static website, improving visibility in relevant search results.

## Fields

| Field | Type | Required | Description |
| --- | --- | --- | --- |
| `name` | string | Yes | The name of the web application. |
| `url` | string | Yes | The URL where the web application can be accessed. |
| `applicationCategory` | string | No | The category of the application (e.g. BusinessApplication, GameApplication). |
| `operatingSystem` | string | No | The operating system(s) required (e.g. Any, Windows, macOS). |

## Plugin Registration

```typescript
import { defineConfig } from "sanity";
import { seoFields } from "sanity-plugin-seofields";
import { schemaOrgWebApplicationPlugin } from "sanity-plugin-seofields/schema";

export default defineConfig({
  // ...your sanity config
  plugins: [
    seoFields(),
    schemaOrgWebApplicationPlugin(),
  ],
});
```

## Schema Usage

Add the `schemaOrgWebApplication` field to any document schema:

```typescript
import { defineField, defineType } from 'sanity'

export default defineType({
  name: 'page',
  title: 'Page',
  type: 'document',
  fields: [
    // ... your other fields
    defineField({
      name: 'schemaOrgWebApplication',
      title: 'Web Application',
      type: 'schemaOrgWebApplication',
    }),
  ],
})
```

## GROQ Query

```javascript
*[_type == "yourDocumentType"][0]{
  ...,
  schemaOrgWebApplication
}
```

## Next.js Component

```tsx
import { WebApplicationSchema } from "sanity-plugin-seofields/schema/next";

export default function Page({ data }) {
  return (
    <>
      <WebApplicationSchema data={data.schemaOrgWebApplication} />
      {/* Your page content */}
    </>
  );
}
```

## JSON-LD Output

```json
{
  "@context": "https://schema.org",
  "@type": "WebApplication",
  "name": "My Web App",
  "url": "https://app.example.com",
  "applicationCategory": "BusinessApplication",
  "operatingSystem": "Any"
}
```