How to Make Any Sidebar Widget “Sticky” In WordPress

Make WordPress Sidebar Widget Sticky

A sidebar is an essential part of a blog. But most of the time it remains unnoticed.

People come to your blog to read the content. They open the post, scroll and read the content. By the time they are at the bottom of the post, they no longer can see the sidebar. It’s out of their screen.

And your sidebar doesn’t get noticed. It happened to me. But I was able to fix it by using “Sticky Widget” plugin.

The idea is to make any sidebar widget sticky that floats next to the content as the user scrolls down. It’s not possible to make every widget sticky. What you can do is make the most important widget sticky. For example, if you want more subscribers than make your ‘Subscription Form’ sticky.

Q2W3 Fixed Widget is the WordPress plugin that allows you to add floating sidebar widget in WordPress. In this post, I will show you how to make any sidebar widget “Sticky” in WordPress. Before moving to the tutorial, I’d like to give some ideas on how you can use the plugin.

  • You can make “Affiliate Banner” sticky to increase affiliate sale.
  • You can make ‘Adsense Ads’ sticky to increase CTR.
  • You can make ‘Subscription Form’ sticky to get more subscribers.
  • You can make “Like Box” sticky to get more likes.
  • You can make “Popular Posts” widget sticky to decrease bounce rate.
  • You can make anything sticky that benefits you.

Sticky Widget will double your conversion rates. Let’s see how to set up the sticky widget.

How to Make Sidebar Widget “Sticky” in WordPress

At first, you need to install the Q2W3 Fixed Widget plugin. (Read: How to Install a Plugin)

Once you’ve activated the plugin, go to WordPress Admin Panel > Appearance > Widgets. Then click on the widget that you want to make sticky. You will notice “Fixed widget” option there. Just check the box and click on “Save.”

WordPress Sticky Widget

Now go to your site and scroll down. The sticky widget will be scrolling with you.

Sticky Widget Plugin also allows you to configure the position of the fixed widget. Go to Appearance > Fixed Widget Options and set the margin top and margin-bottom.

  • Margin Top: This property defines the vertical distance from the top border edge of an element to the edge of its containing block. You have to optimize margin-bottom properly to prevent widget overlapping with the footer.
  • Margin Bottom: This property defines the vertical distance from the bottom border edge of the element concerned to the edge of its containing block.

Fixed Widget Options

You can go with default settings for other options.

You can make multiple widgets sticky by using the plugin. But make sure your sidebar is not annoying. I prefer making one widget sticky.

[thrive_text_block color=”note” headline=””] Tip: Another WordPress plugin I am using with Sticky Widget is Thrive Clever Widget. It allows me to add relevant widgets to the relevant posts/pages. It’s better to show highly relevant widget content on sidebar rather than showing the same widget on every blog post. It converts like crazy. Check this plugin here [/thrive_text_block]

A Q2W3 Fixed Widget Alternative

A lot of people complain that Q2W3 Fixed Widget is not working on their WordPress site. If you are one of them, here is an alternative for you.

Theia Sticky Sidebar for WordPress is another plugin that allows you to make existing sidebar sticky and keep it permanently visible. It’s compatible with all WordPress themes. It’s a premium plugin that will cost $18 of you. I’ve not used the plugin on my blog. But I think it will work for you. This plugin is rated 4.26 out of 5 stars.

Theia Sticky Sidebar

[thrive_link color=’blue’ link=’https://roadtoblogging.com/go/sticky-sidebar/’ target=’_blank’ size=’medium’ align=’aligncenter’]More Details[/thrive_link]

I hope this post helped you add a floating sidebar widget in your WordPress blog. Do let us know if you find any issues while using the plugin. If you find this post helpful, please help me by sharing this post on Facebook, Twitter or Google+.

  • Raaj Trambadia says:

    Helpful. Thank you Istiak. Have started using the plugin on MyBlogIsMyMoney.Com – lets see if it works out well? :)

    BTW, take part in our giveaway!

    • Istiak Rayhan says:

      Let me know it works or not.

  • Raplus says:

    This is a great plugin. I also use this plugin for my blog.

  • That’s a cool tips Rayhan! I was thinking for couple of weeks to do this but couldn’t find a plugin for that. I am gonna surely apply it soon. Using it with adsense seems more appealing. However is it compatible with Adsense policy to stick ads?

    • Istiak Rayhan says:

      Glad to know that you find this post useful. On the Adsense issue,I think it won’t be a problem. I noticed that 9gag.com sticks Adsense ads in their sidebar.

  • Hi Istiak,

    This looks like a great plugin that will benefit everyone that uses it.

    You make a good point that as our readers get to the end of our posts they no longer see our sidebars so this is really going to help.

    Thanks for the detailed explanation of how to set it up :)

    Have a great week my friend,
    Barry

  • Amol @ ConnectAmol says:

    That’s really a great tips Istiak, Thanks for sharing. I think I should apply this on my blog. let’s how it will be helpful to me.

  • Khaja moin says:

    Never heard about this plugin, thanks Istiak for sharing.

    Will definitely try out.
    ~@Khajamoin1

  • Okto says:

    Thanks Istiyak.

    This method absolutely useful for monetizing blog. And glad you share it here

  • rakesh kumar says:

    That’s a great widget. Thanks for sharing with us.

  • Randy says:

    I tried this plugin, and it works great. Unfortunately if it use it on my left sidebar then it rolls down over my content on mobile devices :(

    Anybody know how to fix?

    • Istiak Rayhan says:

      Hey Randy, Sorry to hear that this plugin messed over your content on mobile devices. I think it’s a better idea to submit your problem to the developer’s support page of this plugin. Here is the support page: http://wordpress.org/support/plugin/q2w3-fixed-widget
      Hope they will solve your problem.

    • Max Bond says:

      Hi!
      I am the developer of the Sticky Widget plugin. Found this post in Google )

      One thing to note. The last version (2.1) has new option for disabling plugin on mobile devices. You may try it again )

      • Istiak Rayhan says:

        Hey Max,
        Thanks for the update. I have added the information in the post.

  • isaac says:

    Hey thanks for this article it was very help full , i got my Sticky Sidebar jejeje

  • Akshay Dalal says:

    That was a good! Do you have any plugin for Blogger?

    • Istiak Rayhan says:

      Blogger doesn’t have the option to use plugin. But you can do it via coding.

  • Taimoor says:

    Hello bro, I have tried this plugin but it is not working on my blog. I have latest wordpress and I think it’s compatible with it. But even after selecting a widget to get fixed, it is not displaying that widget after scrolling.

  • Thanh Tuan says:

    it is not working on my blog

    • Istiak Rayhan says:

      Did you try this with different widget? Sometimes it doesn’t work with some widgets.

  • Sreejesh says:

    Thats awesome, very useful to show ads or some banners.

    I’m going to use this and put a text a text: Wherever you scroll I’m with you :P

  • Janmejai says:

    ok it works but the problem is that the widget which has been fixed start scrolling as i move down from it i want that the widget which has been fixed should start scrolling when all the other widget have been over.
    to overcome this i have to keep the fixed widget in the end.

    • Istiak Rayhan says:

      Hey Janmejai, You got it. You have to fix last widget of your sidebar to stop overlapping.

  • Sai sandeep says:

    Hey Rayhan that was an useful post. I had seen some sticky widgets in some blogs, But using this make any conflicts ?

    • Istiak Rayhan says:

      No, it won’t make any conflict. It is always better to make last widget sticky on your sidebar.

  • Iulian Grigorescu says:

    This quite a helpful plugin, but i think we can get the same effect only with CSS.

  • munna says:

    It is confirmed that if you use adsense code and fix its position to draw unnatural attension can lead us to trouble. I read it from adsense product forum. Can you confirm me please if it is safe or not?

    • Istiak Rayhan says:

      Yeah, it’s safe. Actually I noticed that 9gag.com sticks Adsense on its sidebar.

  • Hi,

    Thank you for this plugin. But I was looking for a way to do this without a plugin.

    Thank you

    • Istiak Rayhan says:

      Actually I am not a coding pro. I won’t be able to help you on that.

  • anwar says:

    Very well written Istiak vai. Everyday I learn a lot from your site. You write really good. I was looking for this tricks. I will apply now in my site. again Thanks a lot.

  • RubioG says:

    Very useful, but I’m trying to find another way to get the same effect but just by code, not with plugin. Thanks for your help!

  • Anuj Dawar says:

    How to hide or display any sidebar widget?

  • damiroquai says:

    There is another alternative plugin called myStickysidebar, difference is that myStickysidebar will use the whole widget area instead of one widget… https://wordpress.org/plugins/mystickysidebar/

  • John Smith says:

    Thanks for this post. I always saw sticky sidebar on websites but never knew how to make it. Thanks once again.

  • Ratan says:

    Istiak Brother, Is there any way to make sticky sidebar without a plugin? Please let me know.

    • Istiak Rayhan says:

      There might be some other ways. But I am not aware of those ways.