> ## Documentation Index
> Fetch the complete documentation index at: https://docs.joinmarkt.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Policy & Legal Pages

> Privacy, terms, and refund pages for Vite and Nunjucks themes — routes, filenames, and store.policies fields.

# Policy & Legal Pages

Policy **text** is written by the seller in dashboard **Configure** (store settings). The theme only **renders** it — never hardcode legal copy in theme files.

***

## Route map (do not mix runtimes)

| Policy  | Vite                                     | Nunjucks                                                |
| ------- | ---------------------------------------- | ------------------------------------------------------- |
| Privacy | `/privacy` → `src/pages/PrivacyPage.tsx` | `/privacy-policy` → `templates/privacy-policy.njk`      |
| Terms   | `/terms` → `src/pages/TermsPage.tsx`     | `/terms` or `/terms-of-service` → `templates/terms.njk` |
| Refunds | `/refunds` → `src/pages/RefundsPage.tsx` | `/refund-policy` → `templates/refund-policy.njk`        |

| Policy  | Vite field             | Nunjucks field           |
| ------- | ---------------------- | ------------------------ |
| Privacy | `store.privacyPolicy`  | `store.policies.privacy` |
| Terms   | `store.termsOfService` | `store.policies.terms`   |
| Refunds | `store.refundPolicy`   | `store.policies.refund`  |

Footer and nav links must use the **runtime paths** (`shopUrl` / React Router). Vite `/privacy` is not the same as Nunjucks `/privacy-policy`.

***

## Vite

Reference: `templates/markt-vite-storefront` — `LegalPolicyPage` + `ProductRichText`.

```tsx theme={null}
import { LegalPolicyPage } from '@/components/legal-policy-page'

export const PrivacyPage = () => (
  <LegalPolicyPage
    title="Privacy Policy"
    policyKey="privacyPolicy"
    emptyMessage="No privacy policy has been added yet."
  />
)
```

`policyKey`: `privacyPolicy` | `termsOfService` | `refundPolicy`.

Register routes in `App.tsx`:

```tsx theme={null}
<Route path="/privacy" element={<PrivacyPage />} />
<Route path="/terms" element={<TermsPage />} />
<Route path="/refunds" element={<RefundsPage />} />
```

***

## Nunjucks

Template filename = router `templateName` → `templates/{name}.njk`.

```njk theme={null}
{# templates/privacy-policy.njk #}
{% extends "layouts/base.njk" %}
{% block content %}
  <h1>Privacy Policy</h1>
  {% if store.policies.privacy %}
    <div class="policy-body">{{ store.policies.privacy | safe }}</div>
  {% else %}
    <p>No privacy policy has been added yet.</p>
  {% endif %}
{% endblock %}
```

| File                           | Body                     |
| ------------------------------ | ------------------------ |
| `templates/privacy-policy.njk` | `store.policies.privacy` |
| `templates/terms.njk`          | `store.policies.terms`   |
| `templates/refund-policy.njk`  | `store.policies.refund`  |

**Wrong (will not resolve):** `privacy.njk`, `refunds.njk`, or linking to `/privacy` / `/refunds` on a Nunjucks store.

Footer example:

```njk theme={null}
<a href="{{ '/privacy-policy' | shopUrl }}">Privacy</a>
<a href="{{ '/terms' | shopUrl }}">Terms</a>
<a href="{{ '/refund-policy' | shopUrl }}">Refunds</a>
```

Because `autoescape` is **false**, do not put policy HTML into attributes. For meta tags, strip/encode — see [Nunjucks Pitfalls](/storefront/nunjucks-pitfalls).

***

## Empty and loading states

* Missing policy → short empty message (same idea as Vite `emptyMessage`)
* Do not invent placeholder legal text

***

## See also

* [Template Structure](/storefront/template-structure)
* [Nunjucks Theme API](/storefront/nunjucks)
* [Nunjucks Theme Pitfalls](/storefront/nunjucks-pitfalls)
* [Build a Custom Theme](/storefront/custom-themes)