Sticky Footer
C
Written by Chris
Updated over a week ago

The purpose of a sticky footer is that it “sticks” to the bottom of the browser window. On a regular site, a visitor would have to scroll to the bottom of the page to see the information and this might take just a bit too long. We are all a bit impatient by nature so offering your site visitors needed information at the reach of their hand, well that’s just awesome!


Sticky footer can be created with the help of some code and entered into page scripts.

It is important to keep in mind, whatever you wish to place as a sticky footer- it has to be a section and placed at the bottom of the page.

Add a section at the bottom of the page that you want to be the sticky footer. You can also head over to our pre made sections and select a Footer category.

Find the ID of the section that you have just added by right clicking on the footer and click “Inspect” / “Inspect Element” and copy the ID of that section.

It will look like this:

Go to the Page Settings (3 dots next to the page name in the left sidebar)

Add a header script, and name it.

Paste the script, with the ID you just copied after the #

<style>
#c1kui79nvr{
position: fixed;
bottom: 0;
}
</style>

🚨 To make sure your sticky footer doesn’t overlap with other content on your page, duplicate the footer once.

You can also try by adding our pre made scarcity footer and design accordingly.

Did this answer your question?