“Elegant Grunge” is an unwashed yet crisp Wordpress theme inspired by wefunction.com. It features:

• Automatic surrounding of all images with a frame packed with eye-candy that makes images really pop out.
• A ‘photoblog’ tag page that displays entries in a photoblog style.
• A widget to display thumbnails from latest/random photoblog entries.
• Very configurable sidebar: Choose from no sidebar, a right sidebar, or two right sidebars
• The option to select a custom image as the header
• A custom page template that allows complete customisation of the sidebar: Supply a list of tags to automatically display related posts, and specify any text/html to be displayed.
• Per-page and per-post configuration to turn on and off automatic image framing, among other things, and a global configuration interface – turn on/off the RSS link, set your own copyright message, or add your own extra header content – like adding a rel=alternate link to your Twitter feed.
• A ‘feature’ footer that you can add widgets to.

See Elegant Grunge in action right here, on my blog (Specific things to see: Photoblog, custom sidebar, image framing)

If you like Elegant Grunge, please consider buying one of my products, or using the donation link to the right.

Known Issues

IE7 doesn’t display the image frames properly when they have a caption. There are reports that Opera also has some issues.

Firefox 2 apparently has some problems drawing the image frames.

Language Packs

Many thanks to contributors!

Casual German/Deutsch – by Markus Bischof

Formal/polite German/Deutsch – by André Heil

Italian/Italiano – by Paolo Lucciola

French/Français – by Arnaud Ball

Romanian – by Adrian Nitescu

Arabic/العربية – by Mena

Finnish/Suomi – by Antti

Turkish/Türkçe – by Mehmet

Brazilian Portuguese – by Jandeilson S. Barbosa

Spanish/Español – by José Vergara

Norwegian/Norsk – by Vipblogg

Russian/русский язык – by Sergey aka Cepxuo

Czech – by Bengo

To use these language packs, you must download the Wordpress language pack first, copy it into wp-content/languages, then edit wp-config.php and set the WPLANG value to the appropriate language abbreviation (eg ‘fr_FR’). Then unzip the Elegant Grunge language pack into the wp-content/themes/elegant-grunge folder, and you’re set.

Community

Wordpress Theme Elegant Grunge Template Addon for built-in Wordpress Gallery – Sebastian Graß

Notes

• To get the most out of the photoblog features, install the Lightbox plugin (it’s awesome, trust me), then turn on Lightbox mode in the theme preferences (Admin -> Design -> Elegant Grunge)
• To stop an image being framed, set its class to include “noframe”. To stop all images being framed, turn off image framing in theme preferences. This is particularly useful if you’re using NextGEN gallery – turn off image framing for the page or post that contains the gallery, under ‘Manage’.
• If you use Twitter, you can add your Twitter RSS feed to your blog by adding the <link rel…> tag to ‘Extra header content’.
• To constrain the size of photoblog thumbnails, set a thumbnail size in theme preferences. To do it properly, turn on ‘Create scaled thumbnails’, which will create a small thumb image cropped from the original to maintain aspect ratio.

Photoblog

The Elegant Grunge photoblog is a tag page, with a supporting widget, which lists all entries tagged ‘Photoblog’ with thumbnails, taken from the first image in the post. To use it, just post images in entries tagged ‘Photoblog’, and the theme will do the rest. If you have the Lightbox plugin installed and have enabled the Lightbox setting in Elegant Grunge options, it will use the Lightbox effect. If the corresponding setting is enabled, thumbnails can also be generated, at a configurable size.

FAQ

Q: I’m new to Wordpress. Would you help me set up my site?

A: I’m sorry, but I don’t have the resources to help you. Please ask your question at the Wordpress Forums. These kind of questions sent via email will be ignored, I’m afraid. Don’t hate me, I just get an awful lot of them.

Q: I’m having a problem with Elegant Grunge

A: Make sure you’re using the latest version, then ask again. Don’t ask for assistance until you’re using the latest version, because your problem may have already been fixed! This especially applies to any problems with preg_replace_callback.

Q: I’m using NextGEN gallery, and Elegant Grunge’s image frames are interfering!

A: Turn off image framing for the page or post that has NextGEN in it. The configuration is right there on the edit page.

Q: I don’t like those image frames! How do I turn them off?

A: Easy! Just open Elegant Grunge’s configuration (Administration, Design, Elegant Grunge) and untick the checkbox. You can also disable them on a per-post or per-page basis, on the edit pages.

Q: The theme is putting image frames around the wrong images! (such as small icons, etc)

A: Elegant Grunge will avoid framing images that are too small for it to work well. However, it only knows how large images are if you put the image width and height in the img tag. So, either specify width and height of your image, or add class=’noframe’ to the image tag. Specifying a class of ‘noframe’ will always make Elegant Grunge avoid framing that image.

If you have images that you want to avoid framing, that have a class set on them, you can also add that class to the ‘Don’t frame images with class’ option in Elegant Grunge’s configuration.

Q: There are huge image frames surrounding my Sociable (or other similar plugin) icons.

A: As described in the last answer, add the image class name to the ‘Don’t frame images with class’ option in Elegant Grunge admin. For Sociable, this is ’sociable-hovers’. Elegant Grunge determines whether to frame images by looking at the image sizes. Sociable doesn’t add dimensions to its image tags, so Elegant Grunge doesn’t know how large the images are. However, we can ignore these by identifying their class name.

Q: I’m getting strange errors (like ‘Fatal Error: Call to undefined function is_tag()’)

A: Your Wordpress version is too old. Elegant Grunge supports version 2.6 and up. You should probably upgrade. Contact me if this isn’t feasible for you, we’ll see about making the theme more backwards-compatible.

Q: What’s this photoblog thing?

A: Primarily, it’s a ‘tag’ page – a custom page that is used to display a tag. So, if you tag your entries with ‘photoblog’, then view the photoblog tag page, they’ll show up with just the images there, like a gallery. The photoblog widget displays these entries.

Q: I installed the Paged Comments plugin and it doesn’t look right

A: There are one or two changes required to be compatible with Elegant Grunge. Grab the theme for the Paged Comments plugin (not compatible with version 1.0 or newer; use WP 2.7’s inbuilt paged comments for this)

Q: The photoblog shows just broken images instead of thumbnails/I have ‘Create scaled thumbnails’ enabled, but the thumbnails are still just the original images.

A: Thumbnails are generated and saved in the wp-content/elegant-grunge-thumbnails directory. So, either the permissions are not set to enable saving to that folder, or you do not have the GD library available to create the thumbnails in the first place.

Add write permissions to the wp-content folder, or create the elegant-grunge-thumbnails folder within wp-content and set write permissions on it. If you’re still not getting thumbnails appearing, your server probably doesn’t have GD. Turn off thumbnail creation in Elegant Grunge configuration.

Q: What plugin are you using for your photos/gallery?

A: NextGEN Gallery. NextGEN also powers the four random images at the bottom of this page. The images at the top of the sidebar are the Elegant Grunge photoblog widget. Don’t forget to turn off image frames for the page that holds NextGEN Gallery. At some point I’ll make an Elegant Grunge theme for NextGEN to solve this problem.

Q: How do I left-align or right-align my custom header image?

A: You have two options. The simplest is to simply make your custom header image the same width as the Elegant Grunge header, then you can position it however you want. This is the recommended solution. The alternative is to edit Elegant Grunge’s header.php, around line 22, the line beginning with background:, and change the center value to something else, like left or right.

Q: I want to translate Elegant Grunge to another language

A: Fantastic! Versions from 0.4.5 are localizable, and contain the default.po file for translation. Let me know when you’re done, so we can include your translation in the list above!

Q: Can I have the Elegant Grunge PSD so I can make changes?

A: Yes, you can.

Problems? Suggestions? Please do not contact me directly, as I don’t have the resources to help you. After checking the FAQ, post your question at the Wordpress forums. Please include your Wordpress version, and if the problem is related to display, include the name and version of the browser that you are using.

Related posts

• Elegant Grunge 1.0 released A significant update to my Wordpress theme, Elegant Grunge, has...
• ‘Paged Comments’ plugin theme for Elegant Grunge I’ve recently enabled the Paged Comments plugin for this site,...
• Elegant Grunge PSD Due to popular demand, I’m making available the Elegant Grunge...
• New Wordpress theme I’ve designed a new Wordpress theme that uses grungey elements...
• Advanced web templating with PHP and regular expressions A method to gain more control over the styling of...