We use the Masonry element to display our blog posts. We have 6 categories and have selected “Yes, display sort options”. Under Styling-Pagination, we have selected 8 posts to be displayed initially, for performance reasons. The problem I have is that not all categories are listed as a sort option, until a blog post from the given category is loaded. Thus, upon initial view of the page, the user cannot know that we have these categories available for sorting. Is there a way to force the masonry element do display all categories as a sorting option all the time?
Hey petepopov,
Thank you for your patience, the sort options will only show for the posts displayed initially and of those posts only the shown ones be sorted. For example on your page when you click the sort “Technical” only three items will show until you load more.
So one way around this would be to change the date on at least one item from each category so all categories will show, but the drawback is that when the category sort is clicked only one item will show. If you initially show 12 items you could show two from each category.
Another way around this would be to show all items in the element settings but use css to hide most of them on the frontend, for example on my test page linked below there are a total of 16 posts, 4 in each category, only 4 will show on page load but clicking any sort link will show the hidden posts and click “All” will show all 16
This is the css used.
#av-masonry-1 .av-masonry-container:not([id^=masonry_id_]) .av-masonry-entry:nth-child(n+6) {
display: none;
}
Best regards,
Mike