# Enable content negotiation
Serves the same route as HTML, Markdown, or JSON using sveltekit-negotiate.
Tags: sveltekit, content-negotiation, markdown, json, api

$ vela enable content-negotiation

## Tutorials

- [How to make SvelteKit pages readable by AI agents](https://velastack.dev/tutorials/sveltekit-markdown-for-ai-agents)

## src/lib/negotiate.ts

```ts
import { createNegotiation } from "sveltekit-negotiate";

export const { handle, reroute, negotiate, Negotiate } = createNegotiation({
  "text/markdown": { extension: ".md" },
  "application/json": { extension: ".json" },
});
```

## src/routes/(public)/negotiate/+page.server.ts

```ts
import { negotiate } from "$lib/negotiate";

export const load = async ({ locals }) => {
  const message = "Hello, content negotiation!";

  return {
    message,
    ...negotiate(locals, {
      "text/markdown": () => `# ${message}`,
    }),
  };
};
```

## src/routes/(public)/negotiate/+page.svelte

```svelte
<script lang="ts">
  let { data } = $props();
</script>

<section data-role="content">
  <h1 class="text-2xl font-bold">{data.message}</h1>
</section>
```

## src/routes/(public)/negotiate/+page.ts

```ts
import { definePageMetaTags } from "svelte-meta-tags";

export const load = async ({ parent, data }) => {
  await parent();

  const { pageMetaTags } = definePageMetaTags({
    title: "Negotiate",
  });

  return { ...data, pageMetaTags };
};
```