WordPress Theme "Orange Sky"

Download the newst version of Orange Sky theme from the links provided in this entry: Orange Sky for WP 2.0

Finally! I just submitted my entry for The WordPress 1.5 Themes Competition.

I named it “Orange Sky,” after Alexi Murdoch’s song in Four Songs – in fact, the song just came up into my mind while I was designing this, and kind of fell into the place (I like “Song For You” in that CD too!). Click the left pic to see a larger screenshot the theme at work.

I basically re-learned how to make a WP template from Michael Heilemann’s kurbrick default theme. There’s lots of functionality added to WP1.5, I had fun playing with it.

In addition to index.php and other regular pages, I added the “About” page template. By default, it only contains the name and profile description (bio) of the author, but you can edit it to inculude email address and other info if you’d like.

What’s nice about it is that you can edit these information in the WP admin area (users > your profile).

WP1.5 is great! Oh so nice to be a WordPress user…

View my theme at work here : Orange Sky theme for WordPress 1.5

All of submitted themes (total of 139 according to Alex!) including mine will be avaiable for download at Alex’s WordPress 1.5 Theme Competition Entries Page.

94 thoughts on “WordPress Theme "Orange Sky"”

  1. Congratulations on creating and submitting another template for WordPress, that’s something I could never do! Now, I looked through every template on Alex’s list and I can’t find this one – the one you use right now. Is it available? I love it!! Your response would be appreciated. Thanks!

  2. Donna,
    This template (pink with gerbera daisies) is not on the themes list. Actually, I am still using WordPress v1.0 on this site…
    I am not planning to port it to v1.5 (I will redesign the site when I upgrade), but feel free to view the css/html code. As long as my name is credited somewhere, you can use the design any way you want to.

  3. Hello, Nao!

    Thanks for the lovely theme. A question for you: is it possible to have a time-stamp inserted with every post? As I’ve looked over my blog, I see there are no time-stamps – even though the posts are chronologically placed in a descending order – and I get the feeling they’d help. I would love help regarding this, and never the less: thanks for yet another highly creative and inspiring theme from you!

  4. Niklas,
    Maybe this page helps-

    For example, if you want to show this: March 28, 2005 at 1:00 pm
    add: at <?php the_time('g:i a'); ?>
    after: <?php the_time('F j, Y'); ?>
    in these files: index.php, single.php, sidebar.php, archive.php, search.php

    so it’ll look like this: <?php the_time('F j, Y'); ?> at <?php the_time('g:i a'); ?>

    Let me know if this is confusing… I am not very good at explaining 🙁

  5. Congratulations on this thene! Very beautiful, indeed. I work with Sadish at wpthemes.info and we have some themes of our own in the competition as well. But I wanted to come here and congratulate you, this is one of my favorite themes in the competition. 🙂

  6. Sadish & Patricia-
    I’ve been to your wpthemes.info (via flickr WP group) and thought it is a cool site! Thanks for your nice comment on my theme 🙂

    Also thanks to Matteo & Andrew!

    Probably seen this but…

    Let me know what error code you are getting, or what seems to be the problem. I’ll help as much as I can.

  7. This is a beautiful theme. The name tempted me to check it out while browsing the WP1.5 Theme Competetion site. Great Song, Great Theme.

  8. Nao, congratulations on a trully wonderful theme.

    Just a thing I’ve noticed, that I think needs correction: is there something wrong with the code used when creating “pages”? It seems it doesn’t handle linebreaks very well.

    At first I thought it was a problem in my installation, but taking a quick look at Alex King’s “about “page (with yours, and then with another theme) revealed that I’m not the only one affected. For easiness’ sake I provide the following screenshots:

    another theme – about page
    your theme – about page (notice also how close the “About” header is to the header image)

    That’s it. Let me know if I’m right, and if there’s a fix.

    And again, thanks for a beautiful theme.

    (PS: Would you care to provide an “os_header” image without the “Powered by WordPress” writing?)

  9. This is a LOVELY template–I hope you don’t mind that I use it as one of the templates on my site.
    I’ve run into one small problem that maybe you could help me with–or point me at a page where I might learn to make the change myself? I have a “category” page in my archives. If I open any category page, none of the pics on the entries show up–going to the permalinked pages shows the photos, as well as everywhere else–just not on the category pages. Is this something I broke? or did you design it that way?
    Again, I love this template–thank you!!

  10. also–I forgot to add–on the category pages, URL’s don’t seem to work either.

    I’m really thinking this is a problem with MY templates, but just in case, I thought I would ask….

  11. In my opinion this is the most beautiful template of the competition (and, btw, call me ‘whiner’, but I think 80% of the sumbitted templates, including some being awarded some prizes, are just ugly or way too common)

  12. Konstantinos-
    I guess I needed to explain better about the “about.php” page. Just as “links.php,” it is to be used without any “page content” (meaning, what you write in the text box in the “Write Page” admin area).
    Instead, it’s supposed to pull information from your profile
    http://www.nao-net.com/wordpress/?page_id2 (example)
    By default, it has two items: login name and “Profile” text.
    I am guessing Alex’s site’s About page doesn’t use my about.php file as a template… probably because it shares page templates with other themes. I hope this is a good enough explaination. Let me know if I’m not clear.

    And here is the header without “Powered by” text. Right-click » “save as…” » save it in images folder. Rename this image as “os_header.jpg” or modify css file to override the default header image.

  13. Hi laurie,
    Thanks for using my theme! On the category pages, it supposed to show only exerpts of each entry (except short entries). You didn’t break anything!
    Now I look at it, it’s quite confusing… Sorry for that.
    If you want to show complete entries on the category pages, edit archive.php like this:

    1. Find <?php the_excerpt() ?> on line 43.
    2. Replace it with <?php the_content('<p class="serif">Read the rest of this entry &raquo;</p>'); ?>

    This should show the same entry content (with #more link) on archive pages.

  14. Nao;

    Thanks SO much for getting back to me–and your advice worked perfectly!Much appreciation on this end.
    I even had to go check out the song “orange sky”! 😀

  15. Nao, thank you so much for the header image and the explanation.

    Regarding the “about” page though, I should have been a bit clearer. In my own tests, the spacing problem I have mentioned doesn’t happen just when I choose the “about” template (which as you said, is absolutely normal to happen because it’s not meant for this use), but also when just creating a “page”.

    Could you please test it yourself; create a “page” (with no special templates) with some line breaks, etc. and see the end result; it’ll be similar (in what concerns spacing) to the screenshot I pointed to.

    (I would point you to my own test, but it contains some sensitive data, at the moment – sorry for the trouble.)

  16. قالب آسمان نارنجی
    قالب آسمان نارنجی یا OrangeSky دومین قالبی هست Ú©Ù‡ Ùارسی شده Ùˆ میتونید در بخش پوسته ها دریاÙت کنید.
    این قالب توسط Naoko McCracken طراحی شده Ùˆ جزو طر…

  17. I’m currently using this theme for my site–I love it! I just have one question–for some reason my archive page doesn’t display properly in firefox; I’ve checked it in IE and all is well there. Do you think you could look at it and tell me what might be wrong? http://gldnspce.com/archive


  18. Hi Nao,

    I love your OrangeSky theme. Just a little suggestion, I would put the following attribute in #sidebar so that it doesn’t end very abruptly when there’s little content in it:

    min-height: 620px;

    You can see your theme in action here.

  19. This is a great theme! It’s also fairly easy to add my little customizations. For the moment, I’ve removed the heading navigation until I get my website going, based on this theme, of course. And I didn’t need the “about me” in the sidebar, so I killed that too. :-D. You can check it out in action, if you like. Many thanks!

  20. Hi there, I just downloaded your Orange Sky template. I LOVE it. It’s one of the best I’ve seen. I am having one problem though. I am unable to change the Author text in the top corner (Write a short description of yourself. Additionally use about.php template to create . . . etc.) Where do I go to change this text? I tried changing it on the sidebar template page, but no luck. Please help 🙂

    thank you!

  21. Sorry I haven’t been keeping up with replying comments…
    Konstantinos, I realized what you are pointing at. My style application was wrong on page.php.

    Please replace lines 7 & 8 on page.php with the following:
    <h2 class"pagetitle" id"post-"><?php the_title(); ?></h2>
    <div class"entry">

    Here's my "page" with the new page.php file.

  22. -a.,
    seems like you’ve solved the problem on your own, but thanks for pointing out. The archives.php page was missing
    <?php get_sidebar(); ?>
    (should be right before get_footer(); function)
    Again, this was my mistake!

  23. Thanks fuzzy_logic for your suggestion. Although I didn’t use min-height mainly because it’s not supported by IE yet (and I thought it looked ‘okay’ without it), I agree the sidebar will look better with +620px height!

    Anthony, thanks for using my theme! I’m glad you could customize the theme according to your site. Looks pretty good!

    amanda, “the Author text” can be modified in sidebar.php file 🙂

  24. I have the same problem Konstantinos is trying to explain. In my example, I have created a blog, and inside of it, a page. There you can see clearer the problem with br’s not applying.

    (Changing the page.php template has not worked)

  25. Hey, i took your contributed Theme and customized it a little bit. I hope it will be okay? (the mainly style & functions are still in there). Nice work!

  26. Jabi, follow Nao’s instructions and you’ll be fine!

    Nao, thank you for taking the time to reply to my comment.

    One last question: do nested categories play nice with the theme?

    I’m running WP v1.5 and have setup the following categories:
    – X
    – – Y (a child of X)

    I write a post and file it under the ‘Y’ category. In the categories list on my weblog, I get to see:
    – Y (1)
    instead of:
    – X
    – – Y (1)

    Is that normal?

    Note that in the above example, I just ‘tick’ (check) the ‘Y’ category checkbox when writing my post. Even if I check both ‘X’ and ‘Y’ though, I don’t get nested categories in my weblog’s index page. Instead I see:
    – X (1)
    – Y (1)

    As always, your help would be greatly appreciated. Thank you!

  27. I love your orange theme. While trying to find time to design a template for myself, I stumbled across your Orange theme and it rocks! I’m using it for now on my blog till I get one designed – I got tired of the old blue and grey default and am actually posting more now – your look is so awesome!

    Anyway, thanks for producing such inspiring work – I’m gonna have a great time learning from it!

  28. Jabi-
    Could you try to download this (right-click and save as page.txt, then change the name to page.php). Then replace this with exisiting page.php.
    This is the file I modified according to my comment #30.
    Thanks for trying to make it work. Let me know if this doesn’t work!

  29. Konstantinos-
    Thank you for pointing that out again!
    Seems like the list_cats() function is not producing <ul> tags? Hmm…

    Some other people are having the same problem.
    People posted a solution in the above thread, or here is another quick fix.

    On sidebar.php, find
    <?php list_cats(0, '', 'name', 'asc', '', 1, 0, 1, 1, 1, 1, 0,'','','','','') ?>

    and replace with:
    <?php wp_list_cats('optioncount=1&sort_column=name&hide_empty=0'); ?>

    (hide_empty is set to false because of this)

  30. Just to let you know that I’m using your lovely theme. Hope you don’t mind that I modified the image a bit.
    I am only having one problem (if you can even call it that).. when I mouse over the images in the menu the image disappears. I checked out other pages implementing your theme and they all have the same problem. Do you have any idea why?
    Thank you so much for this theme! I am looking forward to any future desings.

  31. hey there, great theme – i like it very much.

    how can i place the text in the header image (in your case “orange sky” and the description) at any place i want ?

  32. Just wanted to thank you for the great theme. I’ve hacked it up a bit (just the details really) and it’s really teaching me a great deal about CSS and the construction of WP.

    So, thanks again and feel free to see how I’m using your design. http://purplesmurf.com

  33. Hello Nao,

    Just yesterday I installed wordpress in the hope that it could serve as the business discussion board for a music website I’m putting together. In looking to replace the standard theme, I came across your lovely “Orange Sky”. Besides being a wonderfully designed theme, it made me realize what a small world this really is. I actually designed the first version of Alexi Murdoch’s website right at the time when KCRW began playing his EP. It’s pretty amazing to see how many people his music has touched! I’ll be sure to show this theme to Alexi. I think he’ll really love it.

    Keep up the great work!


  34. -Natalia,
    I went to your site and tried to see the problem you mentioned, but for me it looked okay (WinXP Firefox 1.0.3 & IE 6). Please let me know your browser and OS, exactly where it is (is it the right background image with leaves?), and I am happy to help you out! Thanks.

    You can change contents of header.php and the css file. (write the text in header.php, and control the appearance in the css). I hope this helps 🙂

    Thanks Michael! I like your use of fonts and the trees in the header.

    WOW! I am so happy that Alexi Murdoch will be seeing my template!!!!! I really can’t believe it, but I love the “small world” that we live in. It’s so awesome… Thanks for leaving a comment, it made my day!

  35. Hi Nao,

    I am new to wordpress but I went into it without a hitch. Of all the themes I ran over, yours is the best 🙂

    I followed your post on inserting the time stamp and noticed that when I went to ‘Archives’ and ‘Categories’ the time stamp for the posts was not displayed.

    Only the index page shows the date and time. The other pages as above shows day, date but no time displayed.

    How do I correct this? And how do I remove the day stamp?

    Many thanks

  36. hi Philip,
    Sorry for really late reply.
    Thanks for your compliment!! 😉
    I think what you are trying to do is the same as this comment posted earlier by laurie.
    My answer to her is here.
    I hope this helps… 🙂

  37. Hello Naoko.

    I am writing this in the comments because I couldn’t find you email.

    I am Ran Yaniv Hartstein. I have a localized version of WordPress i distribute on my site: http://www.trans.co.il/wp_en/ . I would like to augment it with some of the themes from the recent WordPress 1.5 theme competition – yours included.

    I would like your permission to localize “OrangeSky” – this will involve mainly changing the CSS and making it RTL friendly, and doing what changes necessary for fitting templates to Hebrew presentation.

    What do you think?

    –RYH, http://www.trans.co.il

  38. Hey Ran,
    Thanks for dropping me a note. It would be wonderful if you could include my theme in your Hebrew WordPress 🙂 My theme is released under GPL license, so feel free to change it and share with others.

    Good luck!

  39. Very great ;-).
    Thanx for this theme.
    I changed it a little, cause Blue is my favorite color.
    Well, I’m not a good painter, so it doesn’t look exactly like “OrangeSky”.

    Greetz from Germany

  40. Arne,
    Nice colors!
    They go really well with the “get firefox” button in your sidebar 🙂

  41. Hi,

    I’m using your theme and my site has heavy traffic (10.000 uniques daily). I need you to change your theme file in a certain way. I’ll pay you for that or we can make some kind of deal, whatever. Please do send me an email so we can discuss it.

  42. Hi. Im kind of new when it comes to editing themes. I was just wondering how could I make the fonts of the main post smaller? I mean, where do I edit them? Thanks. I love your theme btw. 🙂

  43. Hi Nao!!!

    Nice theme… congratulations, this is my favorite WP theme, I really love it, but Nao I do not if it is a intentionally omission but in the style sheet there is not the following lines:

    .alignleft {
    float: left

    .alignright {
    float: right;

    But in the templates there is a reference to that, that omission causes overlapping in the Next and Previous Post, not disfunctional but not practical… only that friend, but the theme is really beauty!!! 😉

  44. Nao, when I started with WordPress and experimented with a lot of themes – I found yours the best! I’ve retained it upto now ever since I started my blog. Thank you very much! I’ve modified it a bit… but of course have retained the link to your page.

  45. very nice design (orangesky). do you happen to know what causes the flash in IE6 when you change pages in this theme? thx much.

  46. Sorry I haven’t been keeping up with comments.

    It’s been quite a while so you might have solve your problem.
    But if you want to change the entry text,
    increase the size specified in #main. Or you can do something like:

    .entry p {
    padding: 0 0 1em 0;
    font-size: ???;

    “???” can be 10px, x-small, 0.9em, etc…
    Hope it helps.

    Thanks you D3L C4ST1LL0! I have for some reason deleted the part….!!! 😮
    I need to release a bug-fixed version…

    Sanjay, glad you liked it. I like the bold THANK YOU 🙂

    I am not sure if this is what you mentioned, but I kind of see the flash/flicker in IE. Seems like it’s something in commong among themes using background image? Let me know if this is happening only on my theme (then I am not seeing what you are pointing out). Thanks for your feedback!!

  47. hi there…
    the flashing in IE6 does appear to be specific to the orangesky theme. if you browse other themes at http://www.alexking.org/software/wordpress/themes/blog/ using IE6 you’ll see that they don’t have the flashing, even though they use bg images. (Wuhan doesn’t load CSS at all in IE6.)
    how to describe the flash? …it’s a very quick white flash that appears approx in the middle to the left of the screen, kinda like a piece of paper is getting torn in half very quickly. it’s somewhat jarring in IE6, though it’s very quick.
    If you just hit the “home” button repeatedly you’ll see it. it’s most visible in the blue lefthand margin and the upper right corner. it’s not as violent every time you press “home” but you’ll see it… I do like the design quite a lot and since there is (unfortunately) such a thing as IE6, I’m wondering if it can be addressed through image preloads or something, but I’m not sure how to proceed. it might be the combo of bg images and div float that IE can’t handle… ?

  48. …ok I think the problem is that IE6 handles repeat-x backgrounds very poorly. so the following background image causes most of the flash effect I’m witnessing:
    background: url(“../images/os_bg.jpg”) repeat-x #CFE8E8;
    for whome it may concern, here’s a minimally tested hack to serve up solid color to IE6 users instead of the bg image:

    html>body {
    background: url(“../images/os_bg.jpg”) repeat-x #CFE8E8;

    * html body {
    background-color: #68B5BF;

    Not nearly as elegant looking, but probably a slightly better experience for IE6 users… not sure if there’s any other possible fixes for this…

  49. One of the more beautiful themes I have seen. I have been using it for some time now. Thanks. I was wondering how difficult it would be to make a three column ‘Orange Sky’? I have always liked the three column format. Just wondering out loud.

  50. I love this design. I am using it for a health themed site. However the PAGES template has an error in it. It does not recognize the paragraph tags and runs everything together.

    I quickly tried other templates I have loaded in there and the pages page works. I’d hate to have to hot use the pages function because it doesn’t work right to represent the content.

    Any clues as to why this isn’t working? I’ve made no modifications to the original template page.


  51. I have the same problem, Cheryl. Any ideas how to fix this, folks? I adore the design, but this is driving me a little bonkers.

  52. Would you ever think ofconverting the Orange Sky theme to be used with other systems? Like Xoops or Mambo?

  53. I just wanted to ad a note:

    I had problems with the line breaks in pages. No matter if I but in breaks or tags I would have no line break for my pages (posts were great).

    To fix I took out the margin: 0; and padding: 0; under the p tag.

    A half assed hack, but it worked.

  54. Hi, I attempted to send you a trackback but wasn’t able to. Just wanted to let you know that I’ve converted your theme to MT. It can be seen here.

  55. Since so many people are having trouble with the aboutpage and pages, can you create a fixed-up version of orange sky?


  56. Hi! The theme is very nice, i’m currently using it on my site. I’ve just modified the logo and added line separator for every post. thanks for the great theme!


  57. hi! nice theme! i love it! but i have a question, where do i change the url of about and link in the top area?

    i have no idea what to do with this



  58. sorry, didnt came out the code.. i mean

    (li)(a href=”(?php bloginfo(‘url’); ?)”)contact(/a)(/li)

    () for

  59. herman, try this:

    On header.php, replace

    <ul id="menu">
    <li><a href="<?php bloginfo('url'); ?>">home</a></li>
    <li><a href="<?php bloginfo('url'); ?>/about/">about</a></li>
    <li><a href="<?php bloginfo('url'); ?>/links/">links</a></li>


    <ul id="menu">
    <?php wp_list_pages('title_li='); ?>

    For more control on wp_list_pages tag, check info on this page:

  60. Hi,

    This is a wonderful theme, I have decided to use it for my wedding blog wedding.thosedudes.com

    It work fine in firefox but in ie, it breaks the right sidebar, this depends on the content, it seems to break on as long as the content. So the longer the page textthe more it breaks. There is a gap on the sidebar wherever the content appears.

    Anyone have any ideas why this is happening, I would be happy with the help as we need to get the webite finished for the guests.



  61. […] I don’t have a link to the theme on my sidebar so if you’re curious then i can tell you that the theme is called “Orange Sky”. I only changed the sidebar a little bit but i’m thinking of changing the header and make the general color palette a little bit darker. The whole site is still work in progress, maybe i should put somewhere a beta badge. Wuhan, who also uses this theme, has two nice css-goodies which i’ll add in the next days. Plus i would like to add tags for Technorati but haven’t understood it totally. There’s already at the end of a post a button to post it to digg or del.icio.us and i’m sure i’ll find more things to play with and add. Share and Enjoy:These icons link to social bookmarking sites where readers can share and discover new web pages. […]

  62. […] Yes you heard right, I have finally changed my blogs template to this sexy new one. I was sick of all the dark colors on the old one, I bet you guys where too? This new design I’m using is a freebie I found online, I pimped it out a lot and added a picture of my girlfriend at the top, is that ok with you guys? I also need add the designers link back into the footer, along with the “part of developer hut, inc.” bull crap I put on all my sites. The designer that I had worken on a design didn’t really pull though, and I didn’t want to spend that much on a design, so here is this one.. […]

  63. Hi Nao! I’ve looked at most of the other entries submitted for the competition, and though I have no idea what the judging criteria were, aesthetically to me at least, this one definitely won hands down!! 😀

  64. @Randy,
    Yes, it will work on 2.5 (and 2.6) even though you might want to add <?php the_tags(); ?>to display tags.

  65. what i must do? i changed thethe a bit..and now the sidesare NOT looking like the fray ”paper”..what can i do?please help me 🙂

Comments are closed.