Design - Written by Kerry on Saturday, August 23, 2008 16:00 - 26 Comments

WP Coda Orange Theme Released

WP CODA ORANGE is based on the fantastic theme by Greg Johnson - WP CODA. WP CODA itself was created to “mimic the functionality of the very popular Coda website - created by .Panic to market their web development tools and services. As Greg states, “Every aspect of the Coda website was duplicated and this theme works in every major browser.”

I found the theme on the ever present Weblog Tools Collection theme release posts. I have added my own twists and simplified the graphic layout so others could take the files I created and make their own CODA theme flavor.

VISIT THE DEMO SITE - CLICK HERE

Download Links



WP CODA Orange WordPress Theme


Instructions and other information can be found at the demo site.



26 Comments

You can follow responses to this entry through the RSS 2.0 feed. You can leave a response or trackback from your own site.

marcin @ localess.com
Aug 27, 2008
06:20 am
 

Hi Kerry,
Love what you did with Greg’s theme, have one question though - is there any chance to have header and the rest moved up so the header space would not be like 3/4 height on lower resolution monitors ?

kevin
Aug 27, 2008
06:52 pm
 

love your theme. I have used it for my new site. http://www.loadmemory.com with lots of change of color. Now I have a question about coda popup, can I apply it for other tab,not only for the first one?

Thank you in advance!

kevin

Kerry
Aug 27, 2008
08:11 pm
 

@marcin @ localess.com - Yes. but it will take a lot of doing.

This change will raise the tabs 100px toward the top of the page.

line 28 of the style.css change from:

padding:220px 0 0 0;

to
padding:120px 0 0 0;

Then the popup on the download tab will have to have its style changed as follows:

line 93 of style.css change from

margin:225px 0 0 50px;

to

margin:125px 0 0 50px;

You will then need to change two graphics to fit your needs:

body_bg.png & header_bg.png

They will no longer fit the theme.

Kerry
Aug 27, 2008
08:13 pm
 

@kevin - checkout the demo. Then download this file and follow the instructions in the readme.txt:

http://kerrywebster.com/wp-downloads/all_3_tabs_with_popup.zip

kevin
Aug 27, 2008
09:39 pm
 

Thank you very much! no problem in IE, but no effect in firefox3.0. any suggestion? Thank you!

marcin @ localess.com
Aug 28, 2008
05:53 am
 

Thanks Kerry - for the details how to do the header thing :-)

Kerry
Aug 29, 2008
12:34 am
 

@kevin - running ff 3.01 and it works fine on my machine. Don’t have a pc with ff 3.0 any more. Can’t test. Sorry.

nerdski
Sep 4, 2008
05:13 pm
 

I have a lot of text content in one of my pages and it gets cut off. If there a way to add like a scrolling bar? I really don’t want to add an iframe, is there any other way around this?

Jacob
Sep 7, 2008
08:55 pm
 

I can’t get the fancybox working. How do you use that plugin? I know that it is already installed into the theme, but how do I implement the fancybox for an iframe or an image? Please let me know. The website I am trying to get it working for is cori4weddings.com. Thanks.

Jacob

Fedelosa
Sep 28, 2008
11:53 am
 

Your work is great!!! Thank you for this theme!!!

myndcraft
Oct 2, 2008
11:28 am
 

I’m hoping someone could help me HEAVILY modify this theme. What I am looking to do is the following.

Remove the three header links - did that.

Remove the slide between pages -effects. Reason is my content doesn’t fit inside the panel and adding turning the overflow on creates a double slidebar effect.

Any thoughts?

Nikko
Oct 3, 2008
09:43 am
 

Hi Kerry,

I love the coda orange theme as well wp coda. I am playing with the coda orange theme and slowly learning to make changes. My question, I want to use a SWF header at the top where the coda orange image is. You can see the header here. http://www.coastalrealestateconsultants.com Can you point me or guide me on how to integrate this? Thanks.

Nikko

savvy
Oct 4, 2008
01:21 am
 

Hi Kerry,
Thanks for such a great theme. I have almost finished customizing this theme and have run into a couple of questions.

1. Is there a way to turn one of the pages into a blog?

2. Is there a way to make each sliding page have it’s own URL?

I wish I’d thought about asking this before I spent all day customizing the theme. Ahh…my excitement about this theme blinded me before I thought about the important things. Either way, thanks for the free theme, and any advice would be greatly appreciated.

Kerry
Oct 4, 2008
11:31 am
 

@Nikko - I need to know how much of the header you want to lose. It will just take adding the .swf code to the header and then possibly some .css changes for height to accomodate the height of the flash header.

Kerry
Oct 4, 2008
11:35 am
 

@savvy - blog integration has been the No. 1 request. This will be coming in version 2 but I am swamped at the moment with other work. The sliding page and URL thing will take a bit more explation so I understand what the request is suggesting.

Nikko
Oct 4, 2008
11:49 am
 

Hi Kerry, thanks for your response. The swf is 800×320 exactly the size of the background png image. Ive tried putting it in the header.php using the kimili plugin but it shows up down in the page area.

I also notice that the download, learn how, and talk back tabs do not change when you hover them in Firefox. Here is what I have played with. Ex. http://www.dreamcreationteam.com/

Nikko
Oct 4, 2008
11:56 am
 

Kerry,

Forgot to mention, I do want to keep the 3 tabs, they seem to overlap the header bkground image, so I may need to reduce the swf dimensions.

Kerry
Oct 4, 2008
11:00 pm
 

@Nikko - take a look at the demo. http://wpcodaorange.kerrywebster.com/
I will leave this up for a bit. I am trying to figure out the rolloever issue in Firefox. It seems to be a cache/download issue with the code that performs the rollever effect.

I will zip and place for download if this is what you are looking for with the header. Let me know.

Nikko
Oct 4, 2008
11:53 pm
 

Hi Kerry,

Yes, that is what I am looking for. I will reduce the size of the swf header so it will fit above the 3 tabs which I want to use. Can the navigation and slider module be raised up closer to the bottom of the orange block? Thanks so much for your assistance on this, this theme is really slick and cool. Can’t wait to use it in the future. Kudos to you.

Nikko

Kerry
Oct 5, 2008
08:47 pm
 

@Nikko - take another look and let me know. I think you should be able to handle any changes from here.

Nikko
Oct 6, 2008
12:11 am
 

Fantastic, exactly what I am looking for. Thanks Kerry I really appreciate your help.

freddy
Nov 3, 2008
03:06 am
 

used the .css tweak mentioned to marcin above about making the header smaller and changing the padding and margin on the 2 lines, but I am a miff to how to get the entire rest of the page to slide up as well. In other words I have made the header_bg with smaller height as well as the body_bg and adjusted the padding in the #header accordingly and margin in #header .popup but now I have a big gap between the header and header links and body. Any help here would be greatly appreciated, I’m sure I’m missing something obvious…

roody
Nov 4, 2008
02:42 am
 

This theme is incompatible with the wordpress plugin Gengo??

Thank you for your help!

Trackbacks

Leave a Reply



BasecampHighrise

Comment



 

Design - Oct 26, 2008 11:42 - 7 Comments

Retro Theme Released

More In Design


News - Aug 15, 2008 15:53 - 0 Comments

Woopra Gets Mention in Practical Webdesign

More In News


How To - Jul 15, 2008 23:59 - 9 Comments

How WordPress 2.6 Broke My Permalink Structure…

More In How To




Login

173 queries. 1.480 seconds.