Since I launched this blog, I always looking for great theme for it. Unfortunately at that time I doesn’t know that wordpress.com doesn’t offer custom themes upload, which is understandable since they want to make sure all the themes works good with their wordpress software. There is a plan to shift the blog to wordpress.org, but not at the moment. So instead of changing to self-hosted one, I decided to change a new look to Techie Talkz.
There are several good themes available in wordpress.com, and I believe the number will increase in the near future. After a few round of choosing, I decided to have a go with INove theme. This is a very popular theme used by many self-hosted wordpress blog and just available to everyone in wordpress.com few months back. It looks nice, clean, Mac-ish look, and also has some extra functions exclusive for itself. But it kind of a drawback that it doesn’t natively support custom header image. (Doable but not in a simple way anyway)
But hey, look, my blog used INove theme, and I am using a custom header! I will show you how to place the custom header next, but before that, let us say thank you to the author of INove theme, which make the theme banner-supported, as well as Juan and Raul for posting up the html code for the custom header for INove theme.
How to place the custom header?
First of all, you must be aware that INove theme supports header banner with HTML code supported. If you doesn’t know how to access it, login to your dashboard > Appearance > INove Theme Options. You will see several options for you to activate and look for the option named banner. The blank space is meant for you to input the HTML code, which is one of the important step in placing the custom header.
Design your own header image
However, before the customization, you would want design your own header image. It can be at any size, but I would suggest to follow the size of the original one, which is at 936×90, so it will be a little bit easier to manage, and matches with the HTML code which I will post later. You might want to refer the original header of INove and design you own header from there.
Modify the HTML code
The original HTML code for the custom header can be found in CSSWiz’s blog, but if you build your own header with the suggested size of 936×90, you can refer to my customized code, most likely your image will get aligned and covered the original header. So, paste everything to the blank space at the banner option explored earlier, then replace your own header URL in my code (stated YOUR IMAGE URL HERE). Else if you have the header size other than the suggested one, you might want to play around with the position and padding values to align your custom header. (adjust > save changes > reload your blog to see changes)
Don’t forget to tick those options for ‘Who can see?’. Else you won’t be able to see the banner as well as the changes you have made to the html code.
All thanks to the CSSWiz’s blog for the code, as well as wordpress.com for providing such a nice theme, and not to forget, thanks to the author of INove theme – mg12. Hope you enjoy my blog’s new theme and happy customizing if you are using INove theme as well!