Place Image Links on Tumblr Sidebar

This tumblr tip will show you how to place an Image Link on your Tumblr Sidebar. To do this we need to edit your theme html, just addind some code.

Go To Customize Appereance >> Description Box
Paste the code shown below. Replace PAGEURL with the url you want the image to point to. Replace IMAGEURL with the image direct url path that you want to be linked.

<div>
<a href="PAGEURL"><img src="IMAGEURL"/></a>
</div>

First, make sure to have the images that you want to use as links are uploaded here and grab the url they give your for each picture, this way you make sure they won’t get deleted as they are part of your layout, these must be the right size to fit your tumblr sidebar, otherwise they will “break” the layout. Also try to create the page you want to link to first.
Go to Customize >>> Theme >>> Custom HTML
Now, we must find the exact place where you want your image link to be placed. Use control+F in your tumblr theme html to find something you can see on your sidebar and that you want the link to be placed below or above. Usually there’s a search for, so look for “search”. The whole sidebar section is usually called that same way or maybe something shorter, like “side”. In our example, we are going to place the image link right below our Tumblr Tumbleroll.

Tumblr Image Link

Let’s prepare the code you’ll insert in your layout html; Insert your page URL where it says PAGEURL. Insert your image url where it says IMAGEURL. Do not delete the quotation marks, if you do your image links won’t show up. For each image link you want to add, repeat the line of code starting with <a href…… , always within the <div></div> tags

<div>
<a href="PAGEURL"><img src="IMAGEURL"/></a>
</div>

Copy and paste your code into the sidebar section you initially chose. Again, you must not insert the code within specific <section></section> or <div></div> tags.
If you want to improve the looks of the way the image links are spaced you will have to edit the .css file