This article contains the old instructions for adding a Sticky Bar to your page via code. If you have been using this version, we encourage you to switch to the native Sticky Bar: https://d.pr/UgR1bo
To do that, you will need to remove all of the code mentioned in this article from your page. If the code is not removed, a conflict will occur and the feature will not work. Please make sure to double-check that all the locations where the code was added.
In order to transform the top page block into a sticky header or the bottom block into a sticky footer that stays in place when you scroll down the page, you would just need to add in this code on your page.
1. Sticky header
Add the following JavaScript code in the Page settings > JavaScript menu of your page, in the Footer section:
Then add the following CSS styles in the Page settings > HTML/CSS - Head:
2. Sticky footer
Add the following JavaScript code in the Page settings > JavaScript menu of your page in the Footer section:
Then add the following CSS styles in the Page settings > HTML/CSS > Head:
Note: Do not add buttons that activate a pop-up in the blocks that will be a sticky header or footer.
In case you need help with a custom functionality or any code customization that is not provided through our Help Center articles we have a Professional Services team that can help our Convert users. The Convert plan includes Professional Services as well as additional features and services that can be seen here: https://instapage.com/convert-benefits