How do I: Fill page on Wordpress blog with image gallery?

Hey Bruce, first off, this is exactly the kind of stuff I like to see here. As I'm hoping this community can weigh into discussions like this.

So, let me get this straight. The one plugin your are talking about (which seems pretty cool) you are using for your portfolio, right?

Then you want to display a single page with a gallery of images for viewing? Are these images static where you do not click on them for a larger view, like in your portfolio?

I may be thinking something different here, but you can place single images, one after another in a grid by selecting "none" when place them. Or am I not on the right track?

That makes sense. Yes, you can do it as I had explained, but it probably would be easier to use the gallery shortcode. That can be used on a page as well as a post.

Yeah, those shortcodes can be confusing.

Here's a snippet I found that may help.

Click on the Upload/Insert image icon and upload some photos. Each time you upload a photo, enter the title and then click on the Save All Changes button. You'll be taken to the Gallery tab, which will show all of the photos you've uploaded to be attached to this page.

If you want to upload more photos at this point, just click on the From Computer tab at the top and upload another photo.

When you've uploaded all the photos you want (you can add more later), click on the Insert gallery button. This overlay box will disappear and you'll see your post again. The page will have the gallery icon placeholder in the spot where you left the cursor

Note that because your uploading these photos while adding/editing this particular page, all of these photos will be "attached" to this page. That's how you know they'll be in the gallery on this page. Any other photos that you've uploaded at other times will not be included.

Now publish or save your page. Now when you view the page, there's a gallery of your images

Hey Bruce, the easiest way to do this, is to go into your dashboard, click on "settings" then "media" and you can change the size of your default "medium size". Of course this will change all your medium sized images...

I think a more flexible solution is to insert the photo into the page and then edit it. Select the picture, hit the edit icon and select the advanced tab. There you can specify the exact dimensions you want it to have. This way each picture can have a different size without affecting the others.

I couldn't find any way of editing the image during insertion. The only way I could get there was to insert and then edit. Mind you this is in 2.7 It may be easier to set the properties of an image in 2.8.

Hey Rick, that would be a flexible way to do it ,but time consuming. I believe Bruce wanted each one a specific size, so setting that it as a default would have consistency and save time as well.

True Dat - it is nice not to have to repeat the same task over and over again. Especially if you have to add the extra step of inserting and THEN editing.

Did you consider using a "Lightbox" plug in for that? There is a very popular J-Query Lightbox plug in that lets you specify the thumbnail size while the displayed size is the same as you uploaded. It doesn't take you to a new page, the light box displays over the current page which means that the entire page doesn't need to re-render saving bandwidth and time.

I've used an ASP.Net equivalent of this on my regular website. Obviously architects need to display images to prospective clients undoubtedly in the same way you do.

Here's a link to the plug-in I'm referring to http://wordpress.org/extend/plugins/jquery-lightbox-balupton-edition/.

For what it's worth - good luck.

It seems to me like some sort of AJAX plugin is the ideal candidate for what you want to accomplish. AJAX allows the rendering of a portion of the page without re-rendering the entire page. There is an AJAX image gallery that looks like it might do what you want. http://wordpress.org/extend/plugins/post-rich-videos-and-photos-galleries/ In the screenshots section they show examples of images and text combined.

There is no fundamental reason why a lightbox type of program can't show several paragraphs of text below the image.

Website visitors have a limited capacity for page loading and page rendering. Having to switch back and forth between pages could be annoying enough that visitors would leave before seeing what you want them to see. Anything that avoids a page reload is a good thing from that perspective.

Rick it right about the click thru. Less is better, obviously. And studies show you lose a small percentage of users every time they have to do another click thru.

I have another idea that might give you more control and flexibility. I'm going to assume that Thesis has a number of "widget ready" areas that you can add widgets to at your whim.

The main concept is to create a sidebar that persists with the pages you choose that will serve as a menu of your projects. That menu would consist of a series of thumbnail images and perhaps some title text. Once you click on that image it takes you to a project page that has all the information about the project that you think is appropriate. The project page could have as many photos and as much text as you'd like. Every project page will also have that sidebar menu so it won't require the user to return back to the index page.

That's the concept - here's how to get there:

It takes 2 widgets and a little bit of html

1: download and install TS Custom Widgets - it allows you to specifiy which pages you want particular widgets to show up on. This way your index widget could show up only on pages you choose. 2: download and install My Custom Widgets - this is essentially a widget wrapper that will turn any php, html or java script code into a widget.
3. Make thumbnails of the desired size for the iconic image of each project. 4. Using html make an un-ordered list that uses thumbnail images you create as hrefs to specific pages. If you look at my blog (www.hungryarchitect.com) you'll see this very thing on my sidebar only it's a list of my blog posts, not images but the concept is the same. Insert that unordered list into a new custom widget.

Presto - you have a CSS menu that is SEO friendly and the page only reloads when you move from one project to another.

Remember to fill out the alt and title tag for the images. The title tag should be the name of the project or something like that. The thumbnail file name should also be SEO indexable so it could be XYZ_design_project.jpg rather than thumb1.jpg

Obviously this isn't a gallery, but it is a pretty simple alternative that requires a little bit of simple html and returns a very flexible solution.

Hey, if you want to chat about it feel free to give me a call. I'm not a web designer like Bob, but I am pretty competent at Wordpress and I'd be happy to give you the benefit of my free advice.