Create a sticky header

WordPress Sticky headers make your header or menu visible at all times.

To create a sticky header:

1. Open the Header in the Elementor Editor. For details about creating and editing Headers, see Create or edit a Header.
   
2. Select the Header’s parent container by clicking its handle or by clicking it in the Navigator. The Edit Container panel shows on the left.
   
3. Click Advanced. 
   
4. Expand Motion Effects.
   
5. Use the Sticky dropdown menu to select one of the following options:
   
   • None – This removes the sticky header. Do not choose this option if you want to create a sticky header.
   • Top – Choose to stick your header to the top of the screen.
   • Bottom – Do not choose. Not relevant for headers.
6. Under Sticky On, choose the devices on which your section should be sticky. Choose one of the following options: 
   
   • Desktop – Sticky on desktop/laptops.
   • Tablet Portrait – Sticky on tablets.
   • Mobile Portrait – Sticky on mobiles.
7. Set the following: (Displays only if Sticky is set to Top.)
   • Offset – It pushes the sticky element up or down by pixels.
   • Effects Offset – This is the number of pixels the user must scroll before the sticky effect begins.
   • Anchor offset – Set the scroll to the desired position to ensure content is visible under the sticky header.
   • Stay in Column – Toggle to Yes if you want the section to remain in its own column.
8. Click Publish.

Related articles

How to Create A Header & Footer in WordPress + Examples