PDA

View Full Version : Practical Tips for Templates


bithosts
05-11-07, 06:23 PM
Hey all!

Was wondering if any of you had any practical advice for producing templates and customisation particularly the publicly viewable side of the site.

Cheers!
skshost
05-12-07, 07:42 AM
I personally always remove the margin that you'll find at the bottom of header.tpl.
I'll also set the width of a few tables to 100% where they mite be or 80%. IMO it just makes things lines up better.
bithosts
05-15-07, 01:13 PM
Cheers,

how much of this can we change - every file I've looked at is encrypted!
Adamski
05-15-07, 01:19 PM
You can change as much as you like - you need to be looking at the template files in the template directory. Make a copy of the default ones and play away :)

They all end in .tpl
bear
05-15-07, 03:20 PM
It was actually easier to skin than I thought it was going to be. Except for recreating the icons (to match my darkish background), it was done in about one hour. A few elements were formatted in the tpl files instead of the CSS, but not too many, so once you see how it's done, it's pretty simple..

Tips?
Get a really good color sampling program to use to find the colors in the CSS.
Here's a great free one: http://www.colorcop.net/
Just start the program, load a page on your site, and use the eyedropper to sample colors from it

[EDIT]
Just saw someone look at my site for the integration. It's not live yet (import issues from WHM*P). :)
skshost
05-15-07, 07:02 PM
The feature this program: http://www.colorcop.net/ offers is included in many existing applications. I use it in photoshop, but I guess it's nice if you don't want PS open to do that.
PPH
05-15-07, 07:15 PM
What you want to use the eydropper on PS has to be an image file and opened in PS, doesn't it?
bear
05-15-07, 08:17 PM
No, you can click inside an empty image with the eyedropper in PS and hold the left mouse button while hovering over anything to sample. For me, using an 800 pound gorilla of a program just to do simple color grabs is kind of pointless. Besides, Colorcop gives you the HEX, PS requires you to do some extra work to see it. ;)
PPH
05-15-07, 10:03 PM
Yep I was glad to download and install it for a quick color sample of anything on my screen :)
bithosts
05-15-07, 10:30 PM
Wow!

Thanks for all the replies!

Ill give it all a go and see what I can produce.
skshost
05-16-07, 04:47 AM
That tool is much quicker than PS, but I've got PS open so often that it's just as good.
PS does give you the hex without extra work how I use it.
MACscr
05-16-07, 08:08 AM
I just use the eye dropper extension for firefox. =P
bear
05-16-07, 11:22 AM
PS does give you the hex without extra work how I use it.How do you do that? From what I've experienced, you need to sample, then click the color well to open the colorpicker to see the hex. There a better/faster way that that?
MACscr
05-16-07, 02:46 PM
It was actually easier to skin than I thought it was going to be. Except for recreating the icons (to match my darkish background), it was done in about one hour. A few elements were formatted in the tpl files instead of the CSS, but not too many, so once you see how it's done, it's pretty simple..

Tips?
Get a really good color sampling program to use to find the colors in the CSS.
Here's a great free one: http://www.colorcop.net/
Just start the program, load a page on your site, and use the eyedropper to sample colors from it

[EDIT]
Just saw someone look at my site for the integration. It's not live yet (import issues from WHM*P). :)

Its so much easier to use Firefox extensions for this. Checkout ColorZilla,Web Developer, and Firebug. Working with colors, markup, and css is so much easier after that.