# Sam's Simple Theme

**URL:** <https://meta.discourse.org/t/sams-simple-theme/23552>\
**Category:** Theme\
**Tags:** official, sams-simple-theme\
**Created:** [December 31, 2014, 3:20am UTC](https://meta.discourse.org/t/sams-simple-theme/23552 "2014-12-31T03:20:14Z")\
**Posts on this page:** 1\
**Showing post:** 265

<div class="post-metadata">

**Author:** ![Stranik](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stranik/32/85638_2.png) [@Stranik](https://meta.discourse.org/u/Stranik)\
**Post date:** [June 6, 2018, 7:58am UTC](https://meta.discourse.org/t/sams-simple-theme/23552/265 "2018-06-06T07:58:55Z")

</div>

Do not know where to add, I want to share. In this example, you can see how to change the individual elements in the design. I do not know how true this approach is.

**Add:**

PLAGIN/assets/javascripts/discourse/helpers/catid-img.js.es6

```plaintext
import { registerUnbound } from 'discourse-common/lib/helpers';

var get = Em.get,
    escapeExpression = Handlebars.Utils.escapeExpression;

export function categoryBadgeHTML(category, opts) {
  opts = opts || {};

  let categoryID = escapeExpression(get(category, 'id'));
  let img = Discourse.Category.findById(categoryID).uploaded_logo.url;
  let categoryName = escapeExpression(get(category, 'name'));
  let url = opts.url ? opts.url : Discourse.getURL("/c/") + Discourse.Category.slugFor(category); 
 
  return `<a class="catid-url" title="${categoryName}" href="${url}"><img src="${img}" alt="${categoryName}" class="catid-logo"></a>`;
}

export function categoryLinkHTML(category, options) {
  var categoryOptions = {};
  return new Handlebars.SafeString(categoryBadgeHTML(category, categoryOptions));
}

registerUnbound('catid-img', categoryLinkHTML);

```

**Add:**

 ![Toxu-cat](https://global.discourse-cdn.com/meta/original/3X/7/a/7a03d0e12fc918b9b7f55b00737dcc5ef6a87c9c.gif)

```plaintext
{{catid-img topic.category}}

```

The output of category icons:

 ![Toxu](https://global.discourse-cdn.com/meta/original/3X/1/f/1f1a5fa59c0ea7f08fd096aa02bdfd7e0d4c3222.gif)

P.S. perhaps this can be done in another way, more easier, but it is easier for me to add 1 file to the plugin.

---

_[View the full topic](https://meta.discourse.org/t/sams-simple-theme/23552)._
