On most websites, the header is where the main navigation menu lies. Making it be sticky makes it easier for visitors to jump between main pages within the website without having to back and forth to the top. Monstroid2 allows you to effortlessly create a sticky header thanks to the JetBlocks add-on. JetBlocks is one of the premium Elementor add-ons offered by Monstroid2, other than JetElements, JetPopup, and so on. This add-on adds a new setting option to add a sticky effect to a section in Elementor.
Doesn’t Elementor already have this feature?
Correct. However, the feature to add a sticky effect is only available on Elementor Pro. With JetBlocks, you can add a sticky effect to a section on your Elementor Free.
How to create a sticky header on Monstroid2
You need to edit the active header template on your website to add a sticky effect to it. Go to Monstroid2 -> My Library, hover your mouse over the active header template and click the Edit with Elementor link to edit the header template with Elementor.
Before adding a sticky effect, figure out how many sections used by the header using the Elementor’s Navigator feature. Select a section you want to add the sticky effect to by clicking it.
Go to the left panel and open the Advanced tab. Under Jet Sticky, enable the Sticky Section option.
As you can see, there are several extra options you can set after activating the Sticky Section option. By default, the sticky effect is applied to all devices (desktop, tablet, and smartphone). To disable the sticky effect on a certain device type, simply remove the device from the field. You can also set a different background color for the sticky effect, set the margin, padding, box shadow, and transition.
Repeat the steps above to other sections if your active header template consists of more than one section. Don’t forget to update the template to apply the sticky effect you have just set.