Blog

“Elegant Grunge” WordPress theme

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

  • Layouts options
  • Support for custom background and header
  • Widget-ready footer
  • Optional full-width page template that removes the sidebar

screenshot.png


Get Elegant Grunge

If you like Elegant Grunge, please consider buying one of my products.

Version 1.1 has been updated to the WordPress.com version.

This version no longer contains automatic image framing, or a photoblog template, so if you wish to continue using these features, please use version 1.0.3.

Changes:

  • Layout updates and fixes
  • Fixed deprecated function calls and PHP errors
  • Code cleanup to match WordPress theme style guide: spacing, syntax, comments, package description
  • Added author comment highlighting
  • Added support for empty post title and styles for all heading sizes
  • Fixed bugs with theme options menus
  • Simplified custom functions and removed unneeded theme options
  • Remove custom header image support and use default WP header image functionality instead
  • Added image.php template
  • Added RTL language support
  • Changed post timestamp to use the WordPress global date format
  • Remove unused template files
  • Implement WordPress 3.0 features: Custom Menu, comment_form()
  • Added default WP style support: body_class(), post_class(), comment_class() and remove unneeded definition for EG_BODY_CLASS
  • Removed unneeded function_exists() calls
  • Simplified image display: no frames or photoblog page
  • Nicer typography and updated grunge images for sticky posts, trackbacks, and new date format
  • Styles for sticky posts
  • Added newer/older single post navigation links
  • Better class attributes to avoid collision with WP default classes (author, post, date, etc)
  • Remove sidebar logic check in every template (once in sidebar.php instead)

Note: If you have problems with this theme, please post your question at the WordPress forums. Please don’t contact me directly, as I don’t have the resources to help you.

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

Lithuanian – by Valentinas Bakaitis

Belorussian – by Marcis G./Galina Miklosic

Polish – by Grzegorz ‘ixcesal’ Lasecki

Dutch – by Rene (WPwebshop)

Indonesian/Bahasa Indonesia – by Kelayang

Filipino – by Mikael Riec

Danish/Dansk – by Morten Elm

Latvian – by Journal

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 GallerySebastian Graß

Paul Kaiser has written a great article on how to add navigation menus to older WordPress themes, using Elegant Grunge as an example.

Tagged , , , . Bookmark the permalink. Both comments and trackbacks are currently closed.

350 Comments

  1. Ron
    Posted January 13, 2009 at 4:19 pm | Permalink

    Hey! Awesome theme, but I have having an issue with the comments on posts. The page does not finish fully loading, and I get the message:

    Fatal error: Call to undefined function wp_logout_url() in /www/110mb.com/b/u/s/h/w/h/a/c/bushwhack/htdocs/blog/wp-content/themes/elegant-grunge/comments.php on line 122

    Any ideas??

    • Ron
      Posted January 13, 2009 at 4:23 pm | Permalink

      I am using 1.0.2 of your theme and running WordPress 2.6.5 if that helps any…

  2. Posted January 14, 2009 at 12:47 am | Permalink

    i’ve just installed this theme and i can’t get photoblog to work (have lightbox) – clicking on photoblog tag works like a regular tag.. how do u fix it?

  3. Posted January 15, 2009 at 11:10 pm | Permalink

    Hello, I have some problems with photoblog: although I selected in options to use thumbnails, when I click on “photoblog” tag it shows just the latest post. No thumbnails of others posts tagged “photoblog” and it can’t show the widget, placed in the right sidebar. Seems like it can’t load anything.

    Any suggestions? Joaquin

  4. Posted January 17, 2009 at 5:38 pm | Permalink

    your theme are greats…

  5. Posted January 18, 2009 at 10:22 am | Permalink

    Great theme. Started a new project with it. thanks again man.

  6. Posted January 20, 2009 at 5:09 am | Permalink

    Thanks for this great theme that i’m using on my personal blog.

  7. andryonline
    Posted January 20, 2009 at 6:49 am | Permalink

    How can I put on my blog a link like “loopy”? Is planned?

    Translate by Google Translator

    • Posted January 27, 2009 at 10:57 am | Permalink

      This is a div inserted into header.php, with a corresponding style added to style.css

    • Posted January 28, 2009 at 11:19 am | Permalink

      More details on that:

      Put this CSS into ‘style.css':

      .promotion {
          position: absolute;
          width: 217px;
          height: 119px;
          top: 140px;
          left: 50%;
          margin-left: 20px;
          filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/wp-content/themes/elegant-grunge/loopy.png", sizingMethod="crop");
          text-indent: -9999px;
          z-index: 10;
      }

      html>body .promotion { background: url('loopy.png') no-repeat; }

      .promotion a { display: block; width: 100%; height: 100%; }

      Then, put this HTML at the bottom of header.php:

      <div class="promotion">
      <a href="http://loopyapp.com">
      Loopy now available!
      </a>
      </div>
      

      So you just change the link, and the text, copy your image into the ‘elegant-grunge’ folder (or anywhere, as long as you adjust the link appropriately), and update both references to loopy.png in the css above, as well as adjusting the width and height properties.

      • andryonline
        Posted January 30, 2009 at 2:25 am | Permalink

        You are very kind. Thank you. If I have problems you know I will…

        Translated by Google Translator.

        • andryonline
          Posted January 31, 2009 at 2:41 am | Permalink

          It works perfectly. Thank you!

  8. Posted January 21, 2009 at 4:09 pm | Permalink

    I’m wondering how to avoid the large white/shaded frame around images that have no classification of style.

    Example: (http://jacobmadison.com/blog/2009/01/20/how-to-get-the-most-out-of-digg/)

    If you look at the bottom of the post, you’ll see several 25×25 white boxes that are inappropriately large or are framing tracking .gif (1x1px)

    Thanks!

    • Posted January 21, 2009 at 4:27 pm | Permalink

      Hi Ryan, Please read the FAQ for the answer to this question

      • Posted January 21, 2009 at 4:30 pm | Permalink

        I’ve read and re-read the FAQs and the suggestions do not help … any other ideas?

        • Posted January 21, 2009 at 4:38 pm | Permalink

          Sure:

          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.

          The same applies to your Feedburner links; in this case, there’s no class name on the image, so you’ll need to edit the plugin (Feedflare?) and add a class to the images. You may need to seek assistance in the WP forums if it is required.

          Alternatively, just turn off image framing

          • Posted January 21, 2009 at 4:51 pm | Permalink

            Thanks – I’ll keep playing with it

  9. Hasan Rahman
    Posted January 22, 2009 at 7:41 am | Permalink

    I am trying to use a danish language file but it does not seem to work. I have chosen da_DK in my config file and I have tried to place the files in the elegant grunge folder but it does not seem to work. What am I doing wrong?

    • Posted January 27, 2009 at 10:59 am | Permalink

      You’ll need to download and install the Danish language pack for WordPress, then edit config.php and set the language property correctly, as it sounds you have already (but is it really da_DK? I would’ve thought da_DA or dk_DK)

  10. Posted January 22, 2009 at 8:26 am | Permalink

    Mike, For some reason Im having problems with internet explorer, where its not fully loading when there is a post with an image incorporated. Firefox and opera have no problems fully loading. I have come to this conclusion about the image in that when i remove the post with the image everything loads fine in Internet Explorer. Is this a problem that has been approached? Thanks!

    • Posted January 23, 2009 at 3:25 pm | Permalink

      Hi, Nick; please excuse the delay in getting back to you. I haven’t had prior reports of this one. Could you post a URL where this is happening?

      • Posted January 23, 2009 at 3:41 pm | Permalink
      • Posted February 3, 2009 at 3:56 pm | Permalink

        Mike, Turns out this problem happened because of pasting the post directly from Word. No problem with the theme and internet explorer. :)

        Nick

  11. Posted January 22, 2009 at 8:40 am | Permalink

    two words “Awesome themes”

  12. Posted January 25, 2009 at 3:03 pm | Permalink

    hi..thx for this awesome n beatiful theme. I already use it on my blog…

    but, I have a problem when I use window live writer. When i publish something(text or photo), it wouldnt show up like what I write. And the photo wouldnt show up as well. it’s only look like html code. U can check it on my blog : http://www.sketchoflife.co.cc what should i do to fix this??

  13. kyle5434
    Posted January 26, 2009 at 8:49 am | Permalink

    Quick question – I’ve looked though the CSS and header.php files and haven’t figured it out on my own…

    I’ve specified an image for the header in the theme settings, but the image displays centered in the header area. Is there a way to have it left-aligned (like the menu above and the content below)?

    Thanks for any pointers.

    • kyle5434
      Posted January 26, 2009 at 2:16 pm | Permalink

      Never mind…I ended up just pasting my graphic into the header.jpg graphic.

      • Posted January 27, 2009 at 10:59 am | Permalink

        Please excuse the delay; your solution works, but other possible solutions include expanding your png to the width of the header, so the actual content sits in the right place, or by editing style.css.

  14. Posted January 27, 2009 at 10:52 am | Permalink

    Any suggestions as to why my index page doesn’t appear properly? individual pages are fine.

    http://www.jacobmadison.com/blog/

    • Posted January 27, 2009 at 11:01 am | Permalink

      Hard to say, Ryan; I suggest you do some isolation testing, open each post individually in turn until the problem appears.

  15. Posted January 29, 2009 at 12:25 pm | Permalink

    Beautiful, very well done

  16. Posted January 30, 2009 at 11:59 am | Permalink

    any idea what i can do to fix photoblog? i left a comment earlier about tag working as a regular tag.. thanks

    • Posted January 30, 2009 at 12:30 pm | Permalink

      Sorry about the delay, Steph. The most recent entry of the photoblog shows as a normal post; subsequent entries appear as just their images. See my photoblog for an example. You have only one photoblog entry, so it appears as a normal post.

  17. Posted February 1, 2009 at 6:48 am | Permalink

    Hi there. I’m having an odd 406 issue using Elegant Grunge 1.0.3 on WordPress 2.7 on my blog at http://www.deadpan.net/caco. I’ve tested this with IE, Firefox, and Chrome. When I try to post a comment to the newest entry, I get a 406 error saying: “Not Acceptable

    An appropriate representation of the requested resource /caco/wp-comments-post.php could not be found on this server.

    Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.”

    I get similar errors when I click on the Home or About buttons in the header and link in the sidebar. I only get these errors from the individual page for the newest blog entry. All of these work properly if I go into an older entry.

    Any suggestions?

  18. Posted February 1, 2009 at 9:48 am | Permalink

    Nevermind… My problem isn’t with your theme, it’s with the permissions on my server. I think I need to contact my server’s admin.

    I am liking your theme, btw. It’ll be great once I iron this wrinkle out.

  19. Posted February 1, 2009 at 10:57 pm | Permalink

    Fantastico!!! :)

  20. Posted February 3, 2009 at 8:19 am | Permalink

    Hi, i have translated the Po file to arabic.. Here is the file : Link

    Thank you, Mena

  21. Posted February 3, 2009 at 1:31 pm | Permalink

    thanks :) great job on the theme btw

  22. Posted February 4, 2009 at 5:55 pm | Permalink

    hmm.. photoblog page still only displays the first latest entry and widget still doesn’t work. it doesn’t say in your faq, but do photoblog-tagged entries need to be image only, no text?

    • Posted February 4, 2009 at 6:04 pm | Permalink

      Hi Steph – Ahh yes, that’s definitely a problem!

      Without seeing your WP/Elegant Grunge configuration, and your backend configuration, I can’t be sure what the issue is; one possibility is that there’s an issue with your PHP installation that’s preventing the detection of images.

      A few things to try -

      Temporarily rename ‘tag-photoblog.php’ and reload the photoblog tag; do the two posts appear? (They probably will, this confirms that it’s definitely a problem with the photoblog detection)

      Do you have ‘Create scaled thumbnails’ enabled? If so, try disabling it. You may be missing a GD2 installation, and possibly lacking exec permissions or an ImageMagick installation (which is the fallback if there’s no GD2)

      Look for a PHP error log wherever your host puts it – on mine, the error log appears in my webroot if there’s a problem.

      Failing that, backup the functions.php that’s currently in the elegant-grunge folder and replace it with this debug version of functions.php (It’s a zip file, extract it first); then reload and see what it says.

  23. Posted February 6, 2009 at 9:50 am | Permalink

    hey mike.. first of all thanks for your time. i really appreciate it!

    have renamed tag-photoblog.php and the other posts appear like you expected. disabled scaled thumbs, but nothing happens. there aren’t any errors associated with elegant grunge either, the ones in the log appear to be for my prev theme. am running php v5.2.6 if that’s any help.

    lastly.. am unable to download the debug version of functions.php, i think it didn’t upload as a zip.

    • Posted February 6, 2009 at 12:07 pm | Permalink

      Oh wow, that’s new. Must be something a bit wrong with the regex that recognises php files; I’ve renamed the file now, should do the trick: functions.zip

  24. Posted February 6, 2009 at 1:56 pm | Permalink

    it sort of works now. but where images are supposed to appear it says “Successfully identified image in post” :) progress!!

  25. Posted February 6, 2009 at 4:44 pm | Permalink

    Hi again, I am using the theme and my friend loves it, I am just running into one issue in safari. the footer is off center. has anyone else run into this? I can’t seem to figure this one out. the site is: http://www.endyouranger.com thanks for any pointers.

  26. Posted February 11, 2009 at 7:10 am | Permalink

    Hi Michael! Great theme, great job, thank you!

  27. Posted February 12, 2009 at 8:05 am | Permalink

    Hi Michael,

    I just wanted to stop by and say a ‘big’ thank you to you. I downloaded your template, Elegant Grunge, and have to say I love it. Also, if I can ask you, how do you incorporate your photos? I see you have thumbnails in you sidebar. Would love to know how to do that, however, I understand if you are busy.

    Again, thanks for the free template. :)

    • Posted February 12, 2009 at 10:17 am | Permalink

      Cheers, Alex. The photos in the sidebar are the photoblog widget that’s built into Elegant Grunge – just tag posts with photos ‘photoblog’ and the photos from those posts will appear in the widget. (The widget at the bottom is NextGEN gallery, too)

  28. Posted February 12, 2009 at 10:21 am | Permalink

    I just wanted to thank you for a theme that was really easy and enjoyable to work with! i was (still am) a newbie at WP and was sorta “scared”, but really didn’t run into any problems that i couldn’t figure out. what we’ve done finally went live today and pretty excited about it.

    Thanks again! Donna

  29. Posted February 12, 2009 at 11:57 am | Permalink

    Michael, Hope your doing alright in Aussie land. Was wondering if you knew how one could add a simple dashed line between sidebar widget items such as “recent posts” so that each post listed has a dashed line between on your theme. Thanks for any insight.

    • Posted February 12, 2009 at 12:14 pm | Permalink

      Hiya, Nick. We’re managing over here, but wow. Fire sucks! Probably something added to the bottom of style.css, like

      .sidebar ul li {
         border-bottom: 1px dashed #ddd;
      }
      

      • Nick
        Posted February 17, 2009 at 11:51 am | Permalink

        Found it and fixed it.. Thanks

  30. Posted February 16, 2009 at 1:09 am | Permalink

    cool theme. but looking for a final solution to use this with the nextgen galery

2 Trackbacks