Thumbnail Gallery Help

User 2723650 Photo


Registered User
7 posts

I am running into a few issues, and need some help

The gallery design was found at http://gordw.com/rsd/example/gallery.html I like the design and function of it.

I have a test page made and running live now at https://www.jeffreyvogtphotography.com/blank_1.html
1st issue is that the thumbnails show up in the working .rsd file and my preview with firefox, but do not show up once it is exported and uploaded it is not showing the thumbnails on the scroll bar area. The large image does change however when I do click on the empty thumbnail box to the correct image.
(the instructions state to (****You style the thumbnail images by greying out the thumb class the script uses****) but every time I grey it out, it does not stay greyed out? even with immediate saving.

2 issue is there a easy way to add more picture to the thumbnail area, I am wanting to have around 20 to 30 images per gallery page and when I try to scroll right to edit the picture information, it does not seem there is a easy method of advancement in the editing, if I grab the scroll bar to scroll right it want to move the container section when i stop?

The rsd file is available here
https://www.jeffreyvogtphotography.com/ … photos.rsd

any help would be appreciate


User 122279 Photo


Senior Advisor
11,595 posts

I see you have a fairly deep hierarchy of folders. Someone else was having more or less the same problem about a year ago, and the solution was to have less folders inside each other. You could try that.

Not sure what you mean in your 2nd issue. Normally, when you want to have many instances of the same element, you style the first one until you get what you want, and then you duplicate it as many times as you need. Afterwards you change the image file names and the alt text.

If you meant something different, then you need to explain a bit more.
Ha en riktig god dag!
Inger, Norway
My new honey site, built with RFF: http://www.horgenhonning.net/
Component sharing for RFF, RBB, RSD and SD: http://www.horgenhonning.net/sharing/


User 2699991 Photo


Registered User
1,789 posts
Online Now

2 issue is there a easy way to add more picture to the thumbnail area, I am wanting to have around 20 to 30 images per gallery page and when I try to scroll right to edit the picture information, it does not seem there is a easy method of advancement in the editing, if I grab the scroll bar to scroll right it want to move the container section when i stop?

Select the container holding the thumbs
go to the section Position in design window
select "display = "row"
"wrap = "No Wrap"
duplicate the image Change it
once done go back to the container & put the position back to block

look for the section "overflow" select "visible"
The Help You Need : When You Need It The Most
website https://rsdtutorials.com

User 187934 Photo


Senior Advisor
18,130 posts

You can disable the break points by clicking the disable button in the uppper left. Add ass many picture elements that you will need for the thumbnail strip and then adjust them to your local images and add classes. Now turn on the break points.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

Here's my S-Drive site with
examples of what can be accomplished in VSD.
http://progrower.coffeecup.com/
Here's my CoffeeCup SCCP Shop with examples of what can be done.
http://progrower.coffeecup.com/shop/
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personnel site used for testing and as an easy way to share photos.(RLM imported to RSD)
http://ericrohloff.com
http://ericrohloff.com/property/
User 2723650 Photo


Registered User
7 posts

Inger,
I changed the folder hierarchy, and did not see much of a difference, I will leave it as simple as images/models for now. Thank You For the Info.

Wayan and Eric, I understand the info on adding the extra thumbnails based on both of your recommendations. I will use your info shortly. Thank You!

I still have a issue with getting the thumbnails to show as the full size image
I have moved the files into a sub directory so they could be different from the other sample.
I have the thumbnails now showing and when clicking on the thumbnails the text changes on the big picture , but the big picture still does not change.

this is the latest https://www.jeffreyvogtphotography.com/ … ank_2.html
rsd file is at
https://www.jeffreyvogtphotography.com/ … photos.rsd

User 2699991 Photo


Registered User
1,789 posts
Online Now

Jeffrey Vogt wrote:
Inger,
I changed the folder hierarchy, and did not see much of a difference, I will leave it as simple as images/models for now. Thank You For the Info.

Wayan and Eric, I understand the info on adding the extra thumbnails based on both of your recommendations. I will use your info shortly. Thank You!

I still have a issue with getting the thumbnails to show as the full size image
I have moved the files into a sub directory so they could be different from the other sample.
I have the thumbnails now showing and when clicking on the thumbnails the text changes on the big picture , but the big picture still does not change.

this is the latest https://www.jeffreyvogtphotography.com/ … ank_2.html
rsd file is at
https://www.jeffreyvogtphotography.com/ … photos.rsd



You haven't linked the placeholders to the relevant thumbnail image at the highest breakpoint
The Help You Need : When You Need It The Most
website https://rsdtutorials.com

User 2723650 Photo


Registered User
7 posts

Wayan,
I guess i'm lost as to where the linking to the placeholders is to be done at?
User 244626 Photo


Registered User
659 posts

I believe the script is working properly because if you resize the image to under the max breakpoint the images change.

The reason it does not work properly at above the max breakpoint is that you have chosen multiple sources for the large picture. You can only have one. (ID="bigpic")

You need to reset the picture source above the largest breakpoint by hitting the "X" besides the Picture "Local Image" dropdown. You may want to do that for the middle breakpoint also. (ID="bigpic")

The image is being changed properly to the "img" tag but thats not what the browser is using......its using the source img for the largest breakpoint. If you only have one image source, it will work properly.
User 244626 Photo


Registered User
659 posts


<picture><!--[if IE 9]><video style="display: none;"><![endif]-->
<source srcset="./images/models/angela_s_4-0053.jpg" media="(min-width: 64em)"><!--[if IE 9]></video><![endif]--><img alt="Alice Marie Image 1" src="img/picture.svg">
</picture>


The above code is the problem. You have a srcset image at above 64em which is the largest breakpoint on the large picture image (not thumbnails).
User 2723650 Photo


Registered User
7 posts

Twinstream,
Thanks for the info, I got 3 out of 5 of the thumbnails to be able to show up as large images up top, the last two still wont show up, and they only will show up when I have the browser set at half screen size, I am using a 1920/1080 17 in laptop to work with, if I set it just a little more than half more than the screen size it will not change the images up top at all.

clicking on the thumbnails changes the text regardless of screen size

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.