GravityCube
Development, design, and simplicity.

New BlogEngine Theme - ThemeEngine.NFL

Friday, 18 January 2008 00:12 by jf26028

Introducing ThemeEngine.NFL, an experiment in BlogEngine dynamic theming. 

I have been working on lots of ideas around BlogEngine lately, and I have found lots of themes that I would like to convert from lots of other places.  But, for the most part, I am pretty conservative when it comes to my blog design, and I tend to really like the 2 or 3 column pages, with a header, menu, and footer.  And, with that being the case, I thought it would be really easy to create a base structure, 2 column in this instance, and generate a whole bunch of color schemes for it, and let the visitors decide which they like the best.  And, with that idea, ThemeEngine was born, and built as a proof of concept.

After I got the initial structure and scheme defined, I just needed a bunch of color schemes to fill it out.  I needed a set that was big enough to prove the point, but not just a random set of colors.  Somewhere along the line, I decided to generate a color scheme for each team in the NFL.  Unfortunately, some teams have really ugly colors, and it reflects in the theme.  (Sorry Bills fans.)  This theme is not meant to be a perfect set of themes for all the NFL teams, but a base to prove what could be done with BlogEngine, so please forgive some of the unpolished themes contained here.

The visitor preference is set in a cookie, and is completely managed in the template, so no modifications to BlogEngine are required.  And, if you open the site.master.cs file, you can turn off the visitor selectable theme by setting the COOKIE_ENABLED constant to false, and it will use the theme in the DEFAULT_THEME constant.  Maybe it would be cool to build an extension to enable you to set these configuration values from the administration section of BlogEngine, but that's not available right now.

The following screenshots were all taken of the same theme, with a visitor-selectable color scheme.

ThemeEngine.NFL.1.0.Screenshot  ThemeEngine.NFL.1.0.Cowboys  ThemeEngine.NFL.1.0.Bears  ThemeEngine.NFL.1.0.Browns  ThemeEngine.NFL.1.0.Eagles  ThemeEngine.NFL.1.0.Packers  ThemeEngine.NFL.1.0.Seahawks  ThemeEngine.NFL.1.0.Vikings 

Demo:  http://www.gravitycube.net/blog/?theme=ThemeEngine.NFL.1.0

Download:  ThemeEngine.NFL.1.0.zip

This opens up lots of doors for people running different kinds of blogs.  Say you ran a celebrity gossip blog, and you could design themes for your favorite celebrities and let the user pick their favorite while they browsed your site.  Or, if you actually did run a sports/NFL blog, this implementation would be great.  And, the same idea could be applied to all sports, or practically any other genre out there.  The options are limitless, and this is just one more example of how BlogEngine enables you to do whatever you want with YOUR blog.

Anyway, check out my experiment, and let me know what you think, or if you find any bugs.  And, please forgive some the lack of tuning on the actual designs. 

Special thanks go out to Adam Zastawski and Jason Lay for all their help and inspiration.

Jesse Foster | jf26028

kick it on DotNetKicks.com

Currently rated 4.6 by 10 people

  • Currently 4.599999/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5
Tags:   ,
Categories:   BlogEngine.NET | Themes
Actions:   E-mail | del.icio.us | Permalink | Comments (11) | Comment RSSRSS comment feed

Related posts

Comments

January 18. 2008 05:55

Mike van Zandwijk

Jesse, one word: wow!

You nailed it with doors opening up now, thanks a bunch!
I'm wondering if a site powered by BlogEngine.NET, could ...
specify a different theme per page (or even per post)?

What's your thought about that? I'd love that feature!

Mike van Zandwijk

January 18. 2008 10:40

jf26028

Mike,
There are tons of possibilities. I mean, with a little work, you could do something like implement a theme per category, so all your tech posts could have one theme, while your OT posts could have another. Or, you could specify a theme per page, and if you were going off on a rant, it could be all red and angry, but if you were stoked on another post, it could have a completely different theme. Like I said, I dont think the true power is in the actual designs in this theme, but more of what is possible.

Jesse Foster | jf26028

jf26028

January 18. 2008 14:30

Amr

Good work on this dude, I like the concept.
With BE theme architecture can we make something like each category has its own theme, or even by tags or I don't know lots of ideas?

Amr

January 18. 2008 15:37

Kirk Palmer

It is a nice demo, but would be more interesting imho is applying some themes with drastic changes, like the styles at http://csszengarden.com/ but designed as a comptible theme...

Kirk Palmer

January 18. 2008 16:59

jf26028

Krik,
I agree. This was a first pass, but if you want to implement something like that, I would love to see it.

Jesse Foster | jf26028

jf26028

January 18. 2008 18:01

Mike van Zandwijk

Jesse, yes category-based too, brilliant idea!

Man, before we know it, BE.NET turned into a full-blown content mgt system! Speaking of CMS, one of the dev leads might be interested in your "flexi-theme" ideas for his still early spin-off (PE.NET).

Perhaps we could bring it up?

Mike van Zandwijk

January 18. 2008 18:23

jf26028

Mike,
Bring it on. I'm interested, but I have no idea what PE.NET is. Lets talk.

Jesse Foster | jf26028

jf26028

January 19. 2008 10:18

Mike van Zandwijk

Jesse,

Excellent! Just sent you an email and pinged Roman's project site.

Cheers!

Mike van Zandwijk

January 23. 2008 19:28

Han

It's really nice! Escepically the logo on top left, thanks!

Han

January 29. 2008 10:49

pingback

Pingback from dotnetblogengine.net

Themes

dotnetblogengine.net

March 7. 2008 15:42

Mike

I get errors when I try changing the theme in the drop down.

Validation of viewstate MAC failed. If this application is hosted by a Web Farm or cluster, ensure that <machineKey> configuration specifies the same validationKey and validation algorithm. AutoGenerate cannot be used in a cluster.

Mike

Add comment


(Will show your Gravatar icon)  

  Country flag

[b][/b] - [i][/i] - [u][/u]- [quote][/quote]



Live preview

May 17. 2008 03:47