Here are the few lines of CSS I used:
.custom #header { background: #000; }
.history_page #header { background: #ffd000; }
.designers_page #header { background: #203ffe; }
.about_page #header { background: #ccc; }Making custom headers for each page is as easy as typing. Thanks to Thesis, this process takes seconds, whereas with other themes, it may take hours of sweat and tears. As far as naming each page, you should use a unique name that simplistically identifies that page. For that very reason, I use the format pagename_page. So, if your page is called “Mechanisms”, consider using mechanisms_page. You may certainly use something non-related, such as so_fresh, but that isn’t relevant and may cause confusion later.
If you have any more questions, please contact ThesisTutor [at] gmail [dot] com.
{ 2 trackbacks }
{ 13 comments… read them below or add one }
Hi Matt,
You do good work here sir. I’ve just been throwing myself into thesis the past day or so and am playing around with it before I implement it to my site.
My specific question on this video is. I’ve got the the idea about different colors, but would like to play around with images. So, ok, stole the code for background images from your twitter tutorial. However, I would like the image to align to the right, so that it won’t interrupt the site title, tag…I’ve tried background-position: right; and various others but the image just disappears. Thoughts! Thanks!
Matt,
This is an answer to a question I’ve asked, unsuccessfully, on the Thesis forum.
Embellishment: how can I customize each page’s header with a different GRAPHIC?
Thanks.
@Bill
.custom #header { background: url(http://youraddress.com/where_your_file_is/your_pic_name.pictype) no-repeat; }
Let me know if that works.
I had problems with that so I used
.custom #header {background-image: url(‘http://youraddress.com/where_your_file_is/your_pic_name.pictype‘); background-repeat: no-repeat; width: 959px; height: 282px; text-indent: -9999px; }
This set the size as well for me.
Sweet. I was looking to have a unique “skin” (not just header) for each different page in my nav menu, and this is going to be awesome. The tip about the css class is perfect! Thanks so much for the tip!
Matt – that was awesome! Thank you. You were quick and easy to understand. I’m off like a herd of turtles! Zoom!
Thanks,
Lena
(:
Wow thats a nice tutorial. I’ll definitely do that in my blog.
Bless you
Hey I have question.
Can I do it with every posts permalink, when it shows on a different page?
Bless you
Matt, How do you do this exact tutorial if you have made a Flash header. What I want is the flash header to only load on the home page and on all other pages in the site I want a JPEG image as the header. It will be the same for all other pages. Any help would be great.
Hi Russell,
Did you ever find out how to do this? I’m trying to do the same thing.
Tried 40 different things…starting to go crazy… any help greatly appreciated!
Thanks!
The video stopped on me. Just when I was learning something… Sad face.
I need to get it on blip.tv. the quality and load time is teh sigh…
WoW
I can’t believe I just found this site.
I have been struggling with this for a long time and hats off to you for the solution
Cheers,
-Ron