- This topic has 16 replies, 4 voices, and was last updated 2 years ago by
.
Hi there,
after a recent Jevelin theme update I noticed that the masonry blog layout that I have on my archive pages started to behave strangely. In particular, on some pages it would display blank spots and shift posts to a next row, even though I have a 3 column grid with 9 posts in total – on main blog page and most of other archive pages it seems to show that normally.
Here are a couple of pages that I noticed such behavior:
- here the last row of posts is split into two (1 on one row and 2 on another) – https://theathleteblog.com/resources/training-tips/
- here I have 7 posts in total (so not a full page and no pagination), however row 2 shows 2 posts on the right and row 3 shows 2 posts on the left) – https://theathleteblog.com/resources/training-tips/
There are more examples on my categories page, but these seem the most vivid. I also attach a screenshot so that you can see the issue I’m having.
Is it possible to setup masonry so that all posts are ‘aligned to the left’ and there are no blank spots like the ones described?
Thanks and best regards,
Andrejs
Hi Andrejs,
I hope you are well today and thank you for your question.
Could you please try clearing and temporarily deactivating the W3 Total Cache and autoptimize cache plugins on your website?
Best regards,
Shufflehound teamHi,
I cleared all caches and then deactivated both Autoptimize and W3 Total Cache, as you suggested. However, the result was exactly the same – there were blank spots just like on this page.
Now I’ve activated both of them back.
Best regards,
Andrejs
Could you please again temporarily deactivate the W3 Total Cache and autoptimize cache plugins on your website so that I can troubleshoot it?
I just did, please troubleshoot
Solution for this topic
I can see this is happening because you have added below CSS code in the style.css file of your child theme.
.archive .blog-style-masonry article, .search .blog-style-masonry article { position: relative !Important; top: 0 !Important; left: 0 !important; }You can resolve the issue by removing the above CSS code.
Thanks for checking!
I removed that line of code, but it doesn’t seem to solve the issue. Here masonry is still quite mixed and on this search results page the numbering is in a very weird place
I visited the shared pages and they are displaying fine for me.
Could you please test it clearing your browser cache?
thanks, that seemed to have solved the issue, yet in incognito mode it still shows blank spots as previously.
However, now after I scroll to the bottom on this page the very last post overlaps with the footer and is almost non-visible (screenshot attached) – I think that was the reason why I added that code. Can you check why that happens, please?
Please try updating the theme on your website to the below latest version as described here https://support.shufflehound.com/updating-theme/
I updated the theme now, but it didn’t seem to fix the problem
Please try deactivating the Footer Parallax option in the theme settings as shown in the attached screenshot.
Hi,
I did and it made it worse – now all posts have this problem. It seems like masonry is not recognized as a space and footer comes right after the header
You are most welcome here 🙂
Where did you find this change, my website is doing the same thing and I would like to solve the issue.
Hi there,
Sorry for our late response. Please notice that it is better to start a new topic that to reply for old one.
Previously this was answered by different support user, so we will need a link to your website, so we can see the issue in live.
Best regards,
Shufflehound team
