≑ Menu

Add Images to WordPress Sidebar with No Plugins

WordPress Sidebar ImageAdding images to your sidebar is relatively easy with a few steps. Don’t let the code scare you, just make sure you type in your URLs exactly.

  1. Login to your WordPress Dashboard.
  2. Click on Media>Add New.
  3. Click on Select Files.
  4. Navigate to your image, select it, and click Open.
  5. Give your image a title and alternate text.
  6. Select the URL in the File URL field and copy it.
  7. Click Save all changes.
  8. Click on Appearance>Widgets in the left sidebar.
  9. Drag a Text widget to the sidebar area you want it to display in. The sidebar areas are on the right side.
  10. Click the down arrow next to the Β name of the widget to open it.
  11. Paste in the appropriate text, below, in the larger field and make the substitutions suggested.

    If you just want the image to display:

    <img src="url-you-copied-above" alt="descriptive image keyword">

    If you want the image linked to a page:

    <a href="url-to-the-page-you-want-the-image-linked" title="descriptive url keyword" target="_blank"><img src="url-you-copied-above" alt="descriptive image keyword"></a>

  12. Click Save.
{ 13 comments… add one }
  • Vivek Parmar January 4, 2011, 3:07 pm

    that’s easy, for this you need a basic knowledge of HTML. Another way is to upload the image via dashboard -> Media -> Add new media and from there get the URL of that image and just copy and paste it in sidebar
    Read Vivek Parmar’s inCREDible post…Make Money By Author Advertising WordPress PluginMy Profile

  • Alison Moore Smith January 4, 2011, 4:09 pm

    Hi Vivek. Thanks for dropping by.

    “Easy” is a relative term. πŸ™‚ Many of my clients do not have HTML experience, but they’d like to be able to do things on their own without paying for my time. I’m happy to show them, step by step, how to maintain their blogs as they’d like.

    I always FTP because it’s faster and more reliable, but I think the media library would be easier for many. I’m going to edit the first part of the post to reflect that. Thanks for the feedback.

  • Delena Silverfox January 15, 2011, 7:01 pm

    Where were you when I was struggling with Wordpress? But seriously, this is amazingly helpful! I’ll definitely be back for more help, and maybe finally gather the courage to try blogging at Wordpress again. It’s quite simply the best blog for serious bloggers.

    Delena
    Read Delena Silverfox’s inCREDible post…MicfoMy Profile

  • Alison Moore Smith January 16, 2011, 10:43 pm

    Delena, thanks. πŸ™‚

    The tutorials are fun for me because they basically just answer clients’ questions. I’ve been helped so much by people with coding expertise. It’s really a pay it forward thing.

    Hope you join the WordPress ranks again!

  • Richard February 6, 2011, 8:20 am

    Nice guide. Though, I’d probably add that the ‘target=”_blank”‘ bit can be missed off if you want it to link to a page on your own site (or, indeed, don’t mind people leaving your site).
    Read Richard’s inCREDible post…The difference between Joomla and WordpressMy Profile

  • Alison Moore Smith February 13, 2011, 12:41 am

    Absolutely, Richard. Thanks for adding that important point.

  • fss February 15, 2011, 6:48 pm

    Is there a way to make the related posts random? right now it seems to be bringing up only the latest posts with said tags but i’d like that to always change.

  • Alison Moore Smith February 16, 2011, 1:20 pm

    Yes. If you’re a Win-with-1 client, you already have the Random Posts plugin installed. Just go to Appearance>Widgets and drag the Random Posts plugin to the sidebar you want.

    If you’re not a Win-with-1 client, you can download, install, activate, and place it as you like. Remember that you need Rob Marsh’s Post-Pluing Library to run any of this specific post plugins.

    If you’d like help doing the install, shoot me an email from the contact page. πŸ™‚

  • Andrew Walker May 13, 2011, 8:38 pm

    I think if this tutorial is intended for your clients that have no knowledge of HTML (or minimal), they would need some kind of step-by step picture guide. I always find it helpful when the tutorial has screenshot of every step. I know it’s time consuming but I think that will make your tutorial so much better!
    Read Andrew Walker’s inCREDible post…Infinity Shoes Coupon CodeMy Profile

  • Alison Moore Smith May 16, 2011, 2:47 pm

    Absolutely, Andrew. It’s an opportunity cost issue. When a client need a written explanation of something, I’ll often post it to the blog to help others. This take minimal time β€” generally just formatting β€” and allows me to document the answers and help out some readers.

    This isn’t my main blog β€”Β and blogging here isn’t the primary purpose of this site β€” so I figure the cost/benefit ratio is reasonable. πŸ™‚

    Thanks for stopping by!

  • Kristen October 1, 2011, 5:49 pm

    Thank you so much for the step-by-step – it worked! I used it this morning for my blog (WordPress Twenty Eleven theme) and it could not have been easier. If you’d like to see it in action, visit my blog Pirate Kitchen and see the Bookworm Alert sidebar.
    Read Kristen’s inCREDible post…Fragrant Indian ChickenMy Profile

  • Chris Yaluma April 6, 2012, 3:17 am

    Great, thanks! I have been using a plugin but was way too complicated for me, and now that I found your solution it’s pretty much straight forward and easy to install. Thanks Alison!

  • Alison Moore Smith April 6, 2012, 10:10 am

    So glad it was helpful. Thanks for the feedback, Kristen and Chris. πŸ™‚

Leave a Comment

CommentLuv badge