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:

1. In the Page Builder, click on the Layers button in the top toolbar. In the left-hand side menu you can choose Convertri Pre-made template Layers or click Add New Layer

   

   

2. 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.

   

3. Enter a name for your sticky header layer, then click OK.

   

4. To edit your sticky header, check the checkbox to select it in the Layers

   

To create a sticky header from scratch:

1. 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.

   

   

   

2. 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.)

   

   

3. Add any elements you want to include in your sticky header, and make sure they’re contained within the panel element.

4. In the Layers dialog box, click to enable Visible on start, as well as Unscrollable. If the Layers dialog box is hidden, just click on the Layer menu in top tool bar.

   

Click Save, and Preview. Your page should load and scroll as normal, while your header layer stays fixed to the top of the page.