Hey there! Some links on this page are affiliate links which means that, if you choose to make a purchase, I may earn a small commission at no extra cost to you. I greatly appreciate your support!

Sticky Sidebar CSS Without a Plugin Use Custom CSS Only

Sticky Sidebar CSS

Learn how to demonstrate free sticky sidebar CSS on your website without using any third-party plugin?

What is a Sticky Sidebar?

A sticky sidebar is a simply fixed widget on your WordPress website. When a user scrolls down or bottoms to your website that particular widget does not scroll up. The sidebar is an important part of any WordPress website.

Custom Sticky Sidebar CSS

I have used Sticky sidebar CSS on my website. You can copy this same CSS code and paste it into your WordPress customizer.

@media (min-width: 769px) {
 .site-content {
 display: flex;
.inside-right-sidebar {
 height: 100%;
.inside-right-sidebar aside:last-child {
 position: -webkit-sticky;
 position: sticky;
 top: 50px;


Sticky Sidebar By Using Third-party plugin

Go to Your WordPress Dashboard
Click On Plugins
Add New
Search For>WP Sticky Sidebar – Floating Sidebar On Scroll for Any Theme

Or you can directly download this plugin and upload to your WordPress website without any issue.

Sticky Sidebar Pluign

Syed Saadullah

I am Saad. I run this blog and work for Syntax Software House. I build Super fast WordPress sites. Do you have a question in mind?connect with me at Twitter

Leave a Comment