# Topic ID as a variable?

**URL:** https://meta.discourse.org/t/topic-id-as-a-variable/374168
**Category:** Development
**Created:** [July 14, 2025, 6:48pm UTC](https://meta.discourse.org/t/topic-id-as-a-variable/374168 "2025-07-14T18:48:32Z")
**Posts on this page:** 1
**Showing post:** 7

<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: [July 14, 2025, 8:42pm UTC](https://meta.discourse.org/t/topic-id-as-a-variable/374168/7 "2025-07-14T20:42:44Z")

</div>

It will be easier to create a custom component that appends this to the correct posts rather than filling a template.

If you edit the code of your theme under `admin > themes & components`… and add this to the JS tab, it should get you what you’re after with some adjustment:

```gjs
import { apiInitializer } from "discourse/lib/api";
import Component from "@glimmer/component";

class TopicIdentifier extends Component {
  get topicId() {
    return this.args.post?.topic?.id;
  }

  get shouldShow() {
    const firstPost = this.args.post?.post_number === 1; // first post in topic
    const desiredCategories = [45, 3]; // a comma separated list of category IDs you want this to appear in 
    const isInCategory = desiredCategories.includes(
      this.args.post?.topic.category.id
    );

    return firstPost && isInCategory;
  }

  <template>
    {{#if this.shouldShow}}
      <!-- you can edit the content below, {{this.topicId}} is where the topic ID will be filled -->
      This topic's ID is
      {{this.topicId}} 
      <!-- you can edit the content above -->
    {{/if}}
  </template>
}

export default apiInitializer((api) => {
  api.decorateCookedElement((element, helper) => {
    const wrapper = document.createElement("div");
    wrapper.className = "custom-topic-id"
 
    helper?.renderGlimmer(
      wrapper,
      <template><TopicIdentifier @post={{helper.model}} /></template>
    );

    element.appendChild(wrapper);
  });
});

```

You can find the category ID from its URL to configure `desiredCategories`, for example, the [support category](https://meta.discourse.org/c/support/6) here on Meta has the ID of 6

You can add CSS to style this how you’d like with the CSS tab… for example

```css
.custom-topic-id {
  display: inline-block;
  background: yellow;
}

```

 ![A screenshot depicts a social media post on a platform like Reddit, featuring a bizarre and lengthy text post from a new user named Tobias, with a humorous caption asking for the funniest thing seen that day. (Captioned by AI)](https://global.discourse-cdn.com/meta/original/4X/5/d/6/5d6727d89e95e2f823557eae340585bbb739dbef.png)

---

_[View the full topic](https://meta.discourse.org/t/topic-id-as-a-variable/374168)._