Usage in three ways:
- You want an image on one of your pages that followers can click on
- You want an image widget
- You want to use a text widget to create a clickable image
The first option let you do that easily when you upload the image. Through the media feature in your dashboard, when you upload an image, you can set your image such that it will link to a certain other page. Look for:
ATTACHMENT DISPLAY SETTINGS
See link to and choose custom url to implement your link (url).
The second option is in the appearance and then widgets area of your dashboard. You just drag an image widget to the available areas to place a widget, and where you want it to show up on your site, and fill out the fields. See image what goes where:
If you for some reason don’t want to use the image widget, but need a text widget to put all your items for the site bar, then you need html coding. That’s easier than it may sound.
The following code’s needed to edit. If you do that in the proper manner, you’ll have a clickable image after.
The code is based on three elements. The ‘a href’ tag, an “img id” tag and the “src” tag, in this order.
Here under you see an example of one of the image html codes in the text widget I use.
<a href=”https://mirjampenning.wordpress.com/2014/04/29/challenge”″ target=”_blank”><img id=”acpic.png” class=”aligncenter” src=”https://mirjampenning.files.wordpress.com/2014/05/acpic.png”″ alt=”” width=”273″ height=”65″ align=”BOTTOM” border=”0″ /></a>
Explanation of this html code
<a href=”here goes the url where the image must lead to when clicked on”><img id=”name of the image” src=”the file url of the image” alt=”” /></a>
Where to find the image file url? Where to find the name of the image? See example of image widget above, where I explain that.
What about target in the coding? If you want the url to open in a new window, you use target. It’s always target=”_blank” and it always is in the a href tag, like my example.
What about class? The class defines if your image will be left placed, centered or right placed. You always have three options: Alignleft, aligncenter, alignright.
What about alt? Don’t fill in anything there. Let it stay as in the example: alt=””
What about width and height? That will be the size of your image. If you don’t use that in your coding, then the image shown will have the size of the original uploaded image.