If you've seen our new one-click demo site, Intranet, you may be wondering how we moved the Search bar out of the toolbar and into the header. (Much like we did on our own site above; yep, you're looking at Confluence... plus Zen, of course.)
- You'll need to enable the Brand Designer as this is a brand customization. Enabling the Brand Designer »
- In the Brand Designer, select "Search" in the left hand column.
- Under the header "Move Search Box" you should see an element selector input field. What you put here depends upon your brand and how it's constructed, but a good place to start is to enter: #header (This actually repositions SEARCH out of the toolbar and associates it with the header div in your site structure.)
- Now, use position top and position right, as well as width, border, and border radius to get just the look and placement you are after.
MORE STYLING OPTIONS Scrolling further down in the panel you'll see options to style the input text and background as well, though Zen will use the in-toolbar search settings if those are already in place.
Want a search field image like Intranet?
Create and upload an image, and select it with image dropdown. Then set image position. (standard CSS background positioning.)