> For the complete documentation index, see [llms.txt](https://addressable.gitbook.io/knowledge-base/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://addressable.gitbook.io/knowledge-base/event-tracking/addressable-pixel/additional-steps-for-single-page-application-spa.md).

# Additional Steps for Single Page Application (SPA)

If your website is a Single-Page Application or Progressive Web App, you may need one additional step so PageView events are tracked on client-side navigations.

This can apply to websites built with frameworks like **React**, **Next.js**, **Vue**, **Nuxt**, and **Angular** — specifically when the site uses client-side routing where the URL changes without a full page reload.

{% hint style="success" %}
**When Is This Needed**

Use this if:

* Your website uses client-side routing
* The URL changes without a full page reload
* You see the first pageview but not subsequent soft navigations
  {% endhint %}

### Why This Happens

The Addressable Pixel tracks a **PageView** when the page loads. On SPAs, most navigations happen without a full reload, so only the first pageview is captured automatically.

To track subsequent page changes, you need to trigger a **PageView** on each route change.

{% hint style="warning" %}
Make sure the **URL updates first** and the **PageView fires second**. This ensures Addressable records the correct `page_url` for the new page.

Also be careful not to send duplicate pageviews — this can happen if multiple triggers fire on the same route change, or if both GTM and JavaScript are sending the same event.
{% endhint %}

***

## Google Tag Manager (GTM)

Use this section if your Addressable Pixel is installed through **Google Tag Manager**.

### Follow These Steps

The standard **All Pages** trigger only fires on full page loads. You need an additional trigger for soft navigations.

1. Log into [**Google Tag Manager**](https://tagmanager.google.com/)
2. Select the correct **Account/Container**
3. Go to your existing **Addressable Pixel** tag configured for **PageView**
4. Add an additional trigger such as **History Change** or a custom `dataLayer` event
5. Make sure the trigger fires only once per route change
6. Use **Preview** mode to verify the tag fires correctly on soft navigations
7. **Submit** and **Publish**

{% hint style="warning" %}
If you are using GTM, do not also add a separate JavaScript implementation for the same pixel. Using both together is not supported and may result in duplicate events.
{% endhint %}

***

## JavaScript SDK (JS)

Use this section if your Addressable Pixel is installed using the **JavaScript SDK**.

### Follow These Steps

After each client-side route change, fire:

```javascript
window.__adrsbl.run('PageView', false);
```

Note: Make sure the URL has already updated before calling this. For example:

```javascript
history.pushState({}, '', '/swap');
window.__adrsbl.run('PageView', false);
```

{% hint style="danger" %}
Please **do not** manually send a **PageView** for the **initial page load** as the base pixel ***already*** handles that. This method should only be used for soft navigations after the first load.
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://addressable.gitbook.io/knowledge-base/event-tracking/addressable-pixel/additional-steps-for-single-page-application-spa.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
