Hello all,
First, I'm really impressed with CMSms. Some very careful thinking and good design has gone into making this so straightforward. I'm a bit of a techie, but I'm not an HTML expert, so setting up web sites has always been very intimidating to me. Hopefully, those days are behind me.
One thing, though, still gets me every time. I successfully installed everything in no time, and all the features work. Now, this may be a bit off-topic in terms of CMSms, but since you guys seem to be the "easy button" for everything else, I figured I'd throw it out there. I have no idea how to make header images. I've opened Photoshop a handful of times, but only enough to be afraid of it. I have a little square image that I'd love to use as a logo, but it's the wrong size, and shape, and I think I need to change the background color to match the header background color (or the other way around).
It seems to me that this is the very first thing anyone setting up a site will want to do, but i can't find any "header image made simple" tutorials. Can anyone point me in the right direction? I would really, really appreciate any advice you have on this.
Thanks.
--Rafi
Header Images help
Re: Header Images help
The header image in the defaults is set in the header h1 a/link to just change it put your image in uploads/images and call it in the CSS here...
div#header { position:relative;
height: 80px; /* adjust according your image size */
background: #385C72;
}
div#header h1 a {
/* you can set your own image here */
background: #385C72 url(images/cms/logo1.gifchange to uploads/images/yourlogo.ext) no-repeat 0 12px;
display: block;
height: 80px; /* adjust according your image size */
text-indent: -999em; /* this hides the text */
text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
}
As far as changing your logo, you can leave it and change the background colors above to match it, to change it's size copy/paste it in the same folder it's in now and then open it in your favorite image software and make some changes to the copy and you will always have the original to go back to, experiment it's fun...
div#header { position:relative;
height: 80px; /* adjust according your image size */
background: #385C72;
}
div#header h1 a {
/* you can set your own image here */
background: #385C72 url(images/cms/logo1.gifchange to uploads/images/yourlogo.ext) no-repeat 0 12px;
display: block;
height: 80px; /* adjust according your image size */
text-indent: -999em; /* this hides the text */
text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
}
As far as changing your logo, you can leave it and change the background colors above to match it, to change it's size copy/paste it in the same folder it's in now and then open it in your favorite image software and make some changes to the copy and you will always have the original to go back to, experiment it's fun...
Re: Header Images help
Hi,
http://www.photoshop-weblog.de/?p=766
http://www.photoshoptutorials.de/
And actually Photoshop, while certainly a good program, is not really the most intuitive of them, especially for pixel-beginners
.
If you can put your hands onto an old copy of Micrografx Picture Publisher (7.0 or 8.0), maybe through Ebay or a friend has some CD still gathering dust, I'd actually try starting with that software. It's very self-explaining, the steps to achieve something worthwhile are fewer and more logical than Photoshop (Photoshop enthusiasts please don't lash me to a stake - it is as it is).
Another not so bad software which is extremely intuitive is Irfanview, it's Freeware.
Greetings
Kizil
http://www.photoshop-weblog.de/?p=766
http://www.photoshoptutorials.de/
And actually Photoshop, while certainly a good program, is not really the most intuitive of them, especially for pixel-beginners

If you can put your hands onto an old copy of Micrografx Picture Publisher (7.0 or 8.0), maybe through Ebay or a friend has some CD still gathering dust, I'd actually try starting with that software. It's very self-explaining, the steps to achieve something worthwhile are fewer and more logical than Photoshop (Photoshop enthusiasts please don't lash me to a stake - it is as it is).
Another not so bad software which is extremely intuitive is Irfanview, it's Freeware.
Greetings
Kizil
Last edited by kizil on Sun Aug 19, 2007 4:24 am, edited 1 time in total.
Re: Header Images help
I'm running XP so I use paint.NET, which is quick and good for not real extreme duties, a free and very nice program and the GIMP also free, but more powerful than paint.NET, both have something to offer...