Generate thumbnails like 500px.com

Question

I tried but couldn't get thumbnails like these, in wordpress. Please check this url https://prime.500px.com/galleries/tricks_and_treats

If you notice, there is no cropping. Its just zoomed-out or whatever you call it. Tumblr also uses such technique of thumbnails. The image is shown full but in small size. Width is custom, say 300px and the height of thumbnail is variable, so the thumbnail does not look awkward.

What I did, unchecked the Crop checkbox in Media settings and set dimensions for thumbnail but it wasn't generating the same as on the 500px site.

Any idea or suggestions?

Answer 1

I have gotten something similar working in WordPress by incorporating the Masonry script (or isotope if you want filtering)

Here they are:

masonry -> http://masonry.desandro.com/
isotope -> http://isotope.metafizzy.co/

I am assuming you are comfortable with javascript and jQuery so I won't tell you how to use it (the site has tutorials if you get stuck) - but getting it to work in wordpress is just a matter of enqueueing and targeting correctly - though to get it to work with featured images for posts would take a little bit more work.

Hope this is helpful.