# Get Category Name using JS

**URL:** https://meta.discourse.org/t/get-category-name-using-js/177110
**Category:** Development
**Created:** [January 24, 2021, 1:55pm UTC](https://meta.discourse.org/t/get-category-name-using-js/177110 "2021-01-24T13:55:46Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![Daniil\_Bazhenov](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/daniil_bazhenov/32/201247_2.png) [@Daniil\_Bazhenov](https://meta.discourse.org/u/Daniil_Bazhenov)
#### Post date: [January 24, 2021, 1:55pm UTC](https://meta.discourse.org/t/get-category-name-using-js/177110/1 "2021-01-24T13:55:46Z")

</div>

Hi, maybe someone can help.  
I need to get the category name of the current page.  
I need to get this in a JS script that I can add to Footer or Body.  
I’ve tried a couple of solutions, but I can’t get it to be stable and given the user’s page transitions.  
I plan to pass the resulting category name as an Event in Google Analytics to count visits for each category.

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [January 25, 2021, 11:57pm UTC](https://meta.discourse.org/t/get-category-name-using-js/177110/2 "2021-01-25T23:57:17Z")

</div>

There might be a way to consistently do it across both topics and category pages, but I’ve gotten the category ID in two different ways… one for category pages:

```xml
<script type="text/discourse-plugin" version="0.8">
const container = Discourse. __container__ ;
const controller = container.lookup('controller:navigation/category');

api.onPageChange((url, title) => {
  console.log(controller.get("category.id"));
});
</script>

```

and a similar way for topic pages:

```xml
<script type="text/discourse-plugin" version="0.8">
const container = Discourse. __container__ ;
const controller = container.lookup('controller:topic');

api.onPageChange((url, title) => {
  console.log(controller.get("model.category_id"));
});
</script>

```

In the category page example you can alternatively use `category.name` or `category.slug` but with the topic model only the `category_id` is available so you’d have to do a little more work there to get the name. ID might be a better path anyway because it’s consistent even if the category name or slug changes.

---

<div class="post-metadata">

### Author: ![Daniil\_Bazhenov](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/daniil_bazhenov/32/201247_2.png) [@Daniil\_Bazhenov](https://meta.discourse.org/u/Daniil_Bazhenov)
#### Post date: [January 27, 2021, 9:04am UTC](https://meta.discourse.org/t/get-category-name-using-js/177110/4 "2021-01-27T09:04:50Z")

</div>

I was able to get the Category ID for the Category and Topic pages,  
But when I go to the FAQ or another page, the Category ID is also displayed, from the previous page.  
How can I exclude this?

Here is my code, it works, I do not know JS in general.

```plaintext
<script type="text/discourse-plugin" version="0.8">
const container = Discourse. __container__ ;

api.onPageChange((url, title) => {
    const topic = container.lookup('controller:topic');
    const topic_cat_id = topic.get("model.category_id");
    if(typeof topic_cat_id !== "undefined")
    {
        gtag('event', 'Categories Views Analytics', {
            'event_category': 'Topic Page',
            'event_label': topic_cat_id,
        });
        console.log("Topic " + topic_cat_id);
    } else {
        const category = container.lookup('controller:navigation/category');
        const category_cat_id = category.get("category.id");  
        
        if(typeof category_cat_id !== "undefined") 
        {
            gtag('event', 'Categories Views Analytics', {
                'event_category': 'Category Page',
                'event_label': category_cat_id,
            });  
            console.log("Category " + category_cat_id);
        } else {
            gtag('event', 'Categories Views Analytics', {
                'event_category': 'Other Page',
                'event_label': 'Other Page'
            });              
            console.log("Other");
        }
    }
});
</script>

```

I must have messed up something in the variables or need to get a controller of a different type of page.
