Tag Archives: sticky-sidebar

The post What Are “Sticky” Sidebar Widgets in WordPress appeared first on HostGator Blog . A sticky, floating, or fixed, sidebar widget in WordPress is a widget that’s locked into place , so when a user scrolls down the page, it doesn’t disappear. In other words, the information found in the sticky sidebar is accessible at any time . And it’s something all site owners should strongly consider using if they want to direct users to other content, build a bigger email list , and so much more. The sidebar is an important part of any WordPress website . It’s a place for displaying extra information for site visitors, without overwhelming them or disrupting the user experience. Plus, the sidebar gives people an easy way to navigate your site , which boosts engagement and helps increase conversion rates . The problem is, many people don’t take advantage of their WordPress site’s sidebars , especially when it comes to sticky sidebar widgets. That’s why today I’m going to share with you what a sticky sidebar widget is, why it’s beneficial, and how to add one to your WordPress website. So, let’s get started. Why Use a Sticky Sidebar Widget? A sticky sidebar widget is a great way to grab and keep people’s attention once they land on your website. Here are just some of the reasons why sticky sidebar widgets are so helpful: Increased Visibility: since sticky sidebar widgets never disappear, they are always visible. This is great for times you want to ensure site visitors see certain content. Higher Conversions: since floating sidebars are so visible, the chances of people converting are higher. Create calls to action asking people to sign up or make a purchase, and watch your conversion rates increase. More Subscribers: adding a sticky sidebar widget to your WordPress site that lets people subscribe to your email list is a great strategy. After all, email campaigning is the most cost-effective way to market your brand, and is just one of the reasons you should build a bigger email list. Improved User Experience: sticky sidebars give your users a chance to navigate your site with ease. Additional Revenue Streams: whether you sell ad space on your site or are an affiliate marketer, a sticky sidebar used correctly can increase the chances people will see your ad and click on it. According to Smashing Magazine , sticky menus are 22% easier to navigate and 100% of people preferred sticky menus without even knowing why . It’s because of stats like this, as well as the benefits mentioned-above, you should learn how to add a sticky sidebar widget to your site. But first, let’s take a look at some good examples before you get started. Sticky Sidebar Examples Knowing why a sticky sidebar is a good idea and seeing one in action are two totally different things. That’s why we’ve rounded up some of the best sticky sidebar examples around. 1. “Sticky” opt-in form example If you’re looking for a sticky sidebar in action that offers site visitors a simple way to subscribe to a newsletter, hop on over to Young Digital Lab’s guide to starting a blog . Not only does the email opt-in form follow users as they scroll through the post, there’s some very convincing social proof, and a content upgrade up for grabs for anyone that subscribes. 2. “Sticky” navigation example Quora does a great job of improving the usability of their website by adding a sticky sidebar with related questions to their website. Sometimes people need to dig deeper into an issue after seeing some of the answers Quora presents. So, rather than have rephrase their question and hope for better results, Quora provides a list of sticky questions that are sure to relate to the present topic. 3. “Sticky” call-to-action example Website Hosting Rating knows the power a sticky sidebar has on users looking for a great deal. That’s why on the web hosting review pages there is a sticky sidebar that includes a clear CTA button that invites users to click and sign up for hosting. Making the CTA sticky increases the chances people will see the button and click on it. Now, let’s see how to create a sticky sidebar in WordPress using the free Q2W3 Fixed Widget plugin. How to Create a Sticky Sidebar in WordPress Step 1: Install and Activate Q2W3 Fixed Widget Plugin The first thing you’ll need to do is install and activate the free Q2W3 Fixed Widget plugin on your WordPress website. You can do this by going to Plugins > Add New in your WordPress dashboard and searching for “Q2W3 Fixed Widget.” Click Install Now and then Activate . Step 2: Configure Plugin Settings To configure the sticky sidebar widget plugins, go to Appearance > Fixed Widget Options in your WordPress dashboard. Here, you’ll see 3 sections: General Options , Compatibility , and Custom IDs . In these sections, you can configure setting such as: Margins Stop ID Refresh interval Disable width/height You’ll also be able to enable/disable things like: Auto fix widget ID MutationObserver Sticky widget for logged in users only Widget width inheritance jQuery(window).load() hook You can leave the default settings as-is. After you save your changes, be sure to clear your site’s cache, especially if you use a caching plugin ( which you should! ). Step 3: Turn a Widget Sticky To turn any of your current sidebar widgets sticky, start by going to Appearance > Widgets in your WordPress dashboard. Find the widgets you currently have in your site’s sidebars and check the box labeled Fixed Widget on widgets you want to turn sticky. In our example, we’ll turn the search bar and recent posts widgets sticky so people can easily navigate our site without having to scroll away. Click Save Changes and check out a preview of your website. Summary Remember, the easier it is to navigate your website, the bigger your email list, and the more action you can convince people to take on your site, the better. So, leverage the power a sticky sidebar offers and reap the benefits so many website owners are after. Find the post on the HostGator Blog Continue reading →