Creating a Magazine Style Theme - Learn by Example
Sep 20th, 07 | 24 remarksOver the past few months, I’ve noticed the surge of a trend in blog theming - magazine style layouts (or portals). I actually made a little prediction about this, but what I didn’t anticipate was how vanilla the designs coming out of this trend would be.
Many of those I’ve seen typically have very sparse visuals and zero style. As a matter of fact, some of them just look like a bunch of columns spanning a page. I don’t consider that design. In some instances, the term minimalist has been taken a bit too literally.
Designing on a grid and integrating a couple plugins, while ignoring graphic elements and the importance of color does not automatically equal a magazine layout any more than simply straying from the standard two column layout in favor of three or four columns does.
Granted, we’re talking themes here and not customized websites. They’re specifically built with the intention that someone else will tweak the concept to completion. But what happened to design all of a sudden? A theme should still convey a message. A little personality can and should be included. Minimalism does not have to be boring.
Ok, rant concluded. ;)
So where do I find some cool themes to study?
Take a look at the exemplary magazine style layouts that follow. If you want to know how to accomplish this brand of theming, any of them would be a good starting point. Download, hack, test, rinse & repeat. It’s the best way to learn!
The Morning After is a brand new and very impressive theme in terms of quality and flexibility. It’s solidly coded, features a content-rich layout, and has plenty of room for adding your own creative flourishes. The author has also documented use and customization well.
Victoria uses a simplified layout, and although it doesn’t look to be quite as flexible with regard to manipulating posts, there are three sections for showcasing content which would at least provide for easy modding of the design.
As previously featured on Design Adaptations, Revolution promises to be just that. Though I have not purchased this theme for myself to tear apart and learn from (yet), I’m familiar with Brian’s work. I have no doubt this theme was put together with thought, precision and thorough testing.
I’m not a big fan of left-aligned sites, but Gridlock would provide a solid foundation for adapting your own site to a magazine layout, and has a few home page customization features built right in the Options panel. The code looks a little convoluted, but I’m still a beginner with PHP, so if something isn’t really obvious to me, I struggle a bit.
Small Potato’s latest theme Wrath, which he’s currently running, is about as clean a layout as you can find. Although I suppose it’s not categorically a true magazine layout, it could easily serve as one without a whole lot of tweaking. In fact he has several tutorials on his site that would get you on your way quickly.
Learning by example is a great way to not only gain a better understanding of theming, and the capabilities of WordPress, but you’ll also build upon your experience and eventually create something truly remarkable of your own!
Update: 4/24/08 - Had to add a plug here for my own magazine style theme, Cornerstone 2.0, released just this morning. ;)
Hey Don, not sure what’s going on with the display of your comment, but thanks for the links. Nice job on your Victor project. :) Looks good!
I hadn’t seen the BlogOhBlog& theme, but I just downloaded it and will definitely play around with it this weekend.
p.s. Relinked those for the benefit of everyone who cant see your post, sorry about that.
Sep 20, 07 | 4:56 pmIf I had to guess, I bet I left a tag or quote open in one of my links.
Sep 20, 07 | 5:37 pmWell I checked through your post and didn’t see any errors. The link “allowance” settings aren’t the problem either. This has has happened twice before (on 2 different themes) and I never have been able to sort out the cause. My apologies.
Sep 20, 07 | 5:58 pmHey Charity, thanks for the plug - great review of some good themes! Check your Yahoo email, Santa left you a present.
Sep 20, 07 | 9:18 pmYay! I adore presents. :)
Sep 20, 07 | 9:34 pm[...] of good information into small screen spaces. While you are at it, check out Charity’s “Creating a Magazine Style Theme by Example“. (No Ratings Yet) Loading … Sphere: Related [...]
Oct 5, 07 | 2:54 pm[...] of good information into small screen spaces. While you are at it, check out Charity’s “Creating a Magazine Style Theme by Example“. Share and Enjoy: These icons link to social bookmarking sites where readers can share and [...]
Oct 5, 07 | 3:17 pmInteresting themes. I’ve been wanting to do a mag theme for my site, but I can’t design for squat. These should be nifty.
Oct 5, 07 | 10:02 pm[...] The Best WordPress Magazine Themes Available列出了10款杂志风格的wordpress主题，不一定真的是最好的10款，但是每一款都很有特色。其它也有一些类似的列表，比如Brian Gardner’s Revolution的收费主题列表。如果你想自己动手的话，可以看看“Creating a Magazine Style Theme by Example“ [...]
Oct 6, 07 | 12:11 amI’m starting to love these magazine-style themes. I just installed Victoria and suited it to my needs a little bit (http://psnow.es) but with this post I just got so much inspiration that I feel like I’m going to be making some big changes soon. :D
Oct 6, 07 | 2:41 amI know what you mean Macrike. I fall more in love with magazine layouts with each one I discover! It seems I’m not the only once because they’re cropping up everywhere now. Or maybe it’s just one of those things where once you start looking for something, it’s everywhere.
I’m trying to piece together some ideas for a magazine redesign once Pink for October has run its course here… but there’s so many good ideas to mashup into one, I don’t know where to begin! :)
I’m glad you found the post inspiring!
Oct 6, 07 | 8:45 am[...] Creating a Magazine Style Theme - Learn by Example | Design Adaptations Take a look at the exemplary magazine style layouts that follow. If you want to know how to accomplish this brand of theming, any of them would be a good starting point. Download, hack, test, rinse & repeat. It’s the best way to learn! (tags: wordpress themes design) [...]
Oct 6, 07 | 7:22 pmIf you want to know how to accomplish this brand of theming, any of them would be a good starting point.
If you’ll permit the self-link, I wrote something this summer about manipulating Wordpress functions to accomplish a magazine layout, but this section of the Codex is also a good place to start. The evolution of the magazine layout is interesting - it was only a matter of time before people wanted their content broken into more compact chunks rather than displayed in traditional blog/sidebar format. Like everything else, those layouts will look quaint in a few years!
Oct 22, 07 | 7:10 pmvery helpful, thanks!
Oct 24, 07 | 10:52 pmI agree with Darren and you too, Charity. Magazine layouts will gain popularity in a near future. Possibilities and adaptations are very large with some imagination, even for a photoblog or a gallery of pictures as i do with Darren’s Mimbo.
Oct 29, 07 | 4:43 pm[...] other magazine-style themes that I didnt’ know about and thus haven’t explored yet. Design Adapations also talks about creating a magazine style theme by example, reviewing some of themes listed here. [...]
Nov 18, 07 | 8:52 pmCool themes! My company is looking to redesign their entire website with a magazine look and feel so I was just researching some layouts :)
Dec 12, 07 | 12:34 pmJust wanted to mention another new magazine style theme out there. I’ve just started playing around with Structure by Justin TadLock and so far so good. I think it could use a little more gloss, but the framework looks good. Like The Morning After, it does require a bit more knowledge on behalf of the user.
Structure by Justin Tadlock
Dec 12, 07 | 12:55 pm@dandyman - Structure IS a beautiful mag theme, I agree. I just had it pointed out to me a couple days ago and downloaded it for closer look later. I haven’t had time to crack it open yet so I can’t speak for the code, but the front end is very nice indeed!
Dec 14, 07 | 3:10 pmOh, and did not know about it. Thanks for the information …
Dec 19, 07 | 11:03 am[...] several other magazine-style themes that I didnt’ know about and thus haven’t explored yet. Design Adapations also talks about creating a magazine style theme by example, reviewing some of themes listed here. [...]
Jan 5, 08 | 8:47 amSome more magazine-style themes
http://wpmagthemes.com/
Apr 6, 08 | 9:28 pm[...] 5. Creating a Magazine Style Theme - Learn by Example | Design Adaptations [...]
Apr 10, 08 | 11:29 pm