Earlier this month DIY Themes released a beta version of Thesis 1.8. It took me a while to get around to writing a post about it as it’s been a busy month. Anyway, here goes.
Probably one of the best new features that has been added to this version of Thesis is the header image uploader. Certainly one of the more popular posts on this blog is the one about adding a custom header to Thesis. This is a question that gets asked over and over and it’s been pretty easy to implement, bu this new header image uploader just makes it so much easier and quicker.
Thesis Header Image Uploader
Here’s how it works:
In the Thesis options you will now see a new item called “Header Image”. All you do is click that and you’re taken to a screen that looks like this:
Here you simply upload your header image. It will recommend the optimal image width which you should ideally stick to. If it’s larger, the system will resize it automatically. After you upload the image, you’ll see the image on the page with a link at the top left to remove it if you’d like.
And that’s it. Kablammo. Your header image get’s loaded to your site, and what’s nice too is that the image is also clickable linking back to your home page.
What else is new in Thesis 1.8
As of this writing, the final release of Thesis 1.8 is not out yet. However, looking at the Beta version, some of the other updates in Thesis 1.8 include customizable category and tag pages, WordPress nav menu support, SEO character counters and more. The SEO character counters are actually pretty cool.
As you can see, the counter totals the number of characters in your meta tags as you type and recommends an optimal length for the title and description. Nice little touch there. Don’t forget to leave your comments below.
Was this post helpful? Consider subscribing to my blog via RSS or
Julie @SavvyEats (9)
Ammar Ali (7)
Kulwant Nagi (7)
Amandeep Singh (6)
anandy (6)
Jim (6)
Dave (5)
{ 43 comments… read them below or add one }
Thesis could really use a simple way to add the Category Menus. It’s annoying to difficult to implement iframes on Posts to extend across column formats, whereas on Pages it’s quite simple… just turn the columns off. So much of thesis is based on Pages while so much of blogging is based on posts. Joomla on the other hand makes it super easy with their content wrapper feature built into the source code. Joomla’s weakness is horrible core support for commenting.
IMIQ recently posted..Commission Junction Glossary
I just downloaded thesis 1.8 yesterday. I’m really excited to start using it. I was using 1.7 for some of my other sites and found it easy enough to use. When I got the e-mail announcement from Thesis, they basically said it’s still very new, and they might have to work out a few kinks. The header image option is a big help for me, becuase I’m not great with code. Thanks for the post!
I’ve installed 1.8 and used the header uploader. However, it is not clickable back to my homepage. Any idea what’s wrong?
Urvashee, it happened to me also. I figured out I had to have “Show site name in header” selected under Display Options for it to be clickable.
Wow. That was an incredibly stupidly easy fix to my long time problem. Thank you so much Computer Gal!!!!
I’ve had thesis for a while, but am just getting around to updating. I’m not much of a pro, so I sort of rigged it before to add a header. It looks like it’s a ton easier now!
Indianapolis Real Estate recently posted..Central Indiana Real Estate Market – July 2010
I can’t get my title and description to show in the header for some reason … any suggestions? I have them selected in display options. I know most folks don’t want it to show, but I guess I’m the opposite …
Thanks,
Scott
Self Improvement Guy recently posted..Best Multivitamin for Men and Women
Looks like you have it figured out. I had a look at your site and I see your title and description.
Thanks for the reply. Actually, that’s because I went back to the default with no header image. What I cannot seem to do is have my title and description show within the header graphic that I uploaded, even though the boxes are checked in the display (header) options …
Self Improvement Guy recently posted..Best Multivitamin for Men and Women
There are a couple ways to do this. I’d recommend that you don’t upload your header using the Thesis header uploader. Instead, use the ‘preferred method’ explained in this post on how to add a header image in Thesis. But remove any line that has a negative text-indent property. That will add the image and also leave the title and tagline in place.
Thanks again. The method in your post worked well, but I’ll need to play with the header alignment and the tagline was positioned under the header image – any thoughts on that? I used your “updated” code …
Best,
Scott
Self Improvement Guy recently posted..Best Multivitamin for Men and Women
Yes, you’re right here. Because we set a height on the logo div as well as the anchor tag in order to make it clickable, the tagline is pushed below the header because it sits outside of the logo div in the markup. Just off the top of my head, the quickest and easiest way to resolve this without losing the ability to click the header is to absolutely position the tagline element. Here’s the code you’d use in the custom.css file:
.custom #header { position:relative; } .custom #tagline { position:absolute; left:20px; top:75px; } /* change these values to position correctly in your header */Will do. Thanks again for all your assistance! Much appreciated …
Best to you,
Scott
Self Improvement Guy recently posted..Best Multivitamin for Men and Women
Hi – I can’t get an image to upload properly. I want a small image to appear to the left of the title and caption. Not below or above it, but in line with it. Can you help at all? Thanks!
What you’re describing doesn’t seem to have anything to do with uploading a header image. As to the problem you’re having with uploading, you will have to be more specific. If you’re looking to add an image to the left of the title you need to use the thesis_hook_before_headline hook and float the image to the left. You can also read this post on adding images using the Featured Image Uploader.
Thank you for your help. I ended up editing the header image so that it includes the site title and tagline, and made it clickable. It all works perfectly now. Thanks again!
Is there a way to have several images rotate but still use the header upload feature in Thesis 1.8, or would I need to insert the code in a hook and add some css?
Yes, but I wouldn’t use the header image uploader for this. Use some jQuery for this, or take a look at this post on it.
I’m struggling with this custom header bit. I’ve added a header image, using the uploader in 1.8.
And I have show header/tagline both checked in display options.
I’ve moved my NavBar under the header….But!
My site logo (artist name) is missing, and the tagline is inline with the new position of the navbar, sort of behind the menu tabs in the nav bar.
Tearing hair out.
Can someone take a look and see what I’m missing?
THanks so much,
rick
rickvv recently posted..Monday sun day
Right now it looks like you have it resolved, although one of your plugins is causing an error. If it isn’t working for some reason, you can use the first method in this post on how to add a header images to Thesis.
Thanks- Not sure what you mean about the plugin causing an error. Where are you seeing that? I’ll look at the link you sent here. I like Thesis, but I’m slowly making a transition from Dreamweaver sites/css over to Wordpress & Thesis.
Appreciate it.
rickvv
rickvv recently posted..Monday sun day
If you scroll down to the footer, I’m seeing an error related to the wassup plugin. And you’re making a wise move to going over to WP/Thesis. If you require any assistance with the transition, you’re welcome to submit the form on the “Hire Me” tab. Good luck.
Don’t see the WassUp error in IE9 or FF4. I’ll keep poking around.
And I’ll be back here, along with DIYthemes for good discussions.
Thanks
rickvv recently posted..Monday sun day
Thanks for the info, I’ve been searching around for tutorials using the new 1.8 Thesis. I used an older version before and I thought it was much simpler. What I would like to do is have my header link to a different page besides my home page. Any way to do that? Thanks!
LouAnn recently posted..Understanding the Power of 3
Yes, add this code to your custom-functions.php file:
function custom_header() { ?> <p id="logo"> <a href="#"><?php bloginfo('name'); ?></a> </p> <h1 id="tagline"><?php bloginfo('description'); ?></h1> <?php } add_action('thesis_hook_header','custom_header'); remove_action('thesis_hook_header', 'thesis_default_header');This will replace the default header with this custom one. You can insert the URL to the page you want the header to link to in the anchor tag above.
THANK YOU! That is EXACTLY what i wanted!
LouAnn recently posted..Understanding the Power of 3
Everybody seems to be so excited about the clickable header, but I have been searching for 2 hours trying to figure out how to turn off the thing. Please note this is NOT fo my own site, where I have a custom image and I was able to turn off the clickability (is that a word?) by unchecking the show site name box. However I have a friend who only has the default site name and sub-title and he would like the name NOT to be clickable. (He also uses thesis.) I have spent two hours searching for an answer, but everyone talk about making clickable headers. I have searched for disabling clickable header, turning off clikable header and nothing comes up. Nobody seems to be addressing how to turn the thing off. There should be a simple option for this in Thesis! If anyone knows please help! Thank you!
Put this code in your custom functions file:
function custom_header() { ?> <p id="logo"> <?php bloginfo('name'); ?> </p> <h1 id="tagline"><?php bloginfo('description'); ?></h1> <?php } add_action('thesis_hook_header','custom_header'); remove_action('thesis_hook_header', 'thesis_default_header');Thanks for the quick response! I put the code in the custom functions folder and it broke the website!!!! HELP! I get the following message when I try to go to the website:
Parse error: syntax error, unexpected ‘<' in /home/theplume/public_html/thefreeinsuranceguide.com/wp-content/themes/thesis_182/custom/custom_functions.php on line 12
Works fine for me. I just pasted it into a site and it works. You may have some bad characters in there. Make sure you have the exact same code that you’re seeing above.
Thanks for the quick response! It took me an hour with a server-rep to get the site back up! He tried various thing for about 45 minutes. He even came over to your website to look at the code. But then he said sorry I tried everything and I can’t figure it out talk to the person who gave you the code. Then right at the end of our conversation he got an idea that allowed me to at least go back to the admin panel, so I was able to delete the code myself.
I just copied and pasted the code from here. It is possible that in that process something got messed up but I don’t want to try it again. I may try it later on a test-site that I don’t mind so much breaking. It may be a good idea to make a note, when a code is given that the person should double check every part of the code is exactly the same before hitting the save changes button. But again; I really don’t know if this was the problem or something else. I’m not willing to try again on a live site for sure.
Thanks again for the quick responses though!
If it was the code that caused it, you could have just logged in via FTP and deleted it from the file. Then see if that solved the issue. I’d recommend you take that route if something like this happens again. But I can tell you that the code above works. Something must have happened when you pasted it, if in fact that is what caused the issue.
Thanks for the suggestion, although I have no idea what logging in via FTP means. The host didn’t mention anything like that, so I rather just waited until he fixed it. I’m not a programmer by any means. I just run a few WP blogs and learn as I go, but I rather not experiment with scary stuff I don’t know how to fix…(c:
I am currently looking into Thesis for creating my blog. Is the forum on this page which I am using right now built into Thesis? Thanks!
I don’t know what page you’re referring to, but if it’s any page on this site, there’s no forum at all on the site. Regardless, Thesis doesn’t have a built in forum. If you’re just referring to the commenting, then yes, that’s built into WordPress. As to considering if you should get Thesis or not, if you want my opinion, you don’t need to think about it anymore. Just get it. You won’t be sorry.
Hey thanks for the great content, i have a problem with getting my header image to actually show. I loaded the png file into the thesis header image page but when i click “check out your site” it doesn’t show up. I have the file permissions set to 775 and 666 for the cache and style.css folders. HELP! i have now idea what to do
thanks so much
I’d have to log in to see what’s happening, but you could use this alternate method which works just fine: http://thesis-blogs.com/how-to-add-a-custom-header-image-to-thesis/
thanks for the quick reply, where exactly do i find the custom/images folder? in /wp-content/themes/thesis_184/custom maybe? its just that it doesn’t have an images folder, do I need to make one or am i looking in the wrong place?
thanks again
Yes, that’s it. There’s an images folder in the custom folder.
Hi.. I just tried uploading my logo to thesis header and it keeps left aligning.
I want it centered with a little less white space above logo. How to do I achieve this?
tanzie recently posted..How Not To Ruin Your Photo Shoot
This is a really good question. If you’re using the Thesis Header Image Uploader, what Thesis does is include the image as the background image of the header div using the
background-imagecss property.To center your logo or header image, you should add this to your
custom.cssfile:.custom #header { background-position:center; } .custom #logo a { margin:0 auto; }Thanks!
Perfect! Thank you so much for your quick answer.
tanzie recently posted..How Not To Ruin Your Photo Shoot
Hello i have uploaded the image and put it also in custom/images on filezilla, the design options (show sitename) are also on, but my header isnt clickable.
can you help me?