Enable Sticky Sidebars
Because this is a sought-after feature, the GP team doesn’t have this option available. However, with the following CSS option, you can enable a sticky sidebar.
1
Click on the COPY button to copy the following CSS code.
@media(min-width: 769px) {
.both-sidebars .site-content {
display: flex;
}
#left-sidebar, #primary, #right-sidebar {
left: unset;
}
#left-sidebar {
order: -1;
}
.inside-left-sidebar, .inside-right-sidebar {
position: -webkit-sticky;
position: sticky;
top: 100px;
}
}2
Then go toAppearance > Customize.
3
Once you click on Customize, you will be taken to your home page and presented with the Customization menu.
Click on Additional CSS.
4
Within Additional CSS, copy and paste the code here.
html {
-webkit-font-smoothing: unset;
-moz-osx-font-smoothing: unset;
}
Final Results
This is what the final results would look with the sticky sidebar on single post.
