The images are optimized for web but with say 100 images at 500kb it is still 50mb total per say on the page at once. It is curious how if the same images load super fast on page as static images all at once, they are so much slower in the masonry script.

Oh well I will play with the images and see if I can get it faster. The trouble for everyone wanting to display large images, if you want to open 1500 pixel images in light box you have to upload them that large so its available. I just wish the masonry script only loaded smaller thumbnail images like your gallery script does, and then feeds the full size image upon request from the lightbox. that would presumably fix the issue, maybe. But that is only an uneducated observation/assumption.

————————————-

On another note. when I inspect my page with the masonry gallery an look under resources I see 1 of each image that is in the gallery. The full size image. And if I drag and drop on any of the thumbnails visible in the gallery the image that is copied to the desktop is the full size image. you can also open the lightbox and drag and drop that image to and it is the full size image.

The behavior on your demo is different. If you go to kriesi-shortcodes-masonry gallery and inspect that page and look at the resources there are 2 of each image loaded one full size at 1030 px for example and then a thumbnail at 705px for example. and if you simply inspect the code of the gallery you see that the smaller thumbnail is being loaded in the gallery by default. If you drag and drop this image off you get the smaller thumbnail as expected. But the big difference on your sample is that if you open the lightbox you get the full res image, great. It however is not drag and dropable.

So big questions.
1. Why is your lightbox image not drag/drop compatible and the one in the them is?
2. Your sample is the optimal behavior and why it is likely faster. presenting thumbnails and only full res upon request from the lightbox. How do we get this same behavior in our themes. your masonry script must be different than the one loaded in the theme pack for 2.4.1

Can this be addressed please. thankyou

1. Thanks so much for this. This is close to what I need and pointed me in the right direction. It worked but only affected the inside background and not the parent ID that wraps around the .av-masonry-container. So the inside background was red, but it has a 15-20 pixel white border circling the entire canvas of thumbnails. I removed your class and added a background property to the parent ID which in my situation which was: #av-masonry-1. It filled in everything including the inner child class .av-masonry-container

If someone else reads this post, I would imagine the parent ID’s are named chronologically based on how many instances of the Masonry gallery you’ve embedded inside your site. I’m making an assumption here because I only have one Masonry gallery at the moment. So root around in your code and look for the parent ID name and I imagine it will work for you.

2. Yigit, I will submit a request. Thanks for the link.
Mark resolved and close thread.

I try to use Regenerate Thumbnails plugin, now some thumbs is ok, but other is also like this above.

Thanks for the help…

I’ve added that extra line of code, but it’s still not looking right : http://imgur.com/S6iLjJW

Also the sortable categories aren’t showing anymore either? This all changes when I upgraded the theme, but my other portfolio grids haven’t been affected, just this one.

All the images also look like they’re cropped differently to how they originally were.

Not sure why it’s gone all weird – is it because of the upgrade?

Thanks again for your assistance!

Hi Yigit,
Brilliant, thanks that all works.
Might be useful to add the
.av-masonry-entry { width: 19.9%; }
as an option in the settings?

Ref 1) above – would be great if you could offer a ‘Masonry Gallery’ as a non full width element.

Thanks
Chris

Edited config.php at line 898 – got this error:
Parse error: syntax error, unexpected ‘function’ (T_FUNCTION) in /home/lindapir/public_html/grossdyg52/wp-content/themes/enfold/config-woocommerce/config.php on line 903

Also, I did not do this edit yet: do I need to edit the single product thumbnail size in config.php if I have not imported all my images yet?

Thanks – by the way, check out my opening sliders at http://75.103.91.29/grossdyg52/ – I love this theme!!

Hi again,

I came up to
‘div.page-thumb {display: none;}’

so the thumbnail doesn’t show inside single portfolio but does on general portfolio page. However, if you had a php solution for that, I would be glad to hear about it.

Regards.

Hi Yigit,

With ref to the above,

Ref my question 2) above… The CSS below works:

figcaption.av-inner-masonry-content.site-background {
background-color: rgba(0,0,0,0.8);

h3.av-masonry-entry-title.entry-title {
color: white;
}

Thanks, however I have two different queries:

1. http://www.realwiredmusic.com/previous-ongoing-bookings-2/ this is the page where i need to have 4 columns. Is there a way to change this in the masonry gallery?

2. http://www.realwiredmusic.com/artists/ I added the code you gave me to custom css… the images are now showing, but they don’t look right at all, and there is a huge image at the top? I just want 4 rows of portfolio items in a “portfolio small” grid, as per my backend settings.

Lastly, is there a way to add more than 100 portfolio items to a single page without having pagination?

Thanks for your help!

Hi Yigit, Fantastic. : ) Really appreciate your reply.
Love it. Thanks.

Couple more questions though on the full width masonry gallery:

1) Why isn’t it possible to drag the Masonry Gallery into a ‘color section’? It seems to only drop into the full width which makes it look out of place in the rest of the site design. e.g. I’d like a heading above it which says: gallery, then to add the same left and right ‘padding’ as the rest of the site.

Dropping the gallery into a colour section would solve this.

2) Is it possible for you to give an example of the css element required to change the rollover white background for the title and caption?

3) Is it not possible to adjust the width of the images? There seems to be a fixed minimum size for the thumbnails so that it will only show a maximum of 3 or 4 across the page… I’d like to have more images show in the row.

Thanks again for all your help.

Solved the first one – just needed to regenerate thumbnails :)

Still keen to know if it can be used in body and still have a sidebar.

And one more question…how could I sort posts by order (recent first) on one page and alphabetical on another?

Thanks!