WordPress: Placing images in text widgets

copyright

I have noticed that many new users have difficulty with placing images in text widgets. IMO the easiest way to do this is to create a draft post first, then copy and paste the data into a text widget, and delete the draft post after you see the image display correctly in your sidebar. Prior to trying to insert an image into a text widget I recommend reading these two FAQs entries:
Put an image in your sidebar
Using the text widget
I hope they will provide enough background information so that the walk through below will simply function as a guide.

Walk through – Insert an Image into a text widget

–> New Post –> upload image into the post –> send image to editor –> click the image and position it using icons 7, 8, or 9->  switch to the code tab (HTML) on the visual rich text editor and copy the entire image code to your clipboard –> save the draft post (you can delete it later)

->Appearance –>  Widgets –> drag a text widget out of the available widgets box and drop it into the sidebar box –> open text widget and paste in the image code –> click ‘Save’ then -> click ‘Close’  -> now view your site (it should be there) -> go back delete the draft post.

Walk through – Linking a sidebar graphic to external link:

-> New Post ->  browse for your image and click ‘upload’ (this will take you to a new page) -> select the size (usually ‘thumbnail’)  and click ‘insert into post’. Switch from visual mode in the editor to code (HTML) and your HTML will appear there.

In the first portion of the HTML is the link reference page. You will change this to link to the url for the site you want to link to, instead of the long text so make sure you leave in the image code {img scr} and then copy all of the code with your cursor and save the draft post.

-> Appearance -> Widgets’ and drag a ‘Text’ widget from the Available widgets box and drop it into the sidebar box -> click on the  the ‘text’ widget in the right hand corner and it will open -> paste the code from the draft post you’ve copied in there and click  ‘Save’ and ‘Close’.  Click ‘view your site’ and make sure everything went accordingly and then delete the draft post.

Example: Copyright Notice or License

Here is an example for placing a text widget in your sidebar for displaying a copyright license or notice.

official copyright symbol

You can simply place “Copyright © 20__All Rights Reserved”  in a text widget.

Or you  can register copyright licenses see: creativecommons.org as described here > How to copyright your digital  works and then display these license images in your blog’s sidebars in  a text widget.

Or if you prefer you can create a static page for displaying your copyright and then link to it from “Copyright © 20___ All Rights Reserved ” placed in text widget in your sidebar by following the walk through below.

1. Copy the HTML code or the phrase “”Copyright © 20__ All Rights Reserved “.
2. Dashboard > Appearance > Widgets
3. Drag a Text widget out of the Available widgets box
4. Drop the Text widgets into the Sidebar box
5. Click the top right hand corner of the Text widget to open it.
6. Paste the HTML code or the phrase “”Copyright © 20__ All Rights Reserved “” into the Text widget.
7. Click “Save” and Close” at the bottom of the Text widget.
8. View the front page of your blog and the copyright symbol/notice should be there.

Related posts found in this blog:
8 Hot Widget Tips
Working with wordpress widgets
Copyright basics for bloggers

 

66 thoughts on “WordPress: Placing images in text widgets

  1. Thanks for the workaround.

    I have generated the table with HTML Tablemaker II but, unfortunately, I got a table with blue background and blue borders – no matter if I set white/none background color for the table in HTML Tablemaker. Is there any way to fix the problem? Thanks. My theme is Retro-fitted.

  2. Hi Timethief
    I really found your post helpful but i have got one problem
    My side bar is static and it does not scroll down… I dont know why.
    When i try to add more text images, it just displays the recent one and
    I am getting upset over this. I am using the Ari theme
    Hope to hear from you

  3. When I put an image in the text widget there seems to appear a white border around the image. Any idea what the problem could be?

  4. i know how to add icons in a text widget but i have problems trying to get an icon beside the text widget title like you see in the footer with the twitter, news envelope icons in this link [link redacted] i have tried everything! If you have the answer please let me know. Greatly appreciated!

    • The only way to include and icon ie. an image in a widget title field that’s not coded to accomodate anything other than a title is by CSS editing.

  5. Timethief, you are the best thing that ever happened to wordpress! I spent hours driving myself nuts trying to add an image to a text widget. I stumbled upon your blog and bang, I found what I was looking for. Thank you, thank you, thank you. Your website has been bookmarked. You brought tears to my eyes. Tears of relief that is! Have a nice day

Comments are closed.