How to Create a “Sticky” Floating Sidebar Widget in WordPress
Floating elements that sticks to your screen as you scroll tend to have a higher click through and conversion rate than static objects. This is why many websites make use of floating elements through out their website. We have seen elements like header bar, footer bar, sidebar widget with newsletter optin, etc. In the past we showed you how to create a sticky floating footer bar in WordPress like we are using on WPBeginner. In this article, we will show you how to create a sticky floating sidebar widget in WordPress, so you can make your email newsletter stand out even more.
Note: This works for all type of sidebar widgets, not just your email optins. You can use it for product promotions, popular posts, flickr photos, google calendar, and basically anything else that you like.
Video Tutorial
If you don’t like the video or need more instructions, then continue reading.
First thing you need to do is install and activate the Q2W3 Fixed Widget (Sticky Widget) plugin. After activating the plugin, go to Appearance » Widgets and click on the widget that you want to make sticky. The plugin adds a Fixed Widget option in all of your widgets. Check the Fixed widget box and save changes. Go to your live site and scroll down. Your fixed widget will now be a sticky floating widget.
Sticky Widget plugin comes with options to configure the positioning of the fixed widgets. Go to Appearance » Fixed Widget Options to configure the plugin. On this page you can set the margins, add your own HTML IDs and even disable the fixed widgets on phone and tablets.
Sticky floating sidebar widgets can be used to boost sign ups, showcase content, and increase overall user loyalty. You can have multiple fixed widgets in a sidebar. However, these could easily get annoying and can have an adverse affect too. Keep a balance in your design, so you don’t frustrate your users.
We hope that this article helped you implement a sticky floating sidebar widget in your WordPress website. You can put a sticky footer bar, a sticky top navigation, and a sidebar widget. Which one would you rather use on your website? Let us know in your comments below.
