I have set up Simple Image Gallery Pro with the thumbnails in normal mode (each image has its own thumbnail).  My images are different sizes so the thumbnails that are displaying are different sizes. 

I would like all the thumbnails to display with the same dimensions regardless of the original image size.  Is anyone aware of what needs to be done to accomplish this?

Here is the page that I am working on:
www.sitesolutionsla.com/seminole-towne-center.html

Thanks!

Hi,

I would really like to use a feature like this on the site I am working on - I have a mix of portrait and landscape photographs and it is very hard to display them well at the moment.  If the new version is not going to be for a while - or if this feature is not going to be included - can anyone advise me how to implement this suggested hack??  I am not too bad with CSS but I need to know where to start....  Any help would be fantastic!!!  :)

Thanks.

Ok folks - so it seems I'm not as clueless as I thought!  :-[

If anyone is interested here is the hack I am now using to make all the thumbnails appear the same size when images are both landscape and portrait etc....

In the /mambots/content/plugin_jw_sigpro.php file look for this line of code:


$html .=$leftcomment.'<img alt="'.$clickopen.'" title="'.$clickopen.'" src="'.$toname_live.'" />'.$rightcomment;


and replace it with this line (or add a line and comment out the original if you're scared to delete it like me!):


$html .= '<div class="thumb_size" title="'.$clickopen.'" style="background-image:url('.$toname_live.')" ></div>';



That's the PHP taken care of - now for the CSS.....

In the /mambots/content/plugin_jw_sigpro/sigpro_default.css file add this code (I am not using the 'year book' thumbnail option - but I imagine you could add it to that file either and it should work):


.sig .sig_cont .sig_thumb a.thickbox div.thumb_size{border:1px solid #666666; height:60px; width:60px; overflow:hidden; background:no-repeat center top;}


Adjust, add or remove styling as suited to your site and hey presto - all your thumbnails should be the same size.  The key attributes here are the width, height and overflow:hidden.  I have put the background image positioning here for easy tweaking (even though the bg image code is in the php file)... this way I can adjust the style and don't have to touch the php file again.

You may find that you get gaps where your image does not completely fill your new thumbnail size / shape.  It is really just a case of trial and error to get them looking well.  Use the sigpro backend to adjust the size of the thumbnail background image (which will probably be a little larger then your thumbnail) and play with the positioning of the background image too for good results.

I hope someone else finds this useful and maybe in future versions we'll be able to do this (but a little less ugly) from the sigpro control panel.  :P

Thanks for a great plugin!


P.S.  If you want to see the drop shadow effect on the thumbs you must add margin:-5px 5px 5px -5px; to the css above  ;)

Cool!! I'll add your mod as a layout option in 1.3.  ;)

hi!
cool work on simple image galery here! I am using just SIG and this thumbnail issue is the reason I am thinking of going for SIG PRO, but I found out it is not there    :-\
Do you have any idea when v1.3 will be released? Wether it's worth waiting, or I it is better to go for v1.2 and tweak it myself?
Thanks for reply.

Maybe too late for the June release of 1.3, but:

I'd like to set up in my content a number of SIGPro mambot calls to different gallery directories. This works now IF the directory exists AND the directory has images in it. If a directory doesn't exist, there's an error message at top of content item display. If the directory exists but doesn't contain images, another instance is created of the previous gallery on the page. What I'd like is for non-existing directory be ignored (maybe allow a "Message to display if directory doesn't exist" message) and for empty directory to be ignored (again, perhaps a message for display). I know this is an error on my part, but handling it gracefully would allow me to set the containers and content items in advance, then as pictures are available, the galleries display.


While you're at it, how about being able to open the gallery in the Front Page Slideshow module - now that really would be something. Or, make a new release of Frontpage Slideshow to get its images from a directory in the same way as Simple Image Gallery does. Hey, I'd pay for that!

Cool!! I'll add your mod as a layout option in 1.3.  ;)

Elle many thanks for your fix which was driving me nuts before I read your post

I have a question regarding this page here www.powerzonegym.net/index.php?option=com_content&task=view&id=61&Itemid=203

I have made the changes to the files as suggested in your code, but there appears to be a large (unnecessary) gap between the image galleries and the next story header and text

For each series of images I have pulled the images from a separate folder and can see no reason in the site's CSS why it would do this.

Has anybody got an idea how to fix this?

Hi

I have applied the above changes and now the images don't show in the page.
Here is the url: <-- removed -->

What did I do wrong?

thanks in advance for your help
Depika (Despoina)
Athens Greece

Sorry for this. I found the problem. it was a conflict with a css div in my template css file

hi,

i was looking some hack to do the same, but with CSS clip property... anyway, i've made the changes above, but i can't have the 100% size from the original image in the thumb. i'm going crazy checking all styles, can you give me some light? thanx.

url:<-- removed -->

...mmm... perhaps i've the same mess in div's and classes as Depika...


argh!

Ok folks - so it seems I'm not as clueless as I thought!  :-[

If anyone is interested here is the hack I am now using to make all the thumbnails appear the same size when images are both landscape and portrait etc....

In the /mambots/content/plugin_jw_sigpro.php file look for this line of code:


$html .=$leftcomment.'<img alt="'.$clickopen.'" title="'.$clickopen.'" src="'.$toname_live.'" />'.$rightcomment;


and replace it with this line (or add a line and comment out the original if you're scared to delete it like me!):


$html .= '<div class="thumb_size" title="'.$clickopen.'" style="background-image:url('.$toname_live.')" ></div>';



That's the PHP taken care of - now for the CSS.....

In the /mambots/content/plugin_jw_sigpro/sigpro_default.css file add this code (I am not using the 'year book' thumbnail option - but I imagine you could add it to that file either and it should work):


.sig .sig_cont .sig_thumb a.thickbox div.thumb_size{border:1px solid #666666; height:60px; width:60px; overflow:hidden; background:no-repeat center top;}


Adjust, add or remove styling as suited to your site and hey presto - all your thumbnails should be the same size.  The key attributes here are the width, height and overflow:hidden.  I have put the background image positioning here for easy tweaking (even though the bg image code is in the php file)... this way I can adjust the style and don't have to touch the php file again.

You may find that you get gaps where your image does not completely fill your new thumbnail size / shape.  It is really just a case of trial and error to get them looking well.  Use the sigpro backend to adjust the size of the thumbnail background image (which will probably be a little larger then your thumbnail) and play with the positioning of the background image too for good results.

I hope someone else finds this useful and maybe in future versions we'll be able to do this (but a little less ugly) from the sigpro control panel.  :P

Thanks for a great plugin!


P.S.  If you want to see the drop shadow effect on the thumbs you must add margin:-5px 5px 5px -5px; to the css above  ;)

Works very well thanks. I also changed some of the background so the thumbnails now float on grey. As soon as the site is finished I'll post. :)

i guess my problem is that i've messed up a lot with php and css files, but i've found out the way to zoom in the thumbs:

1.- edit plugin_jw_sigpro.php

2.- change line 291, add size desired, mine is: $_width_final_+70, $_height_final_+70);


(take care, just add +(number) most desired. i've tried +30 and +50 but for my needs it's better +70)

this is just to share some solution or just to backup my mess if i've to undo it.  :(

I have set up Simple Image Gallery Pro with the thumbnails in normal mode (each image has its own thumbnail).  My images are different sizes so the thumbnails that are displaying are different sizes. 

I would like all the thumbnails to display with the same dimensions regardless of the original image size.  Is anyone aware of what needs to be done to accomplish this?

Here is the page that I am working on:
www.sitesolutionsla.com/seminole-towne-center.html

Thanks!

Hi eskwire!

I saw your SIGPRO implementation and I would like to do the same about to show the next and prev label at the bottom of the image and without autohide effect. Can you tell me how to do that?

Thansk!
Jos

Hi I can not remember exactly how I did it.  Pretty sure it was done by modifying the css file

look at this file:
/mambots/content/plugin_jw_sigpro/slimbox/english/slimbox.css

here are two lines that deal with the next and previous buttons:

#lbPrevLink {left:0;background:transparent url(prevlabel.gif) no-repeat 00% 100%;}
#lbPrevLink:hover {background:transparent url(prevlabel.gif) no-repeat 0% 100%;}

#lbNextLink {right:0;background:transparent url(nextlabel.gif) no-repeat 100% 100%;}
#lbNextLink:hover {background:transparent url(nextlabel.gif) no-repeat 100% 100%;}

Hope this helps let me know if you have any other questions.  It has been a while since I thought about this site.  :-)

:D

Thanks a lot... I will try!

Jos

1.3 will come in June. We're still developing it.  ;)

It's up to you to either buy it now, or wait. Either way, you'll get the update for free.  :D

When is june? Or rather, how's the next version incorporating this expected?

Chris

thanks loads for this code. i've decided to make the thumbnails a nice standard 80x80 across my site.

i've spent the last 2 hours trying to shrink the massive gap that was left inbetween thumbs after the fix and have finally found a mod in plugin_jw_sigpro.php which will bring them very dirtily closer together.

modify the values in this line here accordingly

$sigdata = '<style type="text/css" media="all">#sigid'.$sigcount.'.sig .sig_cont {width:'.($_width_final_+20).'px;height:'.($_height_final_+20).'px;}</style>';

this, of course, would be very silly to do unless you are using the forced size code in this thread as it'd likely cause chaos.

i really hope all my work is in vein and the staff here prove all their critics wrong by releasing gleaming versions of both paid for apps at the "middle of Jan" estimate... i for one really don't wanna waste this much time modding a "PRO" script again.

Hi Chumps,

found that one useful ;)

I am having trouble getting the image to fill out in the thumbnails though. I get them to display 100x100 px, but the image is smaller. Could you help me here please?

Chris