# Introduce a "highlight topic" feature
**URL:** https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436
**Category:** Feature
**Created:** [November 6, 2021, 2:58pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436 "2021-11-06T14:58:27Z")
**Posts on this page:** 15
**Page:** 1
### Author:  [@tachibanalolo](https://meta.discourse.org/u/tachibanalolo)
#### Post date: [November 6, 2021, 2:58pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/1 "2021-11-06T14:58:27Z")
For those great topic, it seems there is no way to give them an encourage such as highlight their post.
> [@tachibanalolo](#):
>
> 
>
> Something like that. Color and bold the topic title and with a star… just a sample, so that user can know that this topic is highlighted and featrued.
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [November 6, 2021, 3:01pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/2 "2021-11-06T15:01:39Z")
To highlight a topic in the topic list you can **pin** the topic to the top to the list. This is a native Discourse feature.
---
### Author:  [@tachibanalolo](https://meta.discourse.org/u/tachibanalolo)
#### Post date: [November 6, 2021, 3:05pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/3 "2021-11-06T15:05:59Z")
I know that, however in my opinion pin is for rules of this category or something like that. For me I prefer there is a way to highlight some of the topic in list or not pin them.
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [November 6, 2021, 3:09pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/4 "2021-11-06T15:09:28Z")
Can you share a mock-up of how you envision that working?
---
### Author:  [@tachibanalolo](https://meta.discourse.org/u/tachibanalolo)
#### Post date: [November 6, 2021, 3:19pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/5 "2021-11-06T15:19:39Z")
Something like that. Color and bold the topic title and with a star… just a sample, so that user can know that this topic is highlighted and featrued.
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [November 6, 2021, 3:24pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/6 "2021-11-06T15:24:59Z")
Oh cool! You can easily accomplish that with a small theme component. First create a staff tag to denote this “highlight” state, let’s say it’s “highlight”. Then you tag the topics you want to highlight with this tag.
On the theme code you need to style it as you want let’s say:
```css
tr.tag-highlight {
background-color: blue;
font-weight: bold;
border: 3px dotted pink;
}
```
Then it looks like this:
---
### Author:  [@tachibanalolo](https://meta.discourse.org/u/tachibanalolo)
#### Post date: [November 6, 2021, 3:29pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/7 "2021-11-06T15:29:08Z")
I know how to do it in css, that sample is actually working on my discourse. I just want to know is that possible to build in this function in official? I think highlight is a pretty useful function.
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [March 17, 2024, 4:30pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/8 "2024-03-17T16:30:32Z")
This is very cool and works to highlight topics in topic lists, but I also want to highlight the topic itself. It seems that the tag exists on a topic page only for the tag itself.
I tried doing this, which seems like might work, but I’m probably doing it wrong.
```plaintext
.title-wrapper div.has-highlight {
/* Styles for the with the class */
color: blue !important;
font-weight: bold;
}
```
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [March 17, 2024, 5:36pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/9 "2024-03-17T17:36:13Z")
> [@pfaffman](#):
>
> but I also want to highlight the topic itself.
What is “the topic itself” in this context?
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [March 17, 2024, 5:38pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/10 "2024-03-17T17:38:05Z")
On the topic page for topics with the tag, I want to style the topic a different color (or whatever) so that it shows as special not only in the topic lists, but also when you visit the topic page.
---
### Author:  [@Falco](https://meta.discourse.org/u/Falco)
#### Post date: [March 17, 2024, 6:00pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/11 "2024-03-17T18:00:25Z")
Oh you mean the first post in a topic, the OP right?
```css
body.tag-highlight article#post_1 {
background-color: blue;
font-weight: bold;
border: 3px dotted pink;
}
```
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [March 17, 2024, 6:19pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/12 "2024-03-17T18:19:21Z")
That’s great! Now how do I target the TITLE of the topic?
```plaintext
// this targets the tag itself
a[data-tag-name="extra-special-topic"] {
color: yellow !important;
}
// this changes the title on topic-lists
.tag-extra-special-topic .raw-topic-link {
color: blue !important;
}
// This targets the background/body of the OP
body.tag-extra-special-topic article#post_1 {
background-color: blue;
font-weight: bold;
border: 3px dotted pink;
}
```
---
### Author:  [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [March 17, 2024, 8:29pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/13 "2024-03-17T20:29:06Z")
```plaintext
.tag-extra-special-topic #topic-title .fancy-title {
color: papayawhip;
}
```
---
### Author:  [@shawa](https://meta.discourse.org/u/shawa)
#### Post date: [July 2, 2024, 4:18am UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/14 "2024-07-02T04:18:25Z")
My dear friend, have you attempted the approach they suggested? I must confess, their explanation eluded my comprehension. 🤣
---
### Author:  [@Kartoon](https://meta.discourse.org/u/Kartoon)
#### Post date: [July 4, 2024, 2:51pm UTC](https://meta.discourse.org/t/introduce-a-highlight-topic-feature/208436/15 "2024-07-04T14:51:33Z")
> [@shawa](#):
>
> My dear friend, have you attempted the approach they suggested? I must confess, their explanation eluded my comprehension. 🤣
Which part? You just open your theme editor and edit the CSS
> [@pfaffman](#):
>
> > **Summary**
> >
> > ```plaintext
> > // this targets the tag itself
> > a[data-tag-name="extra-special-topic"] {
> > color: yellow !important;
> > }
> >
> > // this changes the title on topic-lists
> > .tag-extra-special-topic .raw-topic-link {
> > color: blue !important;
> > }
> >
> > // This targets the background/body of the OP
> > body.tag-extra-special-topic article#post_1 {
> > background-color: blue;
> > font-weight: bold;
> > border: 3px dotted pink;
> > }
> >
> > ```
This did something weird for me, when I’m in the highlighted topic it then applies to other topics at the bottom in the " New & Unread Topics" list
But if I’m NOT in the topic only the highlighted one is highlighted (as you’d expect)
What’s up with that :lol:?