farfromfearless

Twilight Saga WordPress Theme

UPDATE (2008.08.27): I'm kind of embarrassed that I published this theme without performing any quality assurance. In any case, I’ve re-factored the markup from the ground up, and fixed many of the layout issues that were cropping up in the last build. I also wanted to clarify a couple things: this theme uses PNG’s to take advantage of transparencies such that *modern* browsers are able render them properly; second, none of the themes I develop are widget-ready – I’ll get around to it some day; and hey if you want to take a shot at it – be my guest! The theme you will download is version 2.0. If you have an older version of the theme, please feel free to replace it. My apologies for the false start.

There are so many themes out there that just don’t seem to have much of a concept behind them, in fact most seem to be little more than decoration. I don’t think WordPress themes need to always have a concept behind them, but the ones that do tend to stick around longer. I had a bit of downtime a little while ago and I wanted to create a WordPress Theme that had a little bit more of unified concept.

At the time Stephanie Meyer had just released the third book in her debut series, the “Twilight Saga”, and I had admired the book covers while browsing through my local Chapters bookstore.

There are so many books that hit the shelves these days that covers just start to blend together into one big mottled wallpaper. So it was a mild surprise when I encountered the stark black and minimalist cover designs.

book1 book2 book3

The Twilight Theme

Inspired by this, I decided to design and develop a WordPress Theme based on the book covers.

twlight

Variations

I thought I would have been satisfied with using only one of the book covers as inspiration, but the more I worked on it, the more I felt that I couldn’t settle with just one. On top of that, I think anyone who would have been interested in using the theme would likely have a favourite cover graphic other than the one I preferred most.

Here are some variations of the same WordPress theme. It didn’t take much (CSS is awesome), and I even went as far as to allow customization with quick modification of one of the theme files.

wp_theme_twilight wp_theme_newmoon wp_theme_eclipse

Now WordPress authors can use either one of these themes. There’s a fourth book that is coming out: “Breaking Dawn” which I will try to add to this series at a later date.

Download

Okay, so I’ve rambled on enough, Download the WordPress - Twilight Theme v2.0.1.

Notes

BIG FYI: It looks like the comment’s code is missing from this build. I will work on getting that re-implemented tonight. My applogies for the inconvenience!

If you want to modify the graphic to achive either of the variations above, all you have to do is find the file “settings.php” in the Twilight theme folder (includes/settings.php), and edit the following snippet at the very beginning of the file:

// use either "twilight" or "eclipse" or "newmoon" to customize which graphic to show
$THEME_GRAPHIC = 'eclipse';

This theme is built on the same basic framework as my current Lemon Twist Theme. As such, you will likely want to install a few WordPress plugins that work with this theme, so take a look through this README file.

If you are running into errors when applying the theme, it is likely that a plugin is missing and is causing the problem. If you encounter this, check out the “includes” directory and modify any of the offending includes in the “sidebar” sub directory.

Still at a loss? Contact me.

  • (110) Comments
  • RSS 2.0
  • farfromfearless

110 people have left comments

CharliWag - Gravatar

CharliWag said:

Very Nice theme… Almost droped my beverage when I saw you had a new theme. I would love to see a demo site to get a peek at the whole thing. Being me, This theme is quite attractive as judging by the screen shot seems not extremely hard to modify (colours, header, sidebar structure). Thanks alot for the great work. Not an update to the Lemon Twist as expected but still beautiful.
Thanks
~Charli

Posted on: July 12, 2008 at 8:24 pmQuote this Comment
CharliWag - Gravatar

CharliWag said:

P.S the bar at the top looks really smooth and though is not extremely noticeable I think it adds quite a bit to the layout. I’d Love to see more themes with the top page navigation (great example: http://chris.pirillo.com/ the subscribe and help buttons).
(Sorry for the double comment)
~Charli

Posted on: July 12, 2008 at 8:27 pmQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

Thanks for your comments CharliWag, I’ll see about hosting a test site for these themes so people can see them in action (thanks for the suggestion).

Posted on: July 13, 2008 at 9:44 pmQuote this Comment
Sicarii - Gravatar

Sicarii said:

Love it!

However, I can’t seem to find the comments section right after a single post. I’ve looked through the README file for Lemon Twist and gone through this post wondering if I’ve missed anything but found none.

Posted on: July 14, 2008 at 4:19 amQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

Ugh — I swtiched systems and didn’t check in my last build (to svn) of the theme before the change. I’ll sneak the comments back into it tonight. Thanks for catching that!

Posted on: July 14, 2008 at 8:10 amQuote this Comment
Andrew - Gravatar

Andrew said:

Wow! Such a great design!

However, I’m with Sicarii on this.

Posted on: July 14, 2008 at 9:36 amQuote this Comment
Sicarii - Gravatar

Sicarii said:

That’ll be great!

Thank you, Chris, for the wonderful work you’ve done.

Posted on: July 15, 2008 at 4:15 amQuote this Comment
yat temizli?i - Gravatar

yat temizli?i said:

thank you wery much

Posted on: July 15, 2008 at 7:01 amQuote this Comment
Piggy and Tazzy - Gravatar

Piggy and Tazzy said:

Yet another beautiful looking theme from you!

But… as a couple of others have said, pretty pointless without the comments section!

*cries*

Posted on: July 15, 2008 at 10:35 amQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

Hey folks — the update is posted!

Posted on: July 15, 2008 at 8:07 pmQuote this Comment
Piggy and Tazzy - Gravatar

Piggy and Tazzy said:

Yay!

Thanks Chris!

Posted on: July 16, 2008 at 1:44 amQuote this Comment
Abhishek Singh - Gravatar

Abhishek Singh said:

I will use this theme for my upcoming Portfolio website.

Posted on: July 16, 2008 at 1:46 amQuote this Comment
Sicarii - Gravatar

Sicarii said:

SWEET! Thank you, Chris!

Posted on: July 16, 2008 at 7:48 amQuote this Comment
Sicarii - Gravatar

Sicarii said:

Chris,

I hope I’m not becoming troublesome. :-)

Just downloaded the new package, and it seems that the page links from the top menu do not work. Also, is there a way to ensure that the first line of the comments do not run, and also recognize line breaks? Right now the first line of comments are somehow indented to the right, but the indentations are not uniform, leading me to conclude that it’s not intentional.

Posted on: July 16, 2008 at 8:15 amQuote this Comment
Tazzy and Piggy - Gravatar

Tazzy and Piggy said:

Sicarii - The page links functionality is described in Chris’ comments on his previous posting about Lemon Twist theme. In short, you need to assign the page to a template. He describes it in a way that I can’t, so I suggest reading his Lemon Twist comments where he mentions this (it really is quite simple, honest). I initially found it really confusing too.

No doubt Chris will be along shortly to give a more helpful pointer than I can just now.

I agree with you regarding the comments though. I’m finding this quite frustrating too - especially with regards to the line breaks issue. The indentations and the lack of line breaks really does leave the comments looking very untidy as a result.

Not a criticism of the theme in any way - it really is beautiful, but those of us not in any way worldly wise with CSS and stuff could end up with a totally goofed theme if we attempt fixing the issue ourselves.

Any help would be great here, Chris.

Posted on: July 16, 2008 at 9:33 amQuote this Comment
Sicarii - Gravatar

Sicarii said:

Thank you, Tazzy & Piggy, for the pointer on the links! I guess I forgot that part when I first read it; my bad.

Kindly ignore my stupid question then, Chris, but I’d still love some help with the comments. :-)

Posted on: July 16, 2008 at 11:07 amQuote this Comment
WordPress 2.6-LiquidJel - Gravatar

WordPress 2.6-LiquidJel said:

[...] create my own theme, I’m borrowing from other people. As of this post, I’m using the Twilight Saga theme from http://www.farfromfearless.comTwilight [...]

Posted on: July 19, 2008 at 12:46 pmQuote this Comment
Lauren - Gravatar

Lauren said:

Love this. About to download right now. Any chance you’ll adapt this for Blogger?

Posted on: July 21, 2008 at 12:13 amQuote this Comment
Guido - Gravatar

Guido said:

Hi Chris, your style is once again very nice.

But I have a small problem.
The comment form is not displayed. Only the posts have some comments before.
You can see it on my testsite: http://www.epixio.de/testwordpress.
I´ll would be glad if you could help

Posted on: July 22, 2008 at 1:46 pmQuote this Comment
Aerador - Gravatar

Aerador said:

I too am having the comments problem. On pages that already had comments on them the box shows up to enter a comment. However on new posts no comment box is showing up at all.

Posted on: July 24, 2008 at 11:07 amQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

I’m working on it folks — thought I fixed the bug, but looks otherwise :(

Posted on: July 24, 2008 at 11:30 amQuote this Comment
Paul - Gravatar

Paul said:

Ok maybe im being thick but im trying to modify the RSS section. On the other themes I have i can do it in the widget section. I spent an hour or so trying to find where the RSS info is stored so i can change it. I surrender. Any help would be appreciated.

Posted on: July 26, 2008 at 11:05 pmQuote this Comment
izmir evden eve - Gravatar

izmir evden eve said:

thank you for sharing

Posted on: August 14, 2008 at 5:36 amQuote this Comment
Raj - Gravatar

Raj said:

very nice theme :) Thanx a lot m8.

Posted on: August 15, 2008 at 8:52 pmQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

Hi Raj — I’m currently refactoring the code for this theme as it appears to be problematic for a number of people. Stay tuned for an updated Twilight WordPress theme.

Posted on: August 16, 2008 at 3:31 pmQuote this Comment
30 Free High-Quality Wordpress Themes | Developer’s Toolbox | Smashing Magazine - Gravatar

30 Free High-Quality Wordpress Themes | Developer’s Toolbox | Smashing Magazine said:

[...] Twilight Saga WordPress Theme“There are so many books that hit the shelves these days that covers just start to blend [...]

Posted on: August 25, 2008 at 7:08 pmQuote this Comment
Doug - Gravatar

Doug said:

Hey, Chris, just so you know. There’s an if condition which prevents the comments form from being displayed. It should be closed just before the comment form. Just a quick fix.

Cheers,

Posted on: August 25, 2008 at 10:01 pmQuote this Comment
30 Free High Quality Wordpress Themes | The Creative Children - Gravatar

30 Free High Quality Wordpress Themes | The Creative Children said:

[...] Twilight Saga WordPress Theme“There are so many books that hit the shelves these days that covers just start to blend [...]

Posted on: August 26, 2008 at 3:26 amQuote this Comment
Basic Thinking Blog | Schöne Wordpress-Themes - Gravatar

Basic Thinking Blog | Schöne Wordpress-Themes said:

[...] haben auf Anhieb folgende Themes gefallen: - Twilight-Saga - Superfresh (demo) - Outdoorsy (demo) - WP Coda Orange (kein [...]

Posted on: August 26, 2008 at 6:20 amQuote this Comment
Happyblog Design . The Best Wordpress Themes » Twilight - Gravatar

Happyblog Design . The Best Wordpress Themes » Twilight said:

[...] Theme permalink: Twilight [...]

Posted on: August 26, 2008 at 6:25 amQuote this Comment
chris murphy - Gravatar

chris murphy said:

I could not resist refactoing this theme, and it looks like smashingmagazine.com picked this up so I’ll post the re-worked theme this week.

Posted on: August 26, 2008 at 8:41 amQuote this Comment
30 Free High Quality Wordpress Themes | aboutCREATION - Gravatar

30 Free High Quality Wordpress Themes | aboutCREATION said:

[...] Twilight Saga WordPress Theme“There are so many books that hit the shelves these days that covers just start to blend [...]

Posted on: August 26, 2008 at 11:12 amQuote this Comment
Paul Johns - Gravatar

Paul Johns said:

That is very nice! Simple, but very effective and artistic. Great job!

Posted on: August 26, 2008 at 11:45 amQuote this Comment
30 Free High Quality Wordpress Themes | [w3b]ndesign - Gravatar

30 Free High Quality Wordpress Themes | [w3b]ndesign said:

[...] Twilight Saga WordPress Theme“There are so many books that hit the shelves these days that covers just start to blend [...]

Posted on: August 26, 2008 at 12:31 pmQuote this Comment
Hot Freebies Store » Twilight Saga WordPress Theme - Gravatar

Hot Freebies Store » Twilight Saga WordPress Theme said:

[...] Theme details [...]

Posted on: August 26, 2008 at 12:57 pmQuote this Comment
Kathy - Gravatar

Kathy said:

Did you take into consideration the fact that the photography used on the covers of these books is protected by copyright? Unless you have permission, you should not be distributing these images (free or not).

You could avoid this by taking your own photos or purchasing images similar in style to those on the book cover.

Posted on: August 26, 2008 at 2:34 pmQuote this Comment
Afshin - Gravatar

Afshin said:

WE NEED COMMENTS FORM !!!!

Posted on: August 26, 2008 at 3:45 pmQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

The updated theme is coming (comment form included).

Posted on: August 26, 2008 at 9:25 pmQuote this Comment
30 Free High Quality Wordpress Themes - Gravatar

30 Free High Quality Wordpress Themes said:

[...] Twilight Saga WordPress Theme“There are so many books that hit the shelves these days that covers just start to blend together [...]

Posted on: August 27, 2008 at 12:37 amQuote this Comment
paskal - Gravatar

paskal said:

hurm nice theme from u as usual.. i pretty much like it :D

Posted on: August 27, 2008 at 2:57 amQuote this Comment
33 Free High Quality Wordpress Themes | CooOne.com - Gravatar

33 Free High Quality Wordpress Themes | CooOne.com said:

[...] Twilight Saga WordPress Theme “There are so many books that hit the shelves these days that covers just start to blend together [...]

Posted on: August 27, 2008 at 6:41 amQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

The updated theme is now available! Download the WordPress - Twilight Theme v2.0.1

Posted on: August 27, 2008 at 10:26 amQuote this Comment
Nimue - Gravatar

Nimue said:

I’d love to translate this theme to german… Du you mind?

Posted on: August 27, 2008 at 11:35 amQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

Sure! Go for it, Numue — let me know when you have it translated and I can host or link to it from here.

Posted on: August 27, 2008 at 11:44 amQuote this Comment
Nimue - Gravatar

Nimue said:

thanx… as soon as I am ready, I’ll tell you. :-)

Posted on: August 27, 2008 at 12:08 pmQuote this Comment
Afshin - Gravatar

Afshin said:

Thank you dear Chris , I’m from Persia and I’m sure everybody will love this theme , and behalf of them , THANK YOU …

Posted on: August 27, 2008 at 1:08 pmQuote this Comment
Nimue - Gravatar

Nimue said:

my testinstallation gets an error on the index-page http://fauna.sternengarten.info/
also the css for the pages has changend :-(

Posted on: August 27, 2008 at 3:57 pmQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

Hi Numue, you will need to activate a plugin (the_excerpt Reloaded), which you can download here.

Posted on: August 27, 2008 at 4:23 pmQuote this Comment
Piet - Gravatar

Piet said:

Hey Chris,

What an AWESOME theme you’ve made! Really, im hunting for theme’s for months now, seen some nice ones but this one is really beautifull. I have one problem with running it though, can’t post the URL because I’m using my old theme for the time being but you can see a screenshot here: http://home.quicknet.nl/qn/prive/buijsmanp/twilight.png

As you can see only the first post has the ‘paper’ background. I don’t think thats supposed to be like that right? The links you see in the other posts aren’t clickable while they are at other theme’s. I already downloaded and actived the plugin you mentioned above. Do you have any idea what is wrong? (I’m still running wordpress 2.3, could that be the problem?) But very nice once again! If the problem is fixed I will surely use it!

Ow yeah, and I read every reply here and Kathy said the images from the books where copywrited. I really don’t hope you get problems with that after making such a wonderfull theme.

Kind regards

Posted on: August 28, 2008 at 6:48 amQuote this Comment
gNcWebmaster.Com I Web 2.0 Tasar?m ve Türkiye… - Gravatar

gNcWebmaster.Com I Web 2.0 Tasar?m ve Türkiye… said:

[...] 2. Twilight Saga WordPress Theme [...]

Posted on: August 28, 2008 at 1:49 pmQuote this Comment
Piet - Gravatar

Piet said:

Regarding my previous message: just upgraded to Wordpress 2.6.1 but I’m stell having the same problem. I hope you know what I’m doing wrong here so I can finally start using this great theme Chris :). gr

Posted on: August 28, 2008 at 1:56 pmQuote this Comment
Joost - Gravatar

Joost said:

Hi Chris,

I have the same problem here. I also saw that in version 1 in the header the blogtitle was used and now the title is hardcoded in the header file. Is that suppost to be?
Regards, Joost

Posted on: August 28, 2008 at 2:48 pmQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

Piet said: Regarding my previous message: just upgraded to Wordpress 2.6.1 but I’m stell having the same problem. I hope you know …

Hi Piet, I’ve done a few things different with this version of the Twilight theme (2.0), and one of those changes is to render “older” postings different than the most recent (I have a bit of a tradition with this as you can likely tell from this blog). The pulgin youo downloaded enables the extended excerpt feature to render a little more gracefully.

Posted on: August 28, 2008 at 4:58 pmQuote this Comment
Chris Murphy - Gravatar

Chris Murphy said:

Joost said: Hi Chris,

I have the same problem here. I also saw that in version 1 in the header the blogtitle was …

Hi Joost — can you send me a link or post a screenshot so I can see what it is you are having issues with? I checked my header.php file and I don’t have anything hard-coded into the file. This is what is currently in v2.0 (note, php tags have been removed):

[title][... wp_title(' '); ][ if(wp_title(' ', false)) { echo '-'; } ][ bloginfo('name'); ][/title]

Posted on: August 28, 2008 at 5:01 pmQuote this Comment
Joost - Gravatar

Joost said:

Hi Chris,

If you check my site you can see it. There is now the tile “new moon” and the description is “wordpress theme”‘.
In the previous version the wordpress blogtitle and description were shown.
Also, if you check the photos link, the code for the nextgen gallery is shown. In the previous version the gallery worked normal.

I will sent you a screenshot of the header file.
Thanks for the quick response!

Posted on: August 28, 2008 at 5:07 pmQuote this Comment