Comic Book Hero Theme

I’ve been searching for a new theme, and nothing out there really said “me”. My other themes have been fairly modest and simple and this time I wanted something with big bold bright colours and some pop out graphics. Hopefully the comic book inspiration is evident and makes you feel a bit like you’re reading something equally as entertaining.

Comic Book Hero Screenshot

Isn’t it beautiful?

2011-11-15: I’ve noticed a lot of searches for “comic book theme wordpress” coming in. I haven’t made this theme available for download, as I like that it’s unique to The Geekorium, but I’ll happily make it available in the theme directory if there’s any demand for it. So if you’ve come here looking for a theme like this, let me know by commenting or +1’ing and I’ll look into getting it out there for people to use. You’d have to be patient though, it’s not ready to go as it is.

About this theme

This theme is a two column, fluid wordpress theme. It supports threaded comments, the WP-Footnotes Plugin and the Author Exposed Plugin out of the box. It supports the Wordpress image/caption combo, but I prefer using my own style:

This is a clever caption

So it supports this too.

Credits and Thanks

Colour Scheme

The colour scheme is based on one of the “Pop Art” palates from the Adobe Suite.

Layout

Firstly I’d like to thank Andy Taylor for his astonishing and excellent CSS Grid. The grid resizes fluidly from a 1140px width down to iPhone size and took almost no effort to implement. Go ahead and try it!

Fonts

Kilogram is the chunky title graphic you see up there. Hetilica Bold gave the pop-out graphics a bit of a comic hand-lettered feel. Quicksand is the stylish little rounded font that peppers the site. Code Bold by Fontfabric is the font in the post headings and main menu. Beyond that, I’m using the default typography of the CSS Grid I mentioned earlier! All embedded fonts are free for use and distribution as far as I’ve been able to determine. If you disagree, please let me know so I can investigate further.

Graphics

All pop-out graphics used are from a Vectorstock set by Kraska. Thank you Kraska - they’re beautiful.

Comments

Thank you to Chris Coyier for his “Custom Comments HTML Output” that helped me get the comments looking just the way I wanted them (now hidden by Disqus…)

Everyone else

There are a million tutorials out there that I use every time I make a new theme that I don’t even remember the next day. Thank you all.

Disclaimer

I’ve done my best to cover all my bases, but I can’t guarantee I’ve missed something. If you find something wonky, let me know and I’ll sort it out.

Updates

2011-03-19 Fixed some issues in IE 7-8:

  1. Picked some fonts from the basic windows kit to display instead of the custom fonts. IE8 can use @font-face, but needs separate .eot files to make them display, when most come naturally in ttf/otf format. Typical Microsoft. As punishment, you get a smattering of Comic Sans MS instead of Hetilica.

  2. Fixed the display of pictures. Apparently IE needs a width on the figure element or it disappears the whole thing. I’ve given images a default width of 100% to fix this.

Removed a closing tag that shouldn’t have been there.

Claim Theme

A new theme for a new year - only one week early.

I loved my last theme (actually, my last two themes - but the C64 one was a throwaway), but every time I make a new theme I learn something, and I wanted to incorporate some of my new skills into a new theme.

Claim Theme
        Screenshot

Screenshot of my latest theme - Claim

Inspired by my most loyal reader (hello dad!) I’ve created “Claim”, a theme to help me stake my claim to my peice of the web, that’s easier and clearer to read. It’s inspired by many, but fettered by nunn.

The Claim theme includes built-in support for these plug-ins:

  • Creative Commons Configurator - creates a licence that can be included at the base of your individual posts.
  • Link Summarizer - provides a list of the included links at the base of each post. Configured for printed pages only.
  • Ping/Track/Comment Count - Counts the comments seperately from the pings. Recommended for correct function of this theme
  • ShareThis - places a button for sharing the post in various social networks or via email at the base of each post.
  • Wavatars - an awesome plugin that creates a unique avatar for each commenter, or uses their gravatar if they have one.

Please bear with me as I tweak things around here, and if there’s anything you think I can fix, please let me know. As usual, I haven’t tested it on IE7 or earlier, so you might notice some wackyness using those browsers. I’ll sort that when I can.

Credits

Jon Tan(Jon Tan(gerine), designer and typographer) has an excellent site on design etc that you should visit (actually, his site is awesome and you shouldn’t visit ‘cause it’ll make me look bad). His site has a left margin for asides and captions which inspired mine. Hopefully he won’t mind me pinching his idea.

Tomorrows Laundry provided the blank theme that I styled and chopped up using TextMate(Top-notch text editing for the mac) and CSSEdit 2(Excellent CSS editing for the mac).

The Yahoo YUI library(link to Yahoo YUI) created the base CSS that this site is built on.

Update: 2008-01-05 Version 2.0 The “Claim” theme was not validating properly due to the Yahoo Reset, so in version 2.0 I’ve switched to Blueprint(Blueprint, a CSS framework).

Blueprint is a CSS framework, which aims to cut down on your CSS development time. It gives you a solid CSS foundation to build your project on top of, with an easy-to-use grid, sensible typography, and even a stylesheet for printing.

Blueprint CSS (Blueprint, a CSS framework) at Google Code

Today’s update also includes the Blueprint print stylesheet and some extra jiggerypokery thanks to Footnote Links(Build fancy footnotes for printed pages) created by Aaron Gustafson(Original A List Apart article by Aaron Gustafson on Footnote Links).

Update: 2008-01-09 Version 2.1 finally fixes the issues with the left margin caption/cite/metadata positioning. Now if the post markup is correct the page will render perfectly on every browser I’ve tested.

Update: 2008-04-13 Version 2.6 Introduces:

  • A tag page with tag cloud
  • Category page title and tag title integrated into page heading
  • Removed a hard coded reference to this site
  • Changed class “updatedate” to “date”
  • Improved the category/archive pages
  • Fixed a couple of img placement problems
  • Better compatibility for linux (fixed fonts)
  • Styled the RSS feed widget to match theme
  • Nicer sidebar styles
  • Tag links added to pages

Update: 2008-04-21 Version 2.7 Introduces:

  • A hard-coded about section, independant on widgets. The About section displays the Biographical Info found on your profile page on most pages, but on category pages, it displays info about the category. I may expand this later to include post excerpts.
  • Built-in support for the Link Summarizer(Plugin page for the Link Summarizer plugin) plugin. This produces a list of all the links in the post, and replaces “Footnote Links” that left numbers everywhere when styles were turned off. The list will only display on printed pages.

LOADING... READY. RUN

A screenshot of a wordpress theme showing website text that looks vaguely like the Commodore 64 initial boot screen

LOADING... READY. RUN

I loved my old Commodore 64. It had fantastically playable games, neat 16 colour graphics, and that awesome SID chip for the charmingly wonky C=64 sound. You could program on it, play on it, wait for things to load on it…

It had cartridges, it had a tape drive, it had a clunky disk drive that worked marginally faster than the tape drive. Really, it was shit compared to what we have today, but man-oh-man it still outstrips every one of the computers any true geek has ever owned since.

On Monday, the Computer History Museum in Mountain View, California, will celebrate the C64’s 25th anniversary. CNN article on Commodore 64 anniversary

In August 2007, the Commodore 64 made it to 25 years old. And in honour of the Computer History Museum’s celebrations, I have created a Commodore 64 Wordpress theme to add to my website. If you’ve come to this page wondering why my site is all big and blue and chunky - it’s to pay respect to a truly wonderful computer.

If you’ve come here looking to get the theme yourself - let me know and I’ll see if I can make it available to download. It’s still a work-in-progress, so expect to see some changes before things finally settle and I haven’t tested it on any versions of IE. It’s a little harder to navigate, so I’ve made a menu link up there in the top right corner, so you don’t get completely lost.

I’ve made the comment areas blue too, so you can relive the joys of typing LOAD “*”,8,1 yourself, so go on and leave me a comment. And everyone, please be patient for the next two weeks and join me in remembering one of the best computers I’ve ever owned.

LOAD “*”,8,1

joshnunn Theme

Thanks for your interest in my theme, joshnunn 0.1. joshnunn is a simple two column theme with static header, footer and sidebar. My biggest achievement with it was making it entirely with ‘em’s for maximum resizable-ness!

I’ve not put any licence on it because I’ve not made it transportable to other Wordpress setups - it requires a number of plugins to work properly, and I’ve made no effort to make it customisable with other logos/icons etc. One day I may make it available, but frankly - do you want it? Really?

Feel free to take it/modify it/make it your own, but please mention me (and this site) somewhere.

This is dummy text to show off the scrolling: Integer nulla nibh, sodales eget fringilla eget, accumsan condimentum nisl. Fusce sit amet tincidunt erat. Sed consectetur posuere dui eget ultrices. Donec a leo risus, semper vestibulum mauris. Pellentesque molestie convallis lorem sed mollis. Maecenas pharetra dignissim rhoncus. Nam sem leo, suscipit id rutrum suscipit, fermentum tempus est. Nulla id lectus quis augue rutrum suscipit. Nam quis velit sed quam consectetur malesuada sed sit amet odio. Nulla posuere mollis fringilla. Nullam quis ante a urna pharetra congue.

In velit mauris, viverra eu egestas quis, lacinia eu tortor. Fusce urna neque, malesuada at varius in, aliquet vel dui. Pellentesque aliquam convallis libero, et aliquet tellus suscipit eget. Aliquam a magna purus. Fusce dolor nisl, suscipit eget lacinia pretium, congue molestie arcu. In tellus diam, condimentum a pretium vitae, dictum ut enim. Donec id diam nulla, eget adipiscing quam. Integer tempor, mi nec commodo bibendum, lorem risus blandit odio, nec rhoncus magna tortor quis est. Nam non gravida sapien. Proin elementum mauris et nibh vulputate in laoreet nisi ornare. Vestibulum porttitor urna interdum magna molestie ullamcorper. Mauris lobortis feugiat sodales. Integer non sapien sed felis hendrerit auctor et ut purus. Phasellus suscipit tellus et felis convallis dignissim. Maecenas eu porta urna.

Integer tempor mauris quis ipsum venenatis sit amet facilisis velit fermentum. Cras sit amet ante in eros mollis tempor. Mauris vel massa libero. Aenean dignissim sem dui. Nulla nec quam mi, a suscipit eros. Fusce luctus, quam ut ullamcorper porta, lectus neque semper risus, ut rhoncus augue lacus eget odio. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Duis at nulla a sem posuere ornare. Nunc cursus nunc eget enim dapibus mattis. Aliquam eu hendrerit tortor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean laoreet gravida ligula in mollis. Vestibulum gravida, nibh vel laoreet sollicitudin, felis felis consectetur orci, a elementum mauris neque sit amet odio. Curabitur magna erat, fermentum eu accumsan a, placerat eget felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque pretium metus eu sapien ullamcorper id ultricies justo venenatis.

Maecenas fringilla ultricies lectus ac mattis. Vivamus pretium posuere risus, at fermentum ipsum gravida ac. Ut adipiscing egestas mi sed tempor. Vestibulum fermentum magna in est condimentum at tincidunt mi volutpat. Fusce quis lacus id nisi dapibus pharetra. In id vehicula nunc. Nunc placerat arcu nec quam lobortis volutpat. Phasellus mattis iaculis dui eget ultricies. Mauris vestibulum purus suscipit enim suscipit porttitor. Curabitur a tellus mattis tortor pharetra semper et nec lectus. Pellentesque vitae neque at nibh ullamcorper convallis eget ut orci. Suspendisse potenti. Cras pretium nulla ut arcu lobortis id fermentum lectus venenatis. Praesent quis metus id elit fringilla mattis quis mollis sapien. Aliquam dapibus imperdiet tellus, nec cursus nunc molestie sed. Cras ornare dolor nec lacus tempus eu feugiat tortor auctor. Donec cursus elementum felis, ut varius sem tempus sit amet.

Nullam mattis mi vitae leo tempor lacinia. Mauris tempor hendrerit elit ac varius. Donec iaculis enim vitae sem pellentesque semper. Mauris interdum, arcu quis porta volutpat, dolor tortor scelerisque eros, eu faucibus mi purus id purus. Donec vel interdum ante. Vestibulum iaculis molestie congue. Aliquam vitae eros a nisl commodo semper id a tortor. Suspendisse tincidunt hendrerit lorem eget sagittis. Vivamus consequat faucibus ante, vitae laoreet odio malesuada eget. Praesent et risus ipsum. Duis placerat diam eget mi vestibulum ut hendrerit metus bibendum. In vehicula ligula rhoncus lectus ullamcorper quis volutpat massa semper. Suspendisse luctus leo a diam volutpat ut ullamcorper nunc porta. Nam vel libero ac felis ultrices tincidunt sed nec justo. In pretium fermentum dui eu tempus. Aliquam mollis euismod tincidunt. Nulla lacinia semper consequat. Sed leo risus, molestie ut consectetur et, hendrerit sit amet metus. Sed eleifend egestas fringilla.