Plugin Author
Rattus
(@pasyuk)
Here is Custom CSS for full window width gallery:
.gmedia_gallery {
position: relative;
left: 50%;
width: 100vw;
transform: translateX(-50%);
}
This CSS will remove gap between galleries:
.gm_term_wrap {
margin: 0 !important;
}
Add code above to Custom CSS field of your galleries.
Gallery uses the same font as your theme, so for each theme the fonts will be different. What do you want to change Font Family or Font Size?
Thanks for the code. Looks perfect on a PC, but unfortunately the galleries look too vertical on iphone. So I switched to albumslistmasonry.
But now I cannot set the “Minimum Thumbnail Width” more than 300 and my 3 galleries look too small on a PC and remain packed to the left. (Looks fine on iphone). I would like to have only 3 galleries on each line that fill up the width of the screen.
Works with albumsview2: http://cybercisco.photo/gmedia-albumsview2/
Doesn’t work with albumslistmasonry: http://cybercisco.photo/gmedia-albumslistmasonry/
Also, the “.gm_term_wrap {margin: 0 !important;}” code doesn’t seem to work with albumslistmasonry (I’m still getting the minimum spacing of 5.)
Thanks a lot
Plugin Author
Rattus
(@pasyuk)
We’ll update AlbumsListMasonry soon with few more options that will fit your needs and allow to set thumb width more than 300.
Additional to the code above you need to add:
html { overflow-x: hidden; }
so there will no horizontal scroll on Windows browsers.
Below is code that modifies AlbumsLisLmasonry module and makes it stretch full width, but the albums cover quality will be poor (will be fixed in the update):
.gmedia_AlbumsListMasonry_SplashPage {
display: flex;
height: auto !important;
flex-wrap: wrap;
}
.gmedia_AlbumsListMasonry_Cover {
position: static !important;
flex: 1 1 auto;
}
.gmedia_AlbumsListMasonry_CoverImgHolder img {
width: 100% !important;
object-fit: cover;
position: static !important;
}
.gmedia_AlbumsListMasonry_CoverTitleHolder .coverTitle {
max-width: none !important;
text-align: center;
padding-right: 0 !important;
}
Note that after module update you need to remove these code as it can break the new functionality.
Thanks for the code, looks perfect on PC now 🙂
Looking forward the update!
Last issue, on iphone, there is a responsiveness problem, the pictures are displayed truncated.
This is how it looks like now:
https://monosnap.com/file/pdAlYn3T5cDQRNa5jS1JDE72GU06Th?idx=1&total=2
And this is what I need:
https://monosnap.com/file/Qv8WP58ISycf3Zxd19xTyaHd7fnsYK?idx=0&total=2
Thanks again
Plugin Author
Rattus
(@pasyuk)
Well, the height is static on the gallery and it is not changes depending on browser width.
Here is updated code. Replace code in previous message with this one:
.gmedia_AlbumsListMasonry_SplashPage {
display: flex;
height: auto !important;
flex-wrap: wrap;
}
.gmedia_AlbumsListMasonry_Cover {
position: static !important;
flex: 1 1 auto;
max-height: 60vw
}
.gmedia_AlbumsListMasonry_CoverImgHolder img {
width: 100% !important;
height: 100% !important;
object-fit: cover;
position: static !important;
}
.gmedia_AlbumsListMasonry_CoverTitleHolder .coverTitle {
max-width: none !important;
text-align: center;
padding-right: 0 !important;
}
Plugin Author
Rattus
(@pasyuk)
If it does not bother you then, please, post a review about he plugin. It’s very important for me and for plugin popularity. Thanks.
I did, but you haven’t reacted to my 2 comments, so I will create a new ticket about them 😉
btw, thanks for your help on the previous tickets and for your work on Gmedia. It is definitively the best Gallery for WordPress and specially with a great image management.