Make header sticky on specific page (7.1)

Site URL: https://pelican-chiton-xwy4.squarespace.com/shop/fos-classic

Hello,

I'd like my header / top nav to remain sticky on scroll only for my Product pages (this page #item-5dfb3eba5179d73d7b6fa175 for example).

Is there an easy way to do that using custom CSS?

thanks

Add to page Settings > Advanced > Header

<style>
  header#header {
    position: fixed !important;
    z-index: 999;
    background: #fff !important;
}
</style>

Can you help me in making header like that website https://pulitzerarts.org/

@tuanphan

On 2/18/2023 at 3:55 AM, Lalat said:

@tuanphan

You mean

• Add a slideshow above header
• When scroll down, sticky header to top

Is that right? What is your site url?