-
Posted in : Read WP
-
Hi,
Is it possible to align the masonry blocks? That is, some way to define the exact size of the image and text so that all blocks can be alligned horizontally (and vertically)?
Also, is it possible to add a side bar with the masonry (I guess the masonry blocks would need to be reduced in size)?
Many thanks
MarcusHi,
I managed to sort the image size by pasting this code in to the style customizer, as you mentioned in another thread. Thanks
.featured-image { overflow: hidden; max-height: 200px; }
However, can you let me know if its possible to:
— Add the side bar to the homepage masonry view
— Remove the ‘Continue Reading’ text box and white space below the featured image in masonry view, as I’d like to make the page more compact?
Many thanks,
MarcusHi, use this custom css:
.blog-masonry .more-link { display: none; }Note: Masonry hasn’t got a sidebar.
Thanks
Hi Mehmet,
I would like to be able to align my posts in the same way; these posts however contain images and text.
I’ve looked around and although there are Auto Excerpt plugins that limit the post size automatically with a specific number of characters in masonry view (the best one being Evermore), I haven’t found anything that forces the “continue reading” when images and text are present in a blog post so that every item is the same height.
Is there a way to do this?
Thanks!
PB
Hi, in order to align masonry items horizontally you need to edit
js/main.jssource code and find line : 512,// initialize isotope $containerBlog.isotope({ itemSelector : '.hentry', layoutMode : 'masonry' });and replace it with this;
// initialize isotope $containerBlog.isotope({ itemSelector : '.hentry', layoutMode : 'fitRows' });But this may not be the full solution because in order to align masonry items, their content should almost be identical, same aspect ratio for featured images, similar post title and excerpt lengths etc..
hi
I can’t change the JS file, can someone teach me?
also, i want to make the blocks number of the masonry as 3 instead of 4.
Please, thanks :)– just open theme folder
js/main.jsfile in a text editor, edit and save.in line : 337 you will see column sizes in various resolutions;
var viewports = [ { width : 1200, columns : 5 }, { width : 900, columns : 4 }, { width : 500, columns : 3 }, { width : 320, columns : 2 }, { width : 0, columns : 2 } ];Hi:
@ahmetsali
sorry, i still can’t find it! U mean in the folder that i downloaded to edit?
I don’t exactly know the steps of doing it!
would u mind telling me? thanks :)
You must be logged in and have valid license to reply to this topic.