I have made a fixed sidebar for my blog page when scrolling. However, what can I do to make the end of the sidebar stop at the end of the blog content?
https://giant-bicycles.com.sg/blogs/guide
Thanks ahead.
Hello @seantay1993
I would like to give you some recommendations to support you
Please help me by add this code to your theme.liquid above the tag
Hope my recommendation can works and support for you!
Kind & Best regards!
GemPages
Hi @ Seantay1993
This is PageFly - Advanced Page Builder. I would love to give you some recommendations
You can remove fixed and change it by ticky. You can follow my code
-Go to Online Store->Theme->Edit code
-Asset-> theme.css paste the below code at the bottom of the file.
@media screen and (min-width: 900px){
#shopify-section-manual_sidebar {
position: static !important;
}
#shopify-section-manual_sidebar >div{
position:sticky !important;
top:70px
}
body,#nt_wrapper{
overflow:auto !important
}
}
Hope my solution works perfectly for you!
Best regards,
PageFly
This is PageFly - Advanced Page Builder. I would love to give you some recommendations
You can remove the fixed and change it by ticky. You can follow my code
-Go to Online Store->Theme->Edit code
-Asset-> base.css paste the below code at the bottom of the file.
@media screen and (min-width: 900px){
#shopify-section-manual_sidebar {
position: static !important;
}
#shopify-section-manual_sidebar >div{
position:sticky !important;
top:70px
}
body,#nt_wrapper{
overflow:auto !important
}
}
Hope my solution works perfectly for you!
Best regards,
PageFly
Add this code at the bottof of Theme > Edit Code > assets > theme.css file
@media screen and (min-width: 900px){
.blog-column-right #shopify-section-manual_sidebar {
position: sticky !important;
height: fit-content;
top: 0;
}
}
#nt_wrapper {
overflow: unset !important;
}
Try it and let me know