Altering the image gallery layout.

I also would like to run my thumbnails along the bottom, as there is little room to the right.

I hacked the module-file to make those changes, table-free! (I did this for the last release)
Sorry, don't know how to make a patch.

Around line 655:

  $output = '<div id="slideshow-table">';

  $output .= '<div style="width:'.$width.'px;">'.drupal_render($slideshow).'</div></div>';

  $output .= '<div class="thumbarea">'.theme('node_images_gallery_thumbs', $thumbs).'</div>';

  $output .= '</div>';

  $output .= '<div class="ndview">'.node_view($node).'</div>';

Around line 680:

function theme_node_images_gallery_thumbs($thumbs, $cols = 2) {

  $count = count($thumbs);

  $output = '<div id="thumbs-table">';



  foreach($thumbs as $id => $thumb) {

    $description = '<div class="thumb-description">'.truncate_utf8($thumb['title'], 40, FALSE, TRUE).'</div>';

    $output .= '<div class="thumb_elem">'.l('<img src="'.$thumb['src'].'" class="slideshow-thumb" id="thumb-'.$id.'" />', $_GET['q'],

      array('title' => $thumb['title'], 'rel' => 'nofollow'), 'page='.$id, NULL, FALSE, TRUE).$description.'</div>';

  }



  $output .= '</div>';

  return $output;

}

The node_images.css

#slideshow-table .header {
  margin-bottom: 5px;
}
#slideshow-table p.description {
  margin: 5px 10px 10px;
}
#slideshow-table img.slideshow-thumb {
  border: 0;
}
#slideshow-table img.active {
  border: 2px solid #888;
}
#slideshow-table .thumb-description {

}
.polaroid {
  border: 3px solid #ccc;
  text-align: center;
}
.ndview {
clear: left;
}
.thumb_elem {
 width: 110px;
 min-height: 115px;
 text-align: center;
 float: left;
 background-color: #d3f58a;
 padding: 5px;
 margin: 0 10px 10px 0;
 }
 .thumbarea {
 width: 100%;
 }

I like your modification but there seems to be a bug.

Clicking on a thumbnail causes it to expand slightly, and as a result following thumbnails do not wrap all the way to the left. They are in a way "blocked off". This occurs when many thumbnails are loaded and need to break and form a new line.

Do you know of a solution to fix this?

Sure, just give me a few days. (This also occurs if you type in a longer name for a picture, quite annoying)

I couldn't get your modification to work in Firefox, so I wrote a patch to put the thumbnails below the main image. In my case I wanted a scrollbar for viewing the thumbnails, but this is fully configurable in the css file (div#thumbs-div is the container for the thumbnail divs). I also based my css on 100px thumbnails, but again that is configurable in css (div#thumb-div).

I would like to get this rolled into the module so please check it out and let me know.

I couldn't get a dual patch to work so the first file is the css patch.

The second patch is for the module.

Attaching to the initial issue the patch Illithium was talking about at n°4 above:

Illithium said at http://drupal.org/node/148919 :

Someone asked for it, but I completely forgot: A small hack for the latest version of the module file to make the layout more flexible and table-free. By default, this places the thumbnails under the main image.

The width of the thumbnail-boxes maybe has to be readjusted for the appropriate thumb-size.

Maybe this could be included in the module?

thx