Replacing the Text Header for an Image Header on Tumblr
Another Tumblr Tip that according to the theme, it could be just easier or difficult to tweak. If you want your Text Header (meaning your Tumblr name or main Title) to be replaced for an Image, keeping the image clickable, follow these steps:
Replacing The Text Header for an Image Header on Tumblr.
- First of all, you need to put an image that fits the size of you current Text Header, if you want to make the space bigger, you will have to download and edit the .css file of your tumblr theme. I suppose you don’t want to go through all that now, so just choose an image of the right size and if your theme goes crazy, choose something smaller until it works.
- Go to Customize >>> Theme >>> Use Custom HTML
- Using control+F in your browser look for the following code to find your text header title
- Upload your image here , it’s important to upload your logo header here and nowhere else since you guarantee that is not going to be disappear overnight.
- Replace <a href=”/”>{Title}</a> with the following code <a href=”"><img src=”your_image_url” /></a> . Now paste and replace the image path url that you got from the uploader in your_image_url.
- Preview your theme clicking on preview in the edition window, if the image fits right, click on save and you are done.
<div id=”title”><a href=”/”>{Title}</a></div>
Additional Tumblr Tips for your Image Header.
- Most of the well coded themes have a conditional variable that allows you to leave the image url path in the inlice css code try to find it looking for the following code in your html:
<meta name=”image:Logo” content=”"/>
Now place the image url path within the content tag, between the “”. Example > content=”http://static.tumblr.com/image_header.png”
- Most of the well coded themes now have an option to upload the image header through a form. You can find it going to Customize >>> Appereance >>> Logo Image.


One Response to "Replacing the Text Header for an Image Header on Tumblr"
Add Comment