# Install on Astro

> Add MetricRaven to the shared layout of an Astro site.

Source: https://metricraven.com/docs/install-astro  
Markdown: https://metricraven.com/docs/install-astro.md  
Section: Installation guides

Put the tag in the layout every page uses. Astro copies it into each page's `<head>`, on static and server-rendered sites alike.

1. **Copy your snippet**

   In MetricRaven, open your site's **Settings → Install** card and copy the script tag. It already contains your site ID.

2. **Add it to your base layout**

   Replace `YOUR_SITE_ID` with the public site ID from your site's **Settings → Install** card. The site ID is public and safe in browser code; never put your secret key in a page.

   ```xml title="src/layouts/Layout.astro"
   ---
   // src/layouts/Layout.astro
   const { title } = Astro.props;
   ---
   <html lang="en">
     <head>
       <meta charset="utf-8" />
       <title>{title}</title>
       <script
         is:inline
         defer
         src="https://metricraven.com/js/script.js"
         data-site-id="YOUR_SITE_ID"
       ></script>
     </head>
     <body>
       <slot />
     </body>
   </html>
   ```

   `is:inline` tells Astro to output the tag as written instead of bundling it, which keeps the `data-*` attributes the tracker reads.

3. **Build, deploy and open your site**

   `astro dev` runs on `localhost`, which is not tracked by default; check the deployed site.

> **Verify it works**
>
> Open your live website in a normal browser window (not an automated or embedded one). In the browser's Network panel, look for `script.js` and then a request to `/api/v1/collect` whose response contains `ok: true`. Open your site's **Traffic** tab and choose **Refresh**; the selected dates must include your visit.
>
> Nothing showing? See [Troubleshooting](https://metricraven.com/docs/troubleshooting).

## Notes

- Have more than one layout? Add the tag to each, or to a shared head component they all include.
- With view transitions (`<ClientRouter />`), navigations use the history API, which the tracker records.
- Click between a few pages and check the Network panel shows one `/api/v1/collect` pageview per navigation. Two per click means the tag is loaded twice.
- To serve the script from your own domain, see the [Astro proxy](https://metricraven.com/docs/proxy-astro).

Optional script attributes are listed in [Install & verify](https://metricraven.com/docs/install). To exclude your own visits, see [Exclude your visits](https://metricraven.com/docs/exclude-visits).
