Download “Gallery”: A Free WordPress Theme

Advertisement

Just recently we asked you to let us know what theme you would like us to release next. Among numerous comments we found many request for a gallery-theme that could be particularly useful for portfolios and showcases. At the very same time Christopher Wallace has been designing an advanced gallery-WordPress-theme for the design community and Smashing Magazine’s audience. And today finally we are proud to release it – for free, of course.

Gallery WordPress Theme

Gallery is a beautiful, free, gallery-style Thematic child theme for WordPress, designed by Christopher Wallace especially for Smashing Magazine and its readers. It is extremely flexible and can be used as a starting point for design galleries and portfolios.

Screenshot

This theme can be seen in action on MixCSS.com, which is being launched as a high-end design gallery that showcases the true power of the Gallery theme. You can subscribe to the MixCSS.com RSS feed or check out the live site, which acts as a demo for the Gallery theme.

As always, the template is completely free and may be used for any private or commercial project without any restrictions whatsoever.

Screenshot

Gallery is packed with loads of cool features like a jQuery slide hover effect on thumbnails, lazyloading for thumbnails (great if using a lot of thumbnails on one page), built-in social media links for each gallery item and seamless integration with the following plugins: WP-PostRatings, BuySellAds plugin, and Contact Form 7.

Screenshot

If you'd like an endless wall of thumbnails, LazyLoad allows you to show as many posts on the homepage as you'd like, allowing your users to scroll endlessly down the page without having to load hundreds of images right away. This effect mimics "endless scroll."

Screenshot

Gallery also supports WordPress 2.7 threaded comments for an elegant commenting experience.

Screenshot

Social media links allow you to save each gallery item to Delicious.com or post a link to the gallery page in your twitter feed. Social media icons provided by Rogie King.

Screenshot

Features

  • WordPress 2.7 compatible
  • Built on the Thematic framework
  • jQuery hover effects
  • 'Save to Delicious' link
  • 'Tweet This' link
  • Flexible footer widget area
  • WP-PostRatings integration
  • Contact Form 7 integration
  • BuySellAds plugin integration

Usage/Installation

To use the Gallery Theme, you will need to follow these installation instructions:

  1. Download the latest version of Thematic.
  2. Download the latest version of the Gallery WordPress theme.
  3. Unzip and upload both themes to your "wp-content/themes/" directory.
  4. In WordPress, go to "Appearance > Themes" and activate the "Gallery" theme.
  5. To change the number of items displayed on the home page, go to
    "Settings > Reading" and change "Blog pages show at most" to 28 (4
    rows) or 35 (5 rows) or more for the LazyLoad plugin to work its magic. LazyLoader will automatically delay loading of thumbnails that are out of the user's view.

Adding Gallery Items

To use the default options for the Gallery Theme, here are instructions for creating gallery entries:

  1. Create a thumbnail for each entry sized 125×125
  2. Create a full-sized image for each entry sized 500×375
  3. Upload both images to /wp-content/uploads or use the image uploader in WordPress to upload the images to the same folder
  4. Next, create a custom field called "thumbnail" and enter the
    location of the thumbnail file, for example
    "/wp-content/uploads/design-name-125×125.jpg"
  5. You will need to create another custom field called "full-image" and enter the location of the full-size image in that field.
  6. You may also enter custom fields for "web-url" and "designer" if you want to add additional information to each entry.

Setting Up Star Ratings

  1. Install the WP-Post Ratings plugin from WordPress.org. Activate both the plugin and the widgets.
  2. To switch the type of images to transparent .PNGs, open wp-content/plugins/wp-postratings/wp-postratings.php in a text editor and change the following lines (should be near the top of the document):

    ### Define Image Extension
    define('RATINGS_IMG_EXT', 'gif');
    //define('RATINGS_IMG_EXT', 'png');

    to match this:

    ### Define Image Extension
    //define('RATINGS_IMG_EXT', 'gif');
    define('RATINGS_IMG_EXT', 'png');

  3. Then upload that file back into the plugins folder.
  4. In your WordPress admin panel, click the Ratings > Options link on the left sidebar.
  5. The transparent .PNG stars should be selected by default.
  6. Under 'Ratings AJAX Style' change 'Show Loading Image With Text' to 'No' and 'Show Fading In And Fading Out Of Ratings' to 'No.'
  7. Click 'Save Changes.'
  8. Now click the 'Ratings Templates' on the left sidebar.
  9. Replace the text in the 'Ratings Vote Text' box with the following code:

    %RATINGS_IMAGES_VOTE%

  10. Replace the text in the 'Ratings Voted Text' with the following code:

    %RATINGS_IMAGES%

  11. Click the 'Save' button.
  12. You should now see your star ratings show on the gallery single pages next to the title of the gallery item.

Adding Widgets to the Footer

  1. Make sure you activated the WP-Post Ratings widgets when you activated the plugin.
  2. In your WordPress Admin, click Widgets on the sidebar.
  3. From the drop-down box under 'Current Widgets' select '1st Subsidiary Aside' and click 'Show.'
  4. Drag the widgets you'd like to see shown in this area from left to right (Highest Rated, Most Rated, Recent Comments, etc.)
  5. Click 'Save.'
  6. You should now see your widgets in the footer.

Download the theme for free!

Screenshot

We express sincere gratitude to Christoper Wallace for his truly impressive work. Please let us know in the comments if this release meets your expectations. And if not, please let us know what we could improve in the upcoming releases!

The Smashing Editorial loves high-quality content and cares about little details. We also believe that content and design are crafts worth sharpening.

  1. 1

    Amir Siddiqui

    May 4th, 2009 1:13 am

    good sharing

    0
  2. 2

    Nice Theme Wallace!! Now many online galleries might want to change their old look. Thanks for sharing.

    DKumar M.
    @instantshift

    0
  3. 3

    looks nice. wish i had that many sites to populate the grid with…..

    0
  4. 4

    Alex Mitchell

    May 4th, 2009 1:21 am

    Brilliant! A few friends were looking for a WordPress based gallery and this theme might just be the answer; or at least the start to one. Think I’ll have to play with this later :)

    Thank you for sharing!

    Alex | @ZenElements

    0
  5. 5

    Looks horrible in IE6.. Curse my workplace for not having a better browser to view this masterpiece

    0
  6. 6

    Awesome!thanks for sharing :)

    0
  7. 7

    THANKS A LOT!!!!!!

    0
  8. 8

    inspired by cssremix.com

    (SM) please read the post first, Ivo. The designer of the theme is the creator of CSSRemix.com.

    0
  9. 9

    Thank you so much!!! Really what I needed.

    0
  10. 10

    so clean, simple and elegant. thanks!

    0
  11. 11

    the best theme ever released on SM

    0
  12. 12

    onnayokheng

    May 4th, 2009 2:21 am

    wow…it’s amazing for me, i hope i can make template like this.. ^_^

    0
  13. 13

    Nice. Too bad it doesn’t have good color contrast in most places.

    0
  14. 14

    Pier Antonio

    May 4th, 2009 2:52 am

    a bit too black…. but very very nice theme! :)

    0
  15. 15

    Ravindranath

    May 4th, 2009 3:00 am

    Incomplete theme – without notes on installation – crashes as such – Waste of time— :(

    0
  16. 16

    Would be nice if the step by step installation instructions of the section “Adding Gallery Items” were more detailed as not everyone knows how to do some of them – me included :-)

    0
  17. 17

    This comes very close to my own fan-tas-tic gallery theme… ;) I have to hurry up, I guess.

    A very nice one…kudos!

    0
  18. 18

    Thanks – this is a wonderful new theme. Looks like something that should be included in the previous post on Ultimate Guide To Using WordPress For A Portfolio. Loke someone else said, I just wish I had more in my own portfolio to fill something like this up!

    Beautiful work!

    0
  19. 19

    Woop woop! THIS is usefull! Thanks!

    0
  20. 20

    Wow, great job guys. And Free! even better. Thanks for sharing.

    0
  21. 21

    Hey great themes but i have a question… how do you change the title of the widgets for images? or instead of using the widget to manually add the codes? If someone can answer me this i’ll be grateful for the rest of my live!

    0
  22. 22

    connecticut websites

    May 4th, 2009 5:25 am

    it has some interesting elements, and like most themes, you need to know your way around wordpress, css, php, etc to adapt it to your own needs – I really like the thumbnail roll-over effect.

    0
  23. 23

    Excellent!

    0
  24. 24

    Nice theme, i love this theme ;)

    0
  25. 25

    Wow, that’s a smashing theme for gallery!

    0
  26. 26

    it’s amazing!

    0
  27. 27

    Great! I am a bit surprised that there’s no automatic image sizing using timthumb or something, considering all excellent features. Adding Paypal or cart integrations would be icing on the cake.

    Thanks!

    0
  28. 28

    Nice theme;thanks:)

    0
  29. 29

    Sweet, been looking for ideas to designing WordPress Gallery theme, and this one will definitely give me some more ideas.

    Thank you :)

    0
  30. 30

    Awesome Awesome Awesome!
    Words escape me.

    Brilliant work!

    0
  31. 31

    another nice post and a good learning resource, however instructions are not complete, things like how to add subit a gallery link and how to add a new gallery are missing.

    0
  32. 32

    Wow amazing thanks guys. Just what I need.

    0
  33. 33

    I´m trying to figure out whats the problem, when i extracted and uploaded the two themes named above, wordpress says gallery theme is broken, doesnt have template or stylesheet, any suggestions?

    0
  34. 34

    Chris Wallace

    May 4th, 2009 7:15 am

    Guys, thanks for all the positive feedback and the questions regarding this theme! Just to add one thing, I am not the creator of CSS Remix, just MixCSS.com. The theme was inspired by a variety of design galleries but my main goal was to provide a free theme that builds upon the simplicity of sites like Card Observer and CSS Remix.

    I understand the installation instructions may not be tailored specifically to beginning WordPress users and will continue to improve the instructions for those who may have questions. Updated instructions and tutorials for using other plugins with Gallery will be available periodically at chris-wallace.com, so be sure to watch for those.

    If you need help adding Custom Fields in WordPress, this tutorial explains exactly what they are and how to add them to your posts.

    Again, thanks for all the comments!

    0
  35. 35

    Thank you soooooooooooooooo much!!!!!
    I am running a showcase page for japanese descendant community related pages
    and this theme is EXACTLY what I was looking for.
    The other CSS gallery themes were getting too old.

    Thank you and Arigato. :)

    0
  36. 36

    Hi, is it working actually? I downloaded it, tried to install it on wordpress 2.7 but it doesn’t work. It says:

    this theme is incomplete
    ?

    0
  37. 37

    @Misspiggy: Did you follow the installation instructions? Gallery is a Thematic child theme, so you need Thematic as well.

    0
  38. 38
  39. 39

    TARIQ MAHMOOD

    May 4th, 2009 10:02 am

    Great Theme, thanks for sharing such a nice theme

    regards,
    TARIQ MAHMOOD

    0
  40. 40

    LOL, why do people not test with deactivated javascript? And even better with a running ad-blocker. This is what I see:
    http://img3.imagebanana.com/img/1dhhrmdc/screenshot_001.png

    But I have to admin, nice looking when viewing in a totaly “free” environment.

    0
  41. 41

    I’m the owner of CSSREMIX.com and I did not make this theme nor do I support it in anyway. I would’ve appreciated a link in the post, though: it obviously isn’t original ;)

    0
  42. 42

    I’d just like to also confirm that this breaks terribly in IE6. Otherwise, it’s nice.

    0
  43. 43

    @John Mills It doesn’t look anything like yours other than the fact that it has a matrix of thumbnails on the page. How different can a collection of thumbnails really be?

    0
  44. 44

    @Artur Kim

    Yes you’re totally right! I’m so sorry for my stupid question. Tnx for helping me out.

    0
  45. 45

    one hell of a theme. nice job guys!

    0
  46. 46

    Just recently we asked you to let us know….

    In this the asked link is mismatched…..
    so change it! :)

    0
  47. 47

    linklerde sorun var galiba :S

    0
  48. 48

    elcodigodebarras

    May 4th, 2009 11:41 am

    What can I say… it´s really delicious !

    Thanks for sharing this beautiful gift.

    0
  49. 49

    @Chris Wallace

    Thanks for mentioning CardObserver.com as a main source of inspiration in your comment, but a link in the post would have been really awesome! :)

    0
  50. 50

    WooooOt!! Thanks!

    0
  51. 51

    Where is the Joomla theme? Joomla is a Open Source software that can do much more than WP.

    0
  52. 52

    @Misspiggy

    You’re welcome!

    0
  53. 53

    Chris Robinson

    May 4th, 2009 1:31 pm

    looks pretty good, consider using timthumb to resize the images dynamically next time, also instead of using custom fields why not create a custom write panel – http://wefunction.com/2008/10/tutorial-creating-custom-write-panels-in-wordpress/, those two things would make it way easier for the user managing the site

    0
  54. 54

    It would be great if dashboard based tools for setting up thumbnail and full-image were part of this – or even a link to picnik or some other web based editing tool. Ideally, you could “press this” and edit the image (and generate the thumbnail) without leaving WordPress.

    Not bad at all though!

    0
  55. 55

    JonnoPierce

    May 4th, 2009 2:49 pm

    I can not for the life of me get this them to work, and yes, I did download thematic along with it…

    0
  56. 56

    great!

    0
  57. 57

    Chris Wallace

    May 4th, 2009 3:21 pm

    @Chris Robinson Thanks for the suggestions, there will be future updates to the theme, so those may be added at some point.

    There are a few bugs that have been reported and will be fixed as well in upcoming releases.

    0
  58. 58

    Great! But it doesn’t run with IE6… is there any solution? A Bug?
    Thank you very much!

    0
  59. 59

    Chris,
    If I want to change the large image size, is that just done in the stylesheet under #content? Alot of my images are taller than wide. Great theme. Haven’t had any issues but I used it on a clean install of WP.

    0
  60. 60

    Great theme thanks,

    Tariq Mahmood

    0
  61. 61

    nice

    0
  62. 62

    Just uploaded this theme and WordPress says that the theme is missing a stylesheet and a template. Poop!

    0
  63. 63

    I’m getting exactly the same problem as Lindsey.

    0
  64. 64

    evan eckard

    May 4th, 2009 6:54 pm

    Wow, this is a great looking theme. The interior page designs and attention to detail are very impressive!

    0
  65. 65

    Fantastic! This is everything I didn’t know I was looking for! Thank you for this totally gorgeous theme.

    0
  66. 66

    Awesome, thanks!

    0
  67. 67

    hi, the theme dont work for me, i miss “thematic” subfolder.
    Any idea ?

    0
  68. 68

    Hi,

    This is a great theme. A couple of suggestions it would have been great if you had of used say tim thumb and then told the wordpress system to get the first image of each post.

    This way you only need otuplaod the images once and makes it easy to use.

    0
  69. 69

    just the theme i’ve been looking for for weeks. thanks!

    0
  70. 70

    Awesome. perfect for my portfolio

    0
  71. 71

    SliceMachine.com

    May 4th, 2009 10:51 pm

    Very nice of you to share this…. Thanks

    0
  72. 72

    I know IE 6.0 isn’t the most popular browser but many companies still use it on their corporate machines. Not mention regular Internet users.
    This theme doesn’t look great in IE 6.0 – top navigation displays as a vertical list right aligned. And between each and every row of thumbs there is an empty space you can insert at least two extra rows in.
    Honestly I would feel embarrassed releasing product that wasn’t tested in IE 6.0.

    0
  73. 73

    pagenavi would increase the usability of this template :)

    0
  74. 74

    tnx for the theme

    i really like it,

    again i say: WORDPRESS THE ONLY BLOGGER EVER

    0
  75. 75

    Michael Murphy

    May 5th, 2009 12:45 am

    Hi guys

    Ive been using a grid based system for a while now but it wasnt a wordpress, in fact wasnt even a CMS, ive always liked the look and feel of grid system to showcase work now im going to transfer it to this to make my life so much easier

    Thanks

    0
  76. 76

    Akhtar Sheikha

    May 5th, 2009 2:35 am

    beautiful theme!

    0
  77. 77

    hi, i have problem with adding gallery items
    is the custom field “full-image” correct ?? i cant get it working
    i had no problems with the thumbnail :]

    0
  78. 78

    Al post are showing as NEW, does someone know how to change this?

    0
  79. 79

    The theme looks really good, but misses a lot of points:
    - Adding content could be way easier (see comments above)
    - CSS could be more clean, also has some bugs (“new” flag not correctly showing in the first line)
    - On detail-pages the “next” and “prev” links break when the title is too long
    - I’ve never seen a theme that needed to download and add another theme to work, which is kind of strange

    There’s a lot of stuff to do yourself when you want to make it work good which could have been avoided with proper testing. Maybe you guys will release an update?

    0
  80. 80

    Michael Murphy

    May 5th, 2009 4:03 am

    I cant believe so many people are knocking this

    Its a first release, there bound to be bugs here and there etc

    The guys worked on this, put in his time and effort and gave it to us for free, should be grateful instead of putting the boot in…

    0
  81. 81

    Business Styles

    May 5th, 2009 5:02 am

    Just builded a CSS gallery in less than 2 hours. business-styles.com was a idea i had more than a year ago. Now finally i’ve done it. Thanks.

    0
  82. 82

    The Floating frog

    May 5th, 2009 5:05 am

    Love it, gonna use it for my personal portfolio I think

    0
  83. 83

    Great theme, thanks for sharing.

    0
  84. 84

    Hi, Thanx for the sharing.. i really loves it, but can i ask something..
    why the custom field for “designer” isn’t working? what did i miss?

    Thanx before…

    0
  85. 85

    Love this…

    0
  86. 86

    Nice looking theme and as always thanks for sharing. However, I was expecting SM to be more selective, rather than releasing just another gallery or magazine theme.

    0
  87. 87

    This is really good stuff. Was struggling with a custom WP installation to do the same thing. Will use this instead!

    0
  88. 88

    Chris Wallace

    May 5th, 2009 11:45 am

    For everyone interested, I will be releasing a new version with custom write panels, full IE6 compatibility, and bugfixes galore (the ‘new’ icons are fixed in the update, among other fixes). I will be testing the changes this evening and allow some people who have already implemented the theme to test it out before I release the new version. You can subscribe to all future theme updates here.

    0
  89. 89

    Is anyone else having problems with full-image custom field as it wont show the full image? :(

    0
  90. 90

    Do you have problem with instalation (this theme is incomplete) with missing Thematic? Just download http://wordpress.org/extend/themes/thematic and copy to wp-content/themes, then you see this great theme in admin.

    0
  91. 91

    Chris Wallace

    May 5th, 2009 3:36 pm

    Make sure you upload BOTH themes before you try to activate the Gallery theme.

    0
  92. 92

    @Lindsey (Comment #62) — I was having the same problem with WordPress saying that the theme is missing a stylesheet and a template. This was on top of a fresh install of WP 2.7.1 made by my webhost (Dreamhost). But DH seems to have some things “tweaked” in their installation. So, I removed their installation and did one fresh from the download of WP 2.7.1 straight from wordpress.org. After that WP recognized Gallery and Thematic properly. :)

    0
  93. 93

    logolopolis

    May 5th, 2009 7:40 pm

    Cool! Thx. Any chance you’d release a white version of the theme?

    0
  94. 94

    Chris Wallace

    May 5th, 2009 9:24 pm

    Just to let everyone know, I’ve released version 1.1 of the Gallery theme version 1.1 of the Gallery theme. If you were experiencing problems loading new gallery items, having trouble with IE6, or saw some issues with the ‘NEW’ icons, this release fixes/helps all of those issues.

    0
  95. 95

    Chris Wallace

    May 5th, 2009 9:25 pm

    Just to let everyone know, I’ve released version 1.1 of the Gallery theme here. If you were experiencing problems loading new gallery items, having trouble with IE6, or saw some issues with the ‘NEW’ icons, this release fixes/helps all of those issues.

    0
  96. 96

    Really great and useful WP theme! Excellent work! Thank you, Chris and SM!

    0
  97. 97

    pretty nice theme.. thanks..

    0
  98. 98

    @Chris Wallace

    I just switched to version 1.1 but the ‘New’ icons still are cut off on top … In my admin it says I have theme 1.1 so …

    I also can’t find this to make the ratings work:
    “In your WordPress admin panel, click the Ratings > Options link on the left sidebar.”

    I just installed WP on my hosting and it’s the first time I am working with it.

    0
  99. 99

    Chris Wallace

    May 6th, 2009 3:56 am

    @Martijn, you are still using the old version. Make sure you install the new package in the ‘themes’ directory in your wordpress installation.

    0
  100. 100

    ландшафтный дизайн

    May 6th, 2009 3:58 am

    Usefull theme) thanks

    0

  1. 1

    For anyone still having problems with the theme, I pulled the repository of thematic and updated it to version 0.9.5.

    If you still need it, I uploaded it on my site. Here’s the link: http://lmutafov.com/source/thematic.zip

    If anyone wants to mirror it too, don’t hesitate to. :)
    Also, you will notice there’s a .svn folder in there. That’s Subversion’s version-control folder. It will help you if you want to update to another revision/version, but first you will need to have TortoiseSVN, or an alternative to it first. Of course, when you’re uploading it to your wordpress website, you’re free to delete it.

    And last, you will notice how WordPress will instantly notice you about an update, when you upload it. It will tell you to download the latest thematic version, which wouldn’t be what you want exactly, since you’ve down-graded to this one. Just putting it out there, so you don’t go and press the button without thinking or reading, as soon as you see “Update”. :D

    +4
  2. 2

    Check your quotes, make sure they’re “apostrophes”, the one usually found below the double quotes key:

    define(‘THEMATIC_COMPATIBLE_BODY_CLASS’, true);
    define(‘THEMATIC_COMPATIBLE_POST_CLASS’, true);
    define(‘THEMATIC_COMPATIBLE_COMMENT_FORM’, true);
    define(‘THEMATIC_COMPATIBLE_FEEDLINKS’, true);

    I’m not sure if the above will print correctly in this page, but don’t use the open-quote/close-quote combination. Use the one you always use when writing I’m.

    It works on the homepage, but in the single pages the comments section is too far below the post.

    +3
  3. 3

    @Narcis, Sorry, the code got stripped out during posting, but you should be able to find it.

    +2
  4. 4

    define(‘THEMATIC_COMPATIBLE_BODY_CLASS’, true);
    define(‘THEMATIC_COMPATIBLE_POST_CLASS’, true);
    define(‘THEMATIC_COMPATIBLE_COMMENT_FORM’, true);
    define(‘THEMATIC_COMPATIBLE_FEEDLINKS’, true);

    use ” instead of ‘ . Place the above in Theme Functions/function.php, in the beggining of the file.

    it works like a charm ;-)

    +2
  5. 5

    Update killed the look of my theme with thumbnail misalignment. I added the code but nothing happens. Where exactly do i add the code. I placed it in the child’s theme functions.php but i get the same loook.

    +2
  6. 6

    KrentistTheDentist

    November 3rd, 2010 2:24 pm

    For people having problems with the hover function not working properly, and thumbnail misalignment (only 1 per row), you need to add the following to the Gallery theme functions.php file:

    define(‘THEMATIC_COMPATIBLE_BODY_CLASS’, true);
    define(‘THEMATIC_COMPATIBLE_POST_CLASS’, true);
    define(‘THEMATIC_COMPATIBLE_COMMENT_FORM’, true);
    define(‘THEMATIC_COMPATIBLE_FEEDLINKS’, true);

    them everything works perfectly :D

    +2
  7. 7

    Hi, I’d like to use this theme but when I add a category it still says “No categories” and there are no thumbs showing, only the direct link to the post works, not the thumb…
    Any ideas?

    Glenn

    +1
  8. 8

    @Simon Wells
    Thank you

    +1
  9. 9

    Hi there is there a version for wordpress 2.8.5?

    +1
  10. 10

    Please,

    I installed it, but I recived a menssage ” falta la plantilla”

    Instalé y me aparce un error de falta la plantilla.

    help me that´s for my job

    +1
  11. 11

    How add I more images at post, below the big one?

    +1
  12. 12
  13. 13

    this sucks!!! the thumbnails are all aligned vertically and somewhat staggered. I want them to be side by side like the example theme! Please help! the solution above did NOT work.

    +1
  14. 14

    http://themeshaper.com/ is where you are taken to download the latest version via link above, you can’t download it from there. Go to the theme web site and it’s not a free theme it’s $50.00. You might want to advise folks this is no longer a free theme…..

    +1
  15. 15

    Hello, I try to use this theme but the logo icon show twice. Please is there anybody who can help me to solve it?

    +1

Leave a Comment

Yay! You've decided to leave a comment. That's fantastic! Please keep in mind that comments are moderated and rel="nofollow" is in use. So, please do not use a spammy keyword or a domain as your name, or it will be deleted. Let's have a personal and meaningful conversation instead. Thanks for dropping by!

↑ Back to top