If you aren’t familiar with PowerGallery, it is a PHP web app that I created for WebAssist. Basically, you can upload your images and display them on your page with several built in gallery designs. When programming this product, one thing I wanted was easy extensibility so more designs could be added easily. The 1.1 release added 3 slideshows that were great.
I’ve created another design called Stack and you can download it for free below. To install it, just unzip the file and upload the stack directory to the galleries directory inside your PowerGallery installation. That’s it! Log in to the admin and you’ll see Stack a new choice on the Choose Design page.
This gallery was created using the ElementStack MooTools plugin. You can see a live demo here. Since PowerGallery uses MooTools 1.2, you can easily create galleries yourself and just drop them into the galleries folder for easy use.
Download the design
Last week’s post about Rounded corners using CSS3 is an intro for this post.
I worked on the CSS Sculptor extension for Dreamweaver at WebAssist and some of the presets we ship with have rounded corners. However, those designs use images to ensure Internet Explorer works as expected. Using images has several limitations. Each layout has multiple color schemes and each of those has a handful of images. If you want to customize the layout you need to slice new graphics and plug them in using the wizard. This is obviously not as flexible as we would like. If you want to resize the columns in your layout, again not super easy since the images need to be adjusted and resliced. Images are still the way to go to ensure fully compatibility with Internet Explorer, but for the modern browsers CSS3 makes it infinitely easier.
This is where CSS3 rounded corners come into play. I have re-created all of the CSS Sculptor rounded corner layouts using only CSS and no images! These designs will only work in a modern browser that supports CSS3 rounded corners – Chrome, Firefox, and Safari are the main three.
There are 3 layouts (3 column, 2 column left sidebar, 2 column right sidebar) in the zip file and since they are fully CSS, you don’t have to slice any new images and you can simply change the width on a column and everything will adjust itself as needed. You can import the zip using the WebAssist Preset Manager in Dreamweaver.
Download the presets
WebAssist recently released a really cool PHP solution today called PowerGallery. I was the lead engineer on this solution and it was lots of fun to code it. Am I biased since I created this thing? Of course! But I have no doubts you’ll love it too. I don’t want this to sound like a sales pitch, but I am proud of the work we put into this solution pack. I also wanted to set the stage since some of my upcoming tips are direct results of things I learned during development of PowerGallery.
Continue Reading
