Choose the number of images to display in gallery
Permalink Browser Info Environment
Hi, is it possible to choose the number of thumbnail images to display in the gallery? Basically I would like only one thumbnail but when you click on it to enlarge it you can then scroll the the other images?
Thanks!
Thanks!
Type: | Discussion |
---|---|
Status: | Resolved |
Sorry this isn't a pre sale question, I have already purchased the add on :)
Hello,
I am joining a template that will do just that.
Extract it in your root blocks folder so you have ROOT/blocks/touch_gallery/templates/one_thumb_gallery.php
When that's done, apply the template "One Thumb Gallery" to Touch gallery and you will only have one thumb showing.
May I ask you if you have a website I could visit or if you could provide me with the address of the website you are using Touch Gallery on? I am always curious to see how my work is used.
Let me know if the template worked for you.
Thank you
Nour
I am joining a template that will do just that.
Extract it in your root blocks folder so you have ROOT/blocks/touch_gallery/templates/one_thumb_gallery.php
When that's done, apply the template "One Thumb Gallery" to Touch gallery and you will only have one thumb showing.
May I ask you if you have a website I could visit or if you could provide me with the address of the website you are using Touch Gallery on? I am always curious to see how my work is used.
Let me know if the template worked for you.
Thank you
Nour
Thank you this is just what I need!
Where can I add some css to remove the margins around the single thumb as it's causing it to be off center. I can see this is the line of code affecting it but not sure where to amend it?
.touchgallery-thumbs{
margin:60px auto 35px;
}
I've attached an image for your reference too.
Once I have it published and working I will send you the url to see :)
Thanks!
Where can I add some css to remove the margins around the single thumb as it's causing it to be off center. I can see this is the line of code affecting it but not sure where to amend it?
.touchgallery-thumbs{
margin:60px auto 35px;
}
I've attached an image for your reference too.
Once I have it published and working I will send you the url to see :)
Thanks!
Sorry forgot to attach the image!
those margins are calculated at the code level so to override them you need to add your css to the file I sent you.
Open it and inside you will see a <style> block.
Inside it write:
Modify the margins for whatever you want. Save and you should be good to go
Open it and inside you will see a <style> block.
Inside it write:
#touchgallery-thumbs<?php echo $bID ?> { margin-left: xxxpx; margin-right: xxxpx; }
Modify the margins for whatever you want. Save and you should be good to go
I've added that it and set the margin to 0px but there still seems to be a large space above the image and a small space to the left which I can't get rid of?
I've published the page so you can see what I mean.
Thanks so much for your help!
I've published the page so you can see what I mean.
Thanks so much for your help!
ok I see.
The code I first sent you allowed you to deal with the margins around the thumb container.
Now the thumbnail itself is a link <a> and has its own margin.
SO in the file I sent you, inside the <style> block like before, look for this piece of code:
You can just remove all the values set for margin and put what you want. SInce you have only 1 thumbnail you probably can just set it to
I noticed you didn't yet add the first piece of code I sent you. The is required to align your image to the other images.
The code I first sent you allowed you to deal with the margins around the thumb container.
Now the thumbnail itself is a link <a> and has its own margin.
SO in the file I sent you, inside the <style> block like before, look for this piece of code:
You can just remove all the values set for margin and put what you want. SInce you have only 1 thumbnail you probably can just set it to
margin: 0;
I noticed you didn't yet add the first piece of code I sent you. The is required to align your image to the other images.
Still not working? This is what I've adding in.
<style> #touchgallery-thumbs<?php echo $bID ?> { margin-left: 0px; margin-right: 0px; } #touchgallery-thumbs<?php echo $bID ?> a{ width:<?php echo $maxThumbWidth ?>px; height:<?php echo $maxThumbHeight ?>px; margin: 0; <?php echo $thumbBottommargin ?>px; } #touchgallery-thumbs<?php echo $bID ?> a:after{ bottom: -<?php echo intval(($maxThumbHeight * 1.075) + 7) ?>px; max-width: <?php echo intval($maxThumbWidth - 10) ?>px; <?php if ($showTitle == 0) {echo 'display:none;';} ?> }
Viewing 15 lines of 16 lines. View entire code block.
I looked at the code again and I see what the problem is.
First let's simplify the css and make sure the new margins are taken into account. Rewrite that css code like this:
Second, you are going to delete 2 lines of code that are stopping the css from being applied. At the top of the file, delete:
Then, right after the closing </style>, delete:
First let's simplify the css and make sure the new margins are taken into account. Rewrite that css code like this:
Second, you are going to delete 2 lines of code that are stopping the css from being applied. At the top of the file, delete:
if ($c->isEditMode() == TRUE) {
Then, right after the closing </style>, delete:
<?php } ?>
Thank you that all works perfectly now. Just need to sort all the images out now.
Thanks again!
Thanks again!
You're very welcome.
If you are a designer would you mind giving me your website's url?
If you are a designer would you mind giving me your website's url?
Hi, me again :)
I've just seen on mobile view that the thumbnail isn't resizing correctly so some of the image is getting cropped? Is it possible to fix this?
You can see what I mean here.
http://www.musicshopdurbannorth.co.za/products/roland-keyboards-dig...
Thanks!
I've just seen on mobile view that the thumbnail isn't resizing correctly so some of the image is getting cropped? Is it possible to fix this?
You can see what I mean here.
http://www.musicshopdurbannorth.co.za/products/roland-keyboards-dig...
Thanks!
Hi, me again :)
I've just seen on mobile view that the thumbnail isn't resizing correctly so some of the image is getting cropped? Is it possible to fix this?
You can see what I mean here.
http://www.musicshopdurbannorth.co.za/products/roland-keyboards-dig...
Thanks!
I've just seen on mobile view that the thumbnail isn't resizing correctly so some of the image is getting cropped? Is it possible to fix this?
You can see what I mean here.
http://www.musicshopdurbannorth.co.za/products/roland-keyboards-dig...
Thanks!
No that's correct. Touch Gallery is not set to resize thumbnails when the screen size changes. Thumbnails will re-align to fit the screen, but not resize. Full-screen images will resize.
Doing what you want is possible but your template will require some more changes.
Doing what you want is possible but your template will require some more changes.
Ahh ok I see. Are you able to help me with that please? As I'm using the one thumb gallery template it's important that it displays correctly.
could you attach the template you are using now so I can use that and not overwrite anything important?
Here we go see attached. I had to zip it up as it said 'invalid extension'.
Here, try this one
It doesn't seemed to have made a difference?
you probably need to empty your c5 cache
Yes! You are right. Works perfectly now.
Thanks so much for the great support!
Thanks so much for the great support!
you are welcome.
If you have some time to leave a review for Touch Gallery, that would be nice. You can do it here:http://www.concrete5.org/marketplace/addons/touch-gallery/reviews...
If you have some time to leave a review for Touch Gallery, that would be nice. You can do it here:http://www.concrete5.org/marketplace/addons/touch-gallery/reviews...