WordPress
Article

10 Minutes to a Better WordPress Sidebar

By Ian Chandler

How often do you think about your sidebar? Probably not often. The sidebar is one of the most overlooked elements of a website, and it’s also one of the most important.

You may not think twice about sidebars, but they help users navigate your site. They can also make your site look nice and streamlined or clunky and unsightly. In short, they can make or break someone’s opinion of your site.

While there are no official rules for what a WordPress sidebar should look like, there are a few design concepts you can keep in mind while designing yours:

  • Keep it minimal. Long sidebars look unwieldy and weigh down the page. No one wants to scroll through a sidebar that’s the length of the page! By trimming down your sidebar to the essentials, you’ll have a much better looking and functioning page.
  • Include the essentials. You want to trim down your sidebar to the essentials, but what’s essential? There are no hard and fast rules, but generally, it’s good to include a short bio, a search bar, and contact information.
  • Accomplish your goals. The sidebar is prime real estate that helps you accomplish your goals. Is your aim to get the reader to join your email list? Use a signup form widget. Do you want the reader to be able to donate to you through PayPal? Throw a donation button at the top of your sidebar.
  • Connect with readers. Sidebars provide an ideal way to concisely communicate your site’s mission to the reader. You can use a short bio to tell the reader what you do, and you can include your contact information (social media network profiles, email, etc.) so readers can instantly connect with you.

    Customizing Your Sidebar: Our 10-Minute Plan

    As a WordPress user, you have a lot of customization options for your sidebar. They’re incredibly easy to do, and in no time, you can have a fully optimized sidebar.

    We’ve put together a 10-minute plan for a better sidebar. This is an easy 5-step plan that you can do on your lunch break or during some spare time in your day. It doesn’t require any heavy development knowledge – in fact, you can do it with just a few clicks and searches. (Of course, you can take longer than 10 minutes, but we’ve designed it to be lightning fast!)

    Before you start, take a screenshot of your sidebar. You’ll use it for comparison after you’re done. Now you’re ready to begin!

    Quick Sprout Sidebar

    Quick Sprout uses their sidebar to place an eye-catching opt-in form.

    Copyblogger sidebar

    Copyblogger optimizes their sidebar with an opt-in form and a section for readers to choose relevant topics.

    The 10 Minute Sidebar Improvement Plan

    1. Declutter Your Sidebar. (1 Minute)

    Most sidebars are set up to automatically display certain elements, like the Meta or Archives widgets. 99% of the time, you won’t need all of these elements. Thankfully, you can quickly and painlessly remove the widgets you don’t need. It’s a simple fix but one that’s easy to miss.

    In your Dashboard, navigate to Appearance and then Widgets. You’ll see a list of all the widgets that are currently displayed in your sidebar. To delete a widget, click on it to show the drop-down menu and select “Delete.” And that’s it!

    2. Download Widgets to Make the Most of Your Sidebar. (3 Minutes)

    This is one of the most important steps to take in order to make your sidebar truly stand out. Think about what you want your sidebar to look like. Want your Twitter feed to show up? The Twitter timeline widget (available through Jetpack) is for you. Need to display your professional headshot? Try the super easy Image Widget.

    This step will take the longest, but it’s crucial. The best place to look is in the WordPress plugin directory, which offers up a smorgasbord of widgets.

    3. Can’t Find a Widget? See If It’s Packaged with a Plugin. (3 Minutes)

    Many plugins include widgets in the package, and often, you may not even know it. For example, the MailChimp for WordPress plugin includes a widget so you can place an email signup form in your sidebar. Jetpack also includes several handy widgets.

    Your widget list (Appearance > Widgets) will show you the full list of all widgets you have available to use, and this includes widgets that came prepackaged with plugins.

    If you’re wondering whether or not a specific plugin has an accompanying widget, you can check the plugin’s info in the plugin directory.

    4. Use Default Widgets to Your Advantage. (2 Minutes)

    Even though we have some fancy widgets now, we can’t forget about these basic ones. WordPress provides you with a host of useful default widgets. While these widgets may not seem like much at first, they can be powerful when used in combination with your downloaded widgets.

    For example, you can use the text widget combined with the Image Widget to show your headshot with an accompanying bio. Or you can create a specific menu and show that menu in the sidebar with the Custom Menu widget. The sky’s the limit here – there are endless combinations, so mess around with it and see what works for you.

    5. Create Your Own Button. (1 Minute)

    Buttons are great for linking readers to another place on your site or another site entirely. You can use it to direct readers to a landing/squeeze page, or you could link it to your online shop.

    To create a button, drag a text widget into your sidebar where you want it. After that, you only need to use some simple code:

    <form>
    
    <input type="button" value="CLICK HERE" onclick="window.location.href='https://www.example.com'" />
    
    </form>
    

    Whatever you define as the button’s value is what the button text will say. And, of course, replace “https://www.example.com” with a link of your choice.

    And there you have it in just ten minutes, you’ve given your sidebar a complete makeover. Compare it to the screenshot you took. Doesn’t that look better?

    Bonus Tip #1: Want More Control? Use a Sidebar Plugin.

    Sometimes, your theme’s sidebar just won’t cut it. Maybe you want a different look or more flexible features.

    Lucky for you, there are tons of amazing sidebar plugins that are absolutely free. Here are a few of our favorites:

There are many more to choose from, so if you’re after a particular feature, chances are you’ll find it.

Bonus Tip #2: Want Advanced Control? Define Your Own Widgets.

If you want even more control over your sidebar, check out our article on defining your own widgets. It walks you through creating static (no code required) and dynamic widgets (code required) for your sidebar.

Ian Chandler
Meet the author
Ian Chandler is a professional writer based in Kent, Ohio, currently studying English at Kent State University. He serves as Editor at Nukeblogger, contributes to Freedom With Writing, and writes for Haircut Inspiration.
  • simon codrington

    Thanks for the article. Great read :)

  • Rutherford Ejimonu

    Lovely i will implement those right away in a wordpress project am currently working on

  • http://www.cygnet-infotech.com/ Hemang Rindani

    WordPress with its extraordinary capabilities is one of the best enterprise web content management services and is rightly above the other efficient web development and management platforms like Sitefinity CMS, Sitecore, Joomla and Drupal because of its flexibility, adaptability, scalability and security. Talking about the sidebars, it is one of the best place to add CTAs and for WP, there are many widgets that can beautify the sidebar and make it relevant to the requirements. Using Custom Sidebar helps to create widgetized areas and choose on which pages they show up. This will minimize lots of efforts related to coding and designing a special page for websites.

  • Mike Ritter

    Brownie points for the form button JavaScript tip!

  • Masterarts

    Great read. Thanks for the effort

  • Masterarts

    Great read. Thanks for the effort

  • Michelle

    Thank you for a great post it has helped me a lot with my widgets!

    However, when I try to use any of the mentioned plugins, my the load time of my site goes up by 2-5 seconds!!!

    That is not acceptable but I would really like some custom sidebar on my site, can you recommend any other plugin that is not slow?

    Thank you again

Recommended

Learn Coding Online
Learn Web Development

Start learning web development and design for free with SitePoint Premium!

Get the latest in WordPress, once a week, for free.