Add a Custom Masonry Layout with 2 Plugins

I’ve been meaning to set up a Masonry style layout for my weekly photography posts for a while. After my earlier post meshing together plugins, I figured now was the right time to show how to do it. Sure you could do this with a child theme and some specific themes have this layout. There are also some Masonry plugins that’ll get you some of this. This path allows you a good bit more freedom in the end and hopefully walks the middle path between intimidating coding and still having some real control over the end product/style etc. It’s also not a bad example pattern for integrating other javascript options without the hassle/upkeep of child themes etc. Plugins Needed Display Posts Shortcode – gets us the posts we want Specific CSS/JS for Posts/Pages – lets us tie in the masonry JavaScript library and custom CSS To Business Activate those plugins. Make a page where you want your Masonry layout to show up. You’ll have the option at the bottom of that page (or post) to link to the mansonry library and turn it on for the page. You can see that below. You can put the CSS in this area as well. Don’t forget to wrap it in the style tags. Since I was using a Bootstrap based theme I […]