# Is it possible to change HTML of header and footer and message details on the forum?

**URL:** https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756
**Category:** Development
**Created:** [7월 25, 2017, 7:45오전 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756 "2017-07-25T07:45:57Z")
**Posts on this page:** 9
**Page:** 1

<div class="post-metadata">

### Author: ![klalex](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/klalex/32/120733_2.png) [@klalex](https://meta.discourse.org/u/klalex)
#### Post date: [7월 25, 2017, 7:45오전 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756/1 "2017-07-25T07:45:57Z")

</div>

Is it possible to change HTML of header and footer and message details on the forum? I have a custom design that need to be implemented and customization features in admin looks very limited. Is it possible to use custom HTML template for header, footer and message thread page? Thanks.

---

<div class="post-metadata">

### Author: ![vinothkannans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/vinothkannans/32/86465_2.png) [@vinothkannans](https://meta.discourse.org/u/vinothkannans)
#### Post date: [7월 25, 2017, 12:14오후 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756/2 "2017-07-25T12:14:03Z")

</div>

> [@Add a custom header with a dropdown menu](https://meta.discourse.org/t/custom-header-with-dropdown-navigation/33451?source_topic_id=33425):
>
> We’ll be implementing a black header with one link that reveals a menu of more links, like this: In Admin \> Customize \> CSS/HTML, create a new customization. Remember that you can have multiple customizations active at the same time, so it’s a good idea to use many of them instead of one giant one for everything. For this custom header, create a new customization called “Header Nav”. To implement this sample nav, we need some CSS, HTML, and javascript to show and hide the d…

---

<div class="post-metadata">

### Author: ![klalex](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/klalex/32/120733_2.png) [@klalex](https://meta.discourse.org/u/klalex)
#### Post date: [7월 25, 2017, 3:40오후 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756/3 "2017-07-25T15:40:44Z")

</div>

I mean how I can change standard template HTML of discourse pages? Not adding extra HTML, CSS. Is it possible?

---

<div class="post-metadata">

### Author: ![HAWK](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hawk/32/86627_2.png) [@HAWK](https://meta.discourse.org/u/HAWK)
#### Post date: [7월 25, 2017, 9:05오후 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756/4 "2017-07-25T21:05:19Z")

</div>

Adding custom HTML/CSS via /admin/customize/themes will essentially ‘change the standard template’.  
You can achieve what you’re trying to do this way – yes.

---

<div class="post-metadata">

### Author: ![Berto](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/berto/32/77084_2.png) [@Berto](https://meta.discourse.org/u/Berto)
#### Post date: [10월 13, 2017, 2:04오전 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756/5 "2017-10-13T02:04:11Z")

</div>

I’m looking to alter the header as well. Is there any way – _preferably_ without using Javascript – to update the top row (inside `<header class="d-header clearfix">` after the `title` class) on desktop?

The Envato solution is unacceptable because they’re wasting a substantial amount of vertical space. We have this huge bar here that’s completely empty on Desktop browsers!

That’d be a great place to put some key links.

---

<div class="post-metadata">

### Author: ![Berto](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/berto/32/77084_2.png) [@Berto](https://meta.discourse.org/u/Berto)
#### Post date: [10월 13, 2017, 5:57오후 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756/6 "2017-10-13T17:57:54Z")

</div>

So here’s my solution unless someone bests it:

1. Add extra HTML to my theme’s “After Header” area for _desktop_, the div in this example is `<div id="custom-header-links" class="enabled">`

2. Run this code in the theme’s “\</head”\> area:

The first area moves it into place when the document is ready. The second section makes it disappear once the user scrolls far enough, so that it doesn’t get in the way of the `extra-info-wrapper` class that pops up in the title.

The timeout helps in my browser to wait just a tad while the `extra-info-wrapper` appears, since it kind of fades in.

Regarding that second part, yes, it’s executing more JS every time we scroll, which sucks.

Would love feedback if this is going to pull CPU down! Doing it on desktop only for now though.

---

<div class="post-metadata">

### Author: ![neil](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/neil/32/102150_2.png) [@neil](https://meta.discourse.org/u/neil)
#### Post date: [10월 13, 2017, 7:02오후 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756/7 "2017-10-13T19:02:08Z")

</div>

> [@Berto](#):
>
> The Envato solution is unacceptable because they’re wasting a substantial amount of vertical space. We have this huge bar here that’s completely empty on Desktop browsers!

It’s pretty full when you’re scrolled down in a topic. The header shows topic title, category, and tags.

---

<div class="post-metadata">

### Author: ![Berto](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/berto/32/77084_2.png) [@Berto](https://meta.discourse.org/u/Berto)
#### Post date: [10월 13, 2017, 7:03오후 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756/8 "2017-10-13T19:03:05Z")

</div>

That’s why my solution is to get rid of the extra custom header stuff when scrolling down. Just working on the best way of doing that.

I’m trying to generate an event when `.extra-info-wrapper` appears and disappears.

---

<div class="post-metadata">

### Author: ![vinothkannans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/vinothkannans/32/86465_2.png) [@vinothkannans](https://meta.discourse.org/u/vinothkannans)
#### Post date: [10월 13, 2017, 7:09오후 UTC](https://meta.discourse.org/t/is-it-possible-to-change-html-of-header-and-footer-and-message-details-on-the-forum/66756/9 "2017-10-13T19:09:38Z")

</div>

@Berto Using css you can easily hide extra custom header when user scrolling down. [Sample](https://cars.vinkas.in) (in Desktop)

I added custom header in ember plugin outlet `above-site-header`. Then using below simple css I am hiding it when scrolling

```css
.d-header {
    top: auto;
}

.docked .d-header {
    top: 0;
}

```