# Problems with adding HTML via theme component

**URL:** https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656
**Category:** Support
**Created:** [May 12, 2025, 12:53am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656 "2025-05-12T00:53:53Z")
**Posts on this page:** 12
**Page:** 1

<div class="post-metadata">

### Author: ![Issa\_George](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/issa_george/32/502509_2.png) [@Issa\_George](https://meta.discourse.org/u/Issa_George)
#### Post date: [May 12, 2025, 12:53am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/1 "2025-05-12T00:53:53Z")

</div>

when i paste the code the widget shows up on the main page of the website. how can i make it show up in one of the site categories/pages not main page?

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [May 12, 2025, 2:26am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/3 "2025-05-12T02:26:21Z")

</div>

Hi there, could you send a screenshot or a screen recording of the problem?  
Thanks!

---

<div class="post-metadata">

### Author: ![Issa\_George](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/issa_george/32/502509_2.png) [@Issa\_George](https://meta.discourse.org/u/Issa_George)
#### Post date: [May 12, 2025, 9:21am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/4 "2025-05-12T09:21:44Z")

</div>

![IMG_3726](https://global.discourse-cdn.com/meta/original/4X/d/9/5/d959c94436dcd07caa4a6544093772966d549b71.jpeg)  
If I put the code in the head it shows up in the main page on top. The body lets it show up in the main page at the bottom. How can I make the widget show up in another page away from the main page? Thanks

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [May 12, 2025, 9:25am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/5 "2025-05-12T09:25:18Z")

</div>

Hi @Issa_George. I’d recommend working through the tutorial here to get familiar with the concepts and techniques needed for theme development. It covers how to render content in various places throughout the UI:

> [@Theme Developer Tutorial: 1. Introduction](https://meta.discourse.org/t/theme-developer-tutorial-1-introduction/357796):
>
> This tutorial will teach you how to create a Discourse Theme or Theme Component from the ground up. While this topic assumes no previous experience working on Discourse themes, it does assume some prior experience using [HTML](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML), [CSS](https://developer.mozilla.org/en-US/docs/Learn/CSS) and [JavaScript](https://developer.mozilla.org/en-US/docs/Learn/JavaScript). It’ll also help if you [know your way around GitHub](https://guides.github.com/activities/hello-world/). What are Discourse themes? A theme or theme component is a set of files packaged together designed to either modify Discourse visually or to add new features. Themes In general, themes are not suppo…

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [May 12, 2025, 10:37am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/6 "2025-05-12T10:37:42Z")

</div>

And you’ll find theme development much easier with the discourse\_theme cli.

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [May 12, 2025, 10:38am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/7 "2025-05-12T10:38:58Z")

</div>

Like what David said, you should follow that tutorial to learn how to build a component that can be rendered in various places, specifically, plugin outlets, which are dotted around the site to provide places where you can render the component.

You can place the code inside the ‘JS’ tab and pair it with `api.renderInOutlet()` and a `<template>` tag.

---

<div class="post-metadata">

### Author: ![Issa\_George](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/issa_george/32/502509_2.png) [@Issa\_George](https://meta.discourse.org/u/Issa_George)
#### Post date: [May 14, 2025, 10:13am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/8 "2025-05-14T10:13:19Z")

</div>

Hi Nate, I am still struggling with this. I just want to put the html widget code inside a category section instead of main page. I read the guide but it is not clear to me what I should use. I installed CLI and the code I put doesn’t do anything on my site. I then went to the theme creator site and my code doesn’t show up in the preview. The sample code from the guide works and I can see the colored changes when I put the code.

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [May 14, 2025, 10:51am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/9 "2025-05-14T10:51:28Z")

</div>

Hi there, could you share the current code that you are using? Thanks!

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [May 14, 2025, 11:20am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/12 "2025-05-14T11:20:07Z")

</div>

You should use a plugin outlet and a glimmer component. Have a look at the recent guides for theme development.

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [May 14, 2025, 1:56pm UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/13 "2025-05-14T13:56:04Z")

</div>

Or, put the script tag in the `<head>` tab and the other piece of code in the JS tab (and import the helpers in there).

---

<div class="post-metadata">

### Author: ![Issa\_George](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/issa_george/32/502509_2.png) [@Issa\_George](https://meta.discourse.org/u/Issa_George)
#### Post date: [May 15, 2025, 2:36am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/14 "2025-05-15T02:36:11Z")

</div>

Thank you. I got it working.

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [June 14, 2025, 2:36am UTC](https://meta.discourse.org/t/problems-with-adding-html-via-theme-component/365656/15 "2025-06-14T02:36:58Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
