Tutorial: Add an Image Header on Tumblr (Technique #1 and #2)


Hello Everyone! Want to add a Image Header but just don't know how? There's 2-simple ways to do it.


First we need to make the banner/image we want to use. Using a program like Photoshop, Paint Shop Pro or even Paint will allow us to make the banner. If you don't have any programs to use, you can  make the banner on the following internet pages:

→ Banner Fotor (easy-photo banner maker)
→ Flash Vortex/ (ads-look-alike banner)
Banner Fans

I will try to search for more available banner-maker websites, but till now I have only found those 2 safe websites. The other's activate Tumblr security system.

• Step 2. Once you have your banner using the website or program, we need to "upload" the banner to Tumblr. You can use: Tumblr upload static file or a free image host. If you don't know any here's a few FREE and safe image host you can use:
http://tinypic.com/
http://imageshack.us/
http://www.postimage.org/

• Step 3. Now we have the banner. Let's go add it to  your Tumblr Blog.
○ Log in your Tumblr Account.
○ Find the Customize Theme Settings. If you don't know how visit: Tutorial: Where is the “Customize Theme” Option? (New Tumblr Design!)

• Now here's the important part. There's 2 techniques you can use to Add a Image Header on your Tumblr Blog. Let's start with the simplest one, and if you don't like it, try the second one.

○                 ○                 ○

Technique #1
1. Copy the following code:
 <img src="url" alt="some_text"/>

2. Paste the code below your <head> tag.
3. Change the URL for you banner URL.
4. Click on Update Preview and see how it looks like. If you like it, click on Save then Close.


○                 ○                 ○
                                            
Technique #2

1. Find the following code on your theme:
<div id="title"><a href="/">{Title}</a></div>
(use Control + F to find it faster)
 
2. Replace that code with this one:
<a href="/"><img src="Header_URL">

3. Replace the Header_URL with your banner URL link.
4. Click on Update Preview and if you like how it looks like, click on Save then Close.

Now you have finish and should have Image Header on your Tumblr Blog. Happy Blogging!


Reactions: