I had to add a header graphic to a site using the Thesis the other day.  I found this blog post on how to do it and it worked really well.  However, there were a few additional tips which helped me along the way.

1. Initially I put the image in the wrong folder.  My mistake. The header graphic should be uploaded to the “custom/images” directory of your Thesis theme installation.

2. In following the tutorial I copied the CSS from the tutorial however, it took some fiddling to get my image to position correctly.  In the end it was simply a case of reducing the height of the .custom #header #logo thus:

     a { display: block; height: 100px;

I also had to move my logo image down a bit for it to look right using the css code change:

     .custom #header { padding: 20px 0px 0px 0px; }

What this is tell the image to add a 20px padding to the top.  It is using the shortened form of padding property.  The padding property can have from one to four values for example:

padding:25px 50px 75px 100px;

• top padding is 25px
• right padding is 50px
• bottom padding is 75px
• left padding is 100px

Hope that helps.

Technorati Tags: thesis css, Thesis Theme, Thesis theme header graphic

In order to hide a page from showing in the navigation menu of a theme created in Artisteer it is simply a case of editing the correct part of the functions.php file in the root of the themes folder. You can access this either through the built in WordPress theme editor or via a text editor like EditPlus.

To hide the page from the Artisteer menu first you will need to get the page number. Then edit the function art_menu_items() in functions.php.  You can see below that all I have done is add the text ‘&exclude=12,3′ to line 527.

Edit the art_menu_items function in functions.php

Before I edited it line 527 read:

wp_list_pages('title_li=');

After I edited it it read:

wp_list_pages('title_li=&exclude=12,3');

Please do give me your feedback below if you find this technique useful and I will write more like this.

Technorati Tags: Artisteer, Navigation Menu, Page management, Theme Editor

1. Editing files directly on my server.

To edit .css files or other code files directly on a server, I use 2 programs, one for PC and one for Mac

On the Mac I use TextWrangler to change my code in real time. On the PC I use Edit Plus.

2. Working on my site offline

Download MAMP and turn you Mac into your own personal server.  This is how I work on stuff before I take it live.

3. Selecting a colour pallette

Being colour blind, to pick colours that go well together I use a Hex Colour Code  tool to speed things up.

4. To add gradients and rounded edges

They can be a little slow to load but if you wanted rounded corners or gradients go here.  Alist apart is also a great design reference if you really want to get into it.

5. Using other people’s photos from flickr

Flickr has a page that explains the rules for using a picture you found on flickr, make sure it has a Creative Commons license and give them credit with a name and link on your blog post.

Technorati Tags: Creative Commons License, Css Files, Edit Plus 2, Flickr, Gradients, Hex Colour Code, Mamp, People, rounded corners