# Create a new topic button with category and topic template

**URL:** <https://meta.discourse.org/t/create-a-new-topic-button-with-category-and-topic-template/85775>\
**Category:** Administrators\
**Tags:** how-to\
**Created:** [April 20, 2018, 4:07am UTC](https://meta.discourse.org/t/create-a-new-topic-button-with-category-and-topic-template/85775 "2018-04-20T04:07:12Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![Johani](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/johani/32/176920_2.png) [@Johani](https://meta.discourse.org/u/Johani)\
**Post date:** [April 20, 2018, 5:19am UTC](https://meta.discourse.org/t/create-a-new-topic-button-with-category-and-topic-template/85775/2 "2018-04-20T05:19:15Z")

</div>

This is possible. You need to first prep your category with a topic template. Go the category you want to use and edit its topic template like so:

 ![Capture](https://global.discourse-cdn.com/meta/original/3X/6/1/61a443375eed463a670fae98241636972a9759e0.PNG)

* * *

Then find out what the id of the category is. You can do this by going to `your.site.com/categories.json`

Here on meta it looks like this:

 ![Capture2](https://global.discourse-cdn.com/meta/original/3X/4/9/49ad3e390849e8ad06d5c060ab87c55ff71e2658.PNG)

There’s probably a better way to find the categoryId but this works as needed here.

Now, let’s say I want to use the #Contribute > Bug category. The Id for it would be **“1”** based on `/categories.json`

For #Contribute > Feature, it would be **“2”** and so on.

* * *

Now that you have the id and the category has a topic template, you can copy the code from the theme, make a few modifications, and add it to a separate theme component.

I’v done the modifications here so you can just copy this and change the values as needed:

```plaintext
<script type="text/discourse-plugin" version="0.8.18">
api.decorateWidget("header-buttons:after", helper => {
  if (api.getCurrentUser()) {
      
    // edit these two to your liking
    var $ntb_text = "button text",
      $ntb_icon = "plus",
      
      // no need to edit these
      $ntb_icon_class = ".fa-" + $ntb_icon,
      $ntb_button_class = "btn btn-default btn btn-icon-text",
      $ntb_button_helper = "button#new-create-topic-custom",
      $ntb_icon_helper =
        "i.fa" + $ntb_icon_class + ".d-icon .d-icon-" + $ntb_icon,
      $ntb_label_helper = "span.d-button-label";

    const createTopicCustom = function() {
      const container = Discourse. __container__ ;
      const Composer = require("discourse/models/composer").default;
      const controller = container.lookup("controller:navigation/category");
      const composerController = container.lookup("controller:composer");

      composerController.open({
        action: Composer.CREATE_TOPIC,
        draftKey: Composer.DRAFT,

        // set the category id below
        // see site.com/categories.json
        // for refrence
        categoryId: 3
      });
    };

    return helper.h(
      $ntb_button_helper,
      {
        className: $ntb_button_class,
        title: $ntb_text,
        onclick: createTopicCustom
      },
      [helper.h($ntb_icon_helper), helper.h($ntb_label_helper, $ntb_text)]
    );
  }
});

</script>

```

This goes into the `</head>` section under Common.

* * *

Once you’re done, you should have something like this: (I added margins with CSS)

 ![Capture3](https://global.discourse-cdn.com/meta/original/3X/b/c/bcfc55b82011819de7bcb28d690fd4af7464402b.PNG)

Clicking the new button will open the composer with the category you selected and the topic template for the category will be present as well.

 ![Capture4](https://global.discourse-cdn.com/meta/original/3X/6/3/63f170ef3cba70f7bcbcf7169893437f6c8e7d5a.PNG)

I’m assuming that would be all you need here based on:

> [@bombledmonk](#):
>
> I think I’ve figured out how to selectively add the button based off the primary group class on the body

---

_[View the full topic](https://meta.discourse.org/t/create-a-new-topic-button-with-category-and-topic-template/85775)._