Support community for TTG plugins and products.
NOTICE
The Turning Gate's Community has moved to a new home, at https://discourse.theturninggate.net.
This forum is now closed, and exists here as a read-only archive.
You are not logged in.
Pages: 1
On this site https://pideja.ca/gbc/home/, I updated the pages of the albums to Pangolin from Okapi. So, there are new GBC-page and a new GBC-album I also assigned the CSS file used in the Okapi version.
The navigation is horizontal and very simple: ACCUEIL, PRODUCTIONS and CONTACT. The album-set is labelled PRODUCTIONS. The problem is in each of the productions (Albums).
Although I tried to copy the settings from the Okapi to the Pangolin pages, there are differences in the settings, sometimes difficult to reconcile.
The thumbnail size is one issue: I can't control the container size or the image size, both way too big.
Also, the is a box below each thumbnail that should display the filename of each image. As much as I review all the Backlight settings, I can't find where to control these functions.
Last edited by pideja (2019-08-11 03:25:10)
Offline
I finally re-assigned the Album pages back to the original Okapi pages and all seems well in GBC land.
For now!
Offline
I also assigned the CSS file used in the Okapi version.
Be aware that some selectors changed between Okapi and Pangolin. So if you see some weirdness, you may need to rewrite some css.
If you changed anything to do with image/thumbnail size or metadata, you'll need to republish.
Thumbnail captions are controlled in the album template under Thumbnail Grid > Metadata Display
Make sure that the caption text color is not the same as the background color.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
This is one of the recurring issues I have with the albums I have already published: I can't control the thumbnail size and appearance when in the mobile format.
pideja.ca, pideja.ca/tnm, pideja.ca/duc and others...
This is a typical CSS used:
@media only screen and (min-width: 360px){.album thumbnail {
position: relative;
width: 166px;
height: 125px;
}
} And setting Backlight>Designer>Templates>Album-pideja>Design>Thumbnail Grid>Aspect Ratio to 1:1 doesn't do anything.
I had already set these thumbnails a while ago, to a 4:3 format but it's ok on the large screen but on the phone it would be better, I think, at 1:1.
Offline
take a look at the Enforce Squares and Enforce Coverage controls in Thumbnail Grid. Try changing breakpoints
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Did that and no change. Smallest breakpoint (640px) used.
Offline
Your css above states that on any device wider than 360px, your css will be used.
So, essentially it will apply to all devices unless you have another media query following that one that changes css at different width points
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Changed
@media only screen and (min-width: 360px)to
@media only screen and (max-width: 360px).album_thumbnail {
position: absolute;
width: 50px;
height: 50px;
}The thumbnail container does not change size or shape, but the image itself is larger than the container. Not truly satisfactory (I would prefer a 1:1 thumbnail) but it's an improvment of sorts.
Last edited by pideja (2019-10-10 03:42:59)
Offline
Pages: 1