Hide banner on particular confluence page?

[Therese Lalor]

In my space, I have configured the Documentation theme to include a banner at the top of each page.

However, I do not want the banner to appear on the home page. I found some code which I have been using to hide the sidebar on the home page (see below)

<script>
  var selectors = ['#splitter-sidebar','.vsplitbar', '#splitter-button', 'header-menu-bar']; 
  AJS.$.each(selectors, function(){ 
    AJS.$(''+this).hide(); 
  });
  AJS.$('#splitter-content').css({'width':'100%', 'left':'0'});
</script>

I was hoping to modify this code to also hide the banner. However, I can not find the selector name for the banner anywhere.

Does anyone know what the selector name is?

[Davin Studer · Accepted solution]

I believe this is what you want. Any modern browser these days has a developer tools feature. This is super hand for figuring out stuff like this. Do some googling on debugging css with developer tools.

#theme-header {
    display: none;
}

[Davin Studer]

Does this css work for you?

[Therese Lalor]

I just tested it and it worked! Brilliant. Thanks so much

[Alejandro Conde Carrillo]

May be you could use the html macro to add some CSS to the page and hide banner.

[Therese Lalor]

That is exactly my intention.This issue is that without knowing the selector /variable name for the banner, I can't tell it what to hide!

Essentially I have the code to say "hide X", but I can't figure out what X is.