Documentation's navigation


On this page



What is a header?

The header is an element on the very top of every intranet page. The header contains elements such as your logo, quick search and quick links to all Linchpin apps. It's accessible from every intranet page.

It's placed above the navigation and contains a custom background image (or color), a logo and several buttons. You can also create new pages from within the header.

Some elements, like the logo, will also be displayed on the login screen.




Customization

You can customize your header to fit your needs. See the available customizations below.


How to access the header configuration

Navigate to Confluence administration > Linchpin Theme > Configuration > Header.


Customization options

Logo and intranet name

Upload your own logo and display your Linchpin intranet name here. Both elements become clickable links to your dashboard.


Requirements
The logo can be uploaded in the JPG or PNG format. Allowed maximum size: 560 x 140 pixels.


Position
You can display your logo and intranet name on the left or the right side of the header. 

Left position
The logo and the intranet name appear on the left side of the header. The user menu and the search field appear to the right.

Right position
The logo and the intranet name appear on the right side of the header. The user menu and the search field appear on the left.


Intranet name color and size
Color can be set with the help of our built-in color picker or a hex value. Intranet name size refers to the font size. Choose between 15 and 100 (pixels).



Header layout

Choose a background color for your header or upload a background image. Select a color for your navigation.


Height
Choose the height of the header. You can choose a value between 80 pixels and 140 pixels. Be aware that your uploaded logo will scale accordingly.


Background color
This will be the color of your header if you don't have a header background image. Input a hex value or use the built-in color picker.


Header background image
Upload a background image for your header. It will replace the background color. Decide if the background image is displayed only on your dashboard, or on all intranet pages.

Requirements
Can be uploaded in JPG or PNG format. Allowed maximum size: 3000 x 181 pixels.


Tips for Designers

Since the displayed width depends very individually on the actual screen resolution or browser size of the respective user, the image must be designed in such a way that it looks good dynamically at both a minimum and a maximum browser width.


However, if the navigation menu bar is also displayed, which is usually 41 pixels high, the image is also placed below this navigation menu bar, so that the image can also shine through the background color of the menu bar if its opacity is reduced.

For this case, the height of the image should ideally be max. 181 pixels (140+41) and the menu bar should be considered in the image design.




Header icons

Customize the color of your icons and notifications. Select preferred icons for the "Create" button and the search bar.


Color used for header icons
Your header icons will be displayed in the color you select here.


Color used for notifications
Select a color for the notification count. 



Search and create

Customize the look of your search and create buttons.


Choose a "Create" button type

The single ( + ) button  will always open the creation wizard. There you can choose what type of page you wish to create. You can also choose the space, in which your page should be published.

The double Create button  has two functions. 

Click on "Create" to quickly create a blank page in the space you are currently in.

Click on the "three points" button to open the advanced creation wizard.


Choose a "search input" button type

The smaller button  will open the search in a sidebar.

The bigger search button with an input field is a quick search. You can type in what you are looking for directly into the field.







Make sure that your theme is active

Please note: Make sure that Linchpin Theme is active.

Visit our documentation on how to activate your theme to learn more.



This page was last edited on 09/29/2023.