Hello, having the side blogs stay sticky

[WebmasterTurkiye]

Hello, having the side blogs remain fixed is common in large forums, and even here, there are gaps when the side blogs run out. Therefore, if you could create sticky blogs for them, they would stay fixed when scrolling through the page and when they run out.

Once the side blogs are fixed, even if the forums section is scrolled, there won't be any gaps there. If you add that as an option, users can choose to use it as they prefer.

[Wayne Luke]

There is currently no way to make the side column stick to the page in the software's options. It would most likely require custom CSS, custom javascript, and maybe some template edits in the screen layout templates. I've never looked into this so those are just educated guesses.

[WebmasterTurkiye]

There is currently no way to make the side column stick to the page in the software's options. It would most likely require custom CSS, custom javascript, and maybe some template edits in the screen layout templates. I've never looked into this so those are just educated guesses.

Indeed, adding such an option would be beneficial, both in terms of usability and appearance.

I am not currently considering migrating to vBulletin 6. I will think about it after implementing a few suggestions I made. Thank you for your response.

[Wayne Luke]

Please create a feature request to have such an option added. https://tracker.vbulletin.com/vbulletin6

[glennrocksvb]

Making the right column sticky requires just a few lines of CSS code without JS.

https://vbmods.rocks/forum/vbulletin-5-modifications/vbulletin-5-template-only-modifications/24422-how-to-make-sticky-headers-for-vbulletin-5-or-any-website-with-just-few-lines-of-css-and-without-js

The original post was for making the module headers sticky but I also post code there for making the right column sticky.

I used this technique on topic pages and in search result pages.

[yilmaz]

Two lines of CSS code.

Just paste it into the css_additional.css template.

.canvas-layout-container .canvas-layout .canvas-widget-list {
    position: sticky;
    top: 0;
}​

[glennrocksvb]

You'll want to only do it on desktop and not on mobile. So just prepend the CSS selector with l-desktop class.

.l-desktop .canvas-layout-container .canvas-layout .canvas-widget-list {
    position: sticky;
    top: 0;
}​​