How to Create a Sticky Header
Sticky headers are great for attention bars, menus, or messages you want to keep in your audience’s view. You can create one from scratch, or add a sticky header from a pre-made template.
To create a sticky header from a template:
- In the Page Builder, click the Layers button in the top toolbar. Click Add New Layer, then choose Convertri Layers in the left-hand menu.
- Click Headers, and choose your sticky header template. Select if you want the layer to start out visible, and if it's visible on mobile.
- Click Add. Enter a name for your sticky header layer, then click OK.
- To edit your sticky header, click to select it in the Layers
To create a sticky header from scratch:
- In the Page Builder, click the Layers button in the top toolbar. Click Add New Layer, then choose New Blank Layer. Give your layer a name, and click OK. Click the Select checkbox to edit it.
- From the Elements Panel, drag a panel element onto the canvas. Click Full Width in the Quick Access toolbar, make it smaller by dragging the handles, and position it at the top of your page. (You can also change the panel color by selecting the panel, and clicking Background in the Properties panel.)
- Add any elements you want to include in your sticky header, and make sure they’re contained within the panel element.
- In the Layers panel, click to enable Visible on start, as well as Unscrollable.
Click Save, and Preview. Your page should load and scroll as normal, while your header layer stays fixed to the top of the page.