# Call function on page change

**URL:** https://meta.discourse.org/t/call-function-on-page-change/148219
**Category:** Development
**Created:** [April 16, 2020, 9:42am UTC](https://meta.discourse.org/t/call-function-on-page-change/148219 "2020-04-16T09:42:29Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![Chmarus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chmarus/32/88467_2.png) [@Chmarus](https://meta.discourse.org/u/Chmarus)
#### Post date: [April 16, 2020, 9:42am UTC](https://meta.discourse.org/t/call-function-on-page-change/148219/1 "2020-04-16T09:42:29Z")

</div>

I would like to call a JavaScript function on every page change by the user.  
I understand JS and Ruby on Rails code, but I’m not sure what is the best practice in Discourse to achieve that. I’d be grateful for any tips.

Ps. I’m using a dockerized version of Discourse.

---

<div class="post-metadata">

### Author: ![jordan.vidrine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jordan.vidrine/32/515563_2.png) [@jordan.vidrine](https://meta.discourse.org/u/jordan.vidrine)
#### Post date: [April 16, 2020, 1:53pm UTC](https://meta.discourse.org/t/call-function-on-page-change/148219/2 "2020-04-16T13:53:31Z")

</div>

Depending on what you want to do this could be wildly varied, but to call a function, or do something on every page change by the user you could use the plugin API.

Here you can read through a [developers guide to using Discourse theming/components (custom JS etc)](https://meta.discourse.org/t/developer-s-guide-to-discourse-themes/93648).

Here you can find [withPluginApi information.](https://meta.discourse.org/t/a-new-versioned-api-for-client-side-plugins/40051)

This is a simple example of me logging the current URL as well as the page title.

I am doing this in the `common/head_tag.html` file. Which can be edited at `/admin/customize/themes/9/common/head_tag/edit`

```xml
<script type="text/discourse-plugin" version="0.8">
    api.onPageChange((url, title) => {
        console.log(url, title);
    });
</script>

```

---

<div class="post-metadata">

### Author: ![Chmarus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chmarus/32/88467_2.png) [@Chmarus](https://meta.discourse.org/u/Chmarus)
#### Post date: [April 16, 2020, 2:01pm UTC](https://meta.discourse.org/t/call-function-on-page-change/148219/3 "2020-04-16T14:01:30Z")

</div>

> [@jordan.vidrine](#):
>
> I am doing this in the `common/head_tag.html` file. Which can be edited at `/admin/customize/themes/9/common/head_tag/edit`

Thanks @jordan.vidrine for reply. I will check these resources. One other question, maybe more related to Dockerized version. Is there any best practice for editing files inside the container? May I just “get” into the container modify files and restart it?

---

<div class="post-metadata">

### Author: ![jordan.vidrine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jordan.vidrine/32/515563_2.png) [@jordan.vidrine](https://meta.discourse.org/u/jordan.vidrine)
#### Post date: [April 16, 2020, 3:08pm UTC](https://meta.discourse.org/t/call-function-on-page-change/148219/4 "2020-04-16T15:08:55Z")

</div>

For some instances I believe that should work. (I dont have much experience with Docker)

You can also edit certain `css` and `html` files, as well as `<script>` tags from the discourse admin panel when visiting your site at `/admin/customize/themes/9/common/head_tag/edit`.