Site logo

Archived topic

How to make a Sidebar created with GP Elements, to be sticky

5 replies · Started by Miguel on July 4, 2021

Viewing posts 1–6 of 6

Hi GP Team,

I have created a Sidebar using the GP Premium --> Elements --> Element Type --> Right Sidebar. And I want to make it Sticky.

I have tried with several "CSS" code snippets I have found here in the forum like the one below, but none of them are working for me:

@media(min-width: 769px) {
.inside-right-sidebar {
height: 100%;
}
.make_sticky {
position: -webkit-sticky;
position: sticky;
top: 60px;
}
}

Thanks for your help!

Hi Miguel,

Can you link us to the site in question to check? To inspect if the CSS is properly applying.

You can use the private information text field to provide the link. Thank you.

Hi Elvin,

Of course, is a Testing website, here the link --> https://playwp.xyz/hola-mundo/

Active Theme & Plugins:
1 - GeneratePress 3.0.3
2 - GP Premium 2.0.2
3 - GenerateBlocks (Free) 1.3.3

Currently I have this code added in the Customizer -> Additional CSS

@media(min-width: 769px) {
.inside-right-sidebar {
height: 100%;
}
.make_sticky {
position: -webkit-sticky;
position: sticky;
top: 60px;
}
}

I don't see any elements w/ make_sticky class. https://share.getcloudapp.com/P8u9XQyP

This means there's no element using the CSS you've set.

Make sure you've assigned a class selector on the container block you've added through the Block element. :D

Hi Elvin,

I'm a CSS beginner, so I was Not aware of the class name thing and how this name is used inside a CSS code snippet. But I think I figured it out. I replaced the name "make_sticky" with the name "gb-container" and now the Sticky property is working.

Thank you for your help!

Glad you got it working. No problem. :D

This archived topic is closed to new replies.