Masonry gallery doesn’t look right until page is resized even a tiny bit

Hello!

I’m wracking my brain with this one and don’t know what to do. I think I know what the issue is, but I’m not sure how to fix it. When visiting my gallery pages, the images shown don’t tile (masonry-style) nicely until the browser window is resized even just a tiny bit.

What I’m pretty sure is happening is that the gallery is loading before all of my images are done loading, so it lays them out using the wrong number of images. How can I fix it so that my galleries don’t look awkward from the get-go? I’ve seen some people recommend a plugin called ImagesLoaded but couldn’t even get it to install properly.

I built the site using BoldGrid and have minor experience with coding. If it helps, the code for the page looks like this:

<div class=”boldgrid-section”>
<div class=”container-fluid”>
<div class=”row”>
<div class=”col-md-12 col-xs-12 col-sm-12″>
<center>
[gallery targetsize="full" captions="hide" bottomspace="ten" gutterwidth="10" link="file" size="large" ids="171,172,173,174,175,176,177,178,179,180,181,182,183,184,185,186,187,197,188,189,190,196,191,192,193,194,195,198"]
</center>
</div>
</div>
</div>
</div>

Thank you in advance for any help, I would really appreciate it.

The page I need help with: [log in to see the link]