Download “Gallery”: A Free WordPress Theme

Advertisement

Just recently we asked1 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 Wallace32 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 Wallace32 especially for Smashing Magazine and its readers. It is extremely flexible and can be used as a starting point for design galleries and portfolios.

Screenshot4

This theme can be seen in action on MixCSS.com5, 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 feed6 or check out the live site7, 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.

Screenshot218

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-PostRatings9, BuySellAds plugin10, and Contact Form 711.

Screenshot12

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."

Screenshot13

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

Screenshot14

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

Screenshot17

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 version18 of Thematic.
  2. Download the latest version19 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 plugin20 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!

Screenshot218

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!

Footnotes

  1. 1 http://www.smashingmagazine.com/2009/04/21/smashing-community-wordpress-theme-comment-and-win/
  2. 2 http://www.chris-wallace.com
  3. 3 http://www.chris-wallace.com
  4. 4 http://www.smashingmagazine.com/images/gallery-wordpress-theme/large-preview.jpg
  5. 5 http://MixCSS.com
  6. 6 http://feeds2.feedburner.com/mixcss
  7. 7 http://mixcss.com
  8. 8 http://www.smashingmagazine.com/images/gallery-wordpress-theme/large-preview.jpg
  9. 9 http://wordpress.org/extend/plugins/wp-postratings/
  10. 10 http://wordpress.org/extend/plugins/buy-sell-ads/
  11. 11 http://wordpress.org/extend/plugins/contact-form-7/
  12. 12 http://www.smashingmagazine.com/images/gallery-wordpress-theme/large-preview.jpg
  13. 13 http://www.smashingmagazine.com/images/gallery-wordpress-theme/large-preview.jpg
  14. 14 http://www.smashingmagazine.com/images/gallery-wordpress-theme/large-preview.jpg
  15. 15 http://Delicious.com
  16. 16 http://www.rogieking.com
  17. 17 http://www.smashingmagazine.com/images/gallery-wordpress-theme/large-preview.jpg
  18. 18 http://themeshaper.com/
  19. 19 http://chris-wallace.com/downloads/gallery-latest.zip
  20. 20 http://wordpress.org/extend/plugins/wp-postratings/
  21. 21 http://www.smashingmagazine.com/images/gallery-wordpress-theme/large-preview.jpg
  22. 22 http://www.smashingmagazine.com/images/gallery-wordpress-theme/large-preview.jpg
  23. 23 http://mixcss.com/
  24. 24 http://chris-wallace.com/downloads/gallery-latest.zip

↑ Back to top Tweet itShare on Facebook

The Smashing team loves high-quality content and cares about the little details. Through our online articles, Smashing Books, eBooks as well as Smashing Conferences, we are committed to stimulating creativity and strengthening the web design community’s creative forces.

Advertising
  1. 1

    WooooOt!! Thanks!

    0
  2. 52

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

    0
  3. 103

    @Misspiggy

    You’re welcome!

    0
  4. 154

    Chris Robinson

    May 4, 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
  5. 205

    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
  6. 256

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

    0
  7. 307

    great!

    0
  8. 358

    Chris Wallace

    May 4, 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
  9. 409

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

    0
  10. 460

    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
  11. 511

    Great theme thanks,

    Tariq Mahmood

    0
  12. 562

    nice

    0
  13. 613

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

    0
  14. 664

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

    0
  15. 715

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

    0
  16. 766

    Awesome, thanks!

    0
  17. 817

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

    0
  18. 868

    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
  19. 919

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

    0
  20. 970

    Awesome. perfect for my portfolio

    0
  21. 1021

    SliceMachine.com

    May 4, 2009 10:51 pm

    Very nice of you to share this…. Thanks

    0
  22. 1072

    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
  23. 1123

    pagenavi would increase the usability of this template :)

    0
  24. 1174

    tnx for the theme

    i really like it,

    again i say: WORDPRESS THE ONLY BLOGGER EVER

    0
  25. 1225

    Michael Murphy

    May 5, 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
  26. 1276

    Akhtar Sheikha

    May 5, 2009 2:35 am

    beautiful theme!

    0
  27. 1327

    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
  28. 1378

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

    0
  29. 1429

    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
  30. 1480

    Michael Murphy

    May 5, 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
  31. 1531

    Business Styles

    May 5, 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
  32. 1582

    The Floating frog

    May 5, 2009 5:05 am

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

    0
  33. 1633

    Great theme, thanks for sharing.

    0
  34. 1684

    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
  35. 1735

    Love this…

    0
  36. 1786

    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
  37. 1837

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

    0
  38. 1888

    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
  39. 1939

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

    0
  40. 1990

    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
  41. 2041

    Chris Wallace

    May 5, 2009 3:36 pm

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

    0
  42. 2092

    @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
  43. 2143

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

    0
  44. 2194

    Chris Wallace

    May 5, 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
  45. 2245

    Chris Wallace

    May 5, 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
  46. 2296

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

    0
  47. 2347

    pretty nice theme.. thanks..

    0
  48. 2398

    @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
  49. 2449

    Chris Wallace

    May 6, 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
  50. 2500

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

    May 6, 2009 3:58 am

    Usefull theme) thanks

    0

↑ Back to top