Help Center - Change design header to match hero image

Hi Sara, you can try with this code,
- remove whole current header code
- paste my code there
- and remove hero section from home page template.

Does it work as needed? 

<section class="section hero">
 <header class="header">
 <div class="logo">
 {{#link 'help_center'}}
 <img src="{{logo_url}}" alt="{{t 'logo'}}">
 {{/link}}
 </div>
 <div class="nav-wrapper">
 <span class="icon-menu"></span>
 <nav class="user-nav" id="user-nav">
 {{link 'community'}}
 {{link 'new_request' class='submit-a-request'}}
 </nav>
 {{user_info}}
 </div>
</header>

 <div class="hero-inner">
 {{search submit=false instant=true class='search search-full'}}
 </div>
</section>

Hi Vladan, thanks for the response and the updated code it helped. There just seems to be a bit of white left on the top that won't seem to go away.

I activated our help center in case you wanted to take a look at the white bit in browser.
https://getbreadcrumbs.zendesk.com/hc/en-us

Glad that it helped! About white space, just put this code at bottom of your CSS. Cheers!

header.header {
 margin-top: 0;
}

Thanks Vladan! That worked like a charm :)

How would I edit the header to show differently in a different page?

Hi Uriel,

It looks like there's been no response from the community regarding your question so I wanted to quickly touch base and provide some documentation that you may find useful: 

• Using themes and templates to customize your Help Center
• Help Center CSS Cookbook
• Help Center Templates Introduction
• Help Center Javascript Cookbook
• Tips for using HTML to customize your Help Center

Additionally, we do have a Professional Services team available that can assist with setting this up at an additional cost.

I hope the above information helps!

Hi - not sure if this is in the right place but how can I change the standard community image (of 2 x people on bicycles) for a different image?

@Peter.barker - Take a look at this article here on how to change out the Community image - https://support.zendesk.com/hc/en-us/articles/206177737#topic_p1r_345_lw

Best of luck!

@... When I made this change it looked great on home page, but on the community it is showing double headers. any suggestions?

Hey Andres, you just need to remove the hero section from the Community topics page as well. 

The same as you did on the Home Page. 

I made this change and it looks great, but how can I make it so that when the user scrolls down, the header remains and the background header color changes white?

Thanks in advance for any help.