-
Posts
-
Dear All,
I am using a masonry with 12 posts (4×3), filter and pagination being displayed. (See private link).When I filter for categories, one is displayed correctly the other not. On filtering (shuffling the posts and hidding the other categories) the first category there should be 8 posts being displayed. The first row is displayed fine, the second row get’s cut off at the middle. The pagination buttons also slide upwards and are overlaying the second (half) row.
Filtering by the second category works fine.
Any ideas? Best regards,
AljoschaI’ve had issue with the sorting on this page before, see: https://kriesi.at/support/topic/mansonry-sort-broken/
It was then solved moving css from Quick-CSS into a code block on the page.Hi Aljoscha23,
Can you explain a bit more the code block part?
Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?
Best regards,
VictoriaHi Victory,
the link to the other support thread I posted in the second post of this thread explains the code block.
I originally had Quick-CSS to instantly load images, instead of loading them only when scrolling:
.av-masonry-entry { opacity: 1 !important; visibility: visible !important; }When I ran into problems with the sorting, Elliott, a former mod, told me to remove the code from Quick CSS and instead
add it into a codeblock element like so.
<style type = "text/css"> .av-masonry-entry { opacity: 1 !important; visibility: visible !important; } </style>Only on the pages where your using the Masonry element.
I did this and the images loaded instantly, while the sorting worked. Now checking the filter I found, that with the Codeblock the sorting again is broken. If I remove the code, the sorting works fine, but images are not loaded instantaneously any longer.
Best regards,
AljoschaHi Aljoscha23,
Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?
Best regards,
VictoriaHi Aljoscha,
Can you please put this code to your Quick css, remove the code block and see if this helps
.page.page-id-461 .av-masonry-entry { opacity: 1 !important; visibility: visible !important; }Best regards,
VictoriaDear Victoria,
I did as you suggested. Tried the page with different browsers and cleared cache. Unfortunately, the issue remains.
Best regards,
AljoschaHi Victoria,
sorry to say, but when filtered it is still cut off… Tested in Firefox and IE.
Best regards,
AljoschaHi Aljoscha,
I asked my colleague to have a look. I can see that this is still happening even in Chrome, it seemed to work fine yesterday.
Best regards,
VictoriaHi,
I see that you have enqueue the avia.js to your child theme, but I don’t see it in your child theme /js/ folder ,yet you have a custom script for “portfolio sorting” Have you tried deactivating this script and any plugins to see if there is a conflict?
One quick solution might be trying this code in the General Styling > Quick CSS field:@media only screen and (min-width: 767px) { #top.page-id-461 #av-masonry-1 { min-height: 680px !important; } }Best regards,
MikeDear Mike,
yes, the portfolio sorting comes from here: My client did not want images to fade in.
When I apply your Quick CSS the images get fully shown, but the pagination buttons are still hovering over the images.
I will disable the JS Script and everything to check if I can trace down the conflict.
Best, Aljoscha
Hi,
When I look the pagination is below the element, perhaps you have already found a solution, or clearing your cache will help?Best regards,
MikeDear Mike,
i cleared my cache and reloaded the page in two different browsers. Yet the problem with the hovering pagination buttons persists.
Loading the newsletter page looks fine at first, but when you use the filter the pagination jumps. depending on which page (pagination goes from 1 to 3) you are on, the error occurs in different variants.
Best,
AljoschaHi,
The issue is on the way scripts load, it conflicts with something else, not sure what exactly, but it does conflict with something.
Best regards,
BasilisHi, I now had time to do more extensive testing.
I deactivated all plugins – no result.
I removed all Quick CSS – the error disappeared, as did all the custom styling. So I inserted the different CSS snippets one by one.Finally it works when removing the two last snippets. The one from Victora, that replaced the one by Elliot, and finally the one provided by Mike.
Why it now works without any of these CSS Codes is beyond my understanding. But as long as it works! Thank you!
Best, Aljoscha
- You must be logged in to reply to this topic.