Footer fixed

Hello! Is there any way to make footer fixed through Footer editor? If not - what css class should be made fixed?

Hi There,

We can use this custom CSS to make footer fixed:

  footer.x-colophon {
    position: fixed;
    bottom: 0;
    width: 100%;
    top: auto;
  }

Hope this helps.

1 Like

Ok, thank you a lot!
I think that it would be cool to have this options in Footer editor in the future Pro editions.

By the way, Apex is great! :slight_smile:

Hello Denis,

We certainly appreciate the feedback! This is something we can add to our list of feature requests. This way it can be taken into consideration for future development. All of these items are discussed with our team internally and prioritized based on the amount of interest a particular feature might receive.

Thanks!

Howdy, I need a hand to modify this snippet to accommodate using a fixed left header bar for desktop views and a singular top header bar on mobile. Thusly this snippet works fine on mobile screens but gets pushed over by the with of the fixed left header bar in desktop view.

I assume I would need to specify @media breaks in the css; just dont know the specifics.

Hi @fritolays,

Please provide us with your website URL so we can take a closer look.

Thanks.

To anybody curious…

By default, the page content hides the footer once you implement this code. To make the page content scroll high enough to reveal the footer, add:

.x-main {margin-bottom:200px;}

Replace 200px with the height of your footer and you should be good to go.

Thank you for sharing!

Cheers~