[Resolved] above the fold is navigating to next page

[MJ123]

Hi I just updated my theme to Version: 3.2.4 and now above the fold, including menu bar, is turned into an invisible navigation button.
On blog posts everything is fine it’s just for the archive pages and home page.

The when I click on the site icon or anywhere above the fold, the next page (page 2) will load and once it reaches the las posts if I click again it will go back to previous page and create a loop opening last page and the one before last page.

Im not sure if its because the update or something caused a conflict or something.

[MJ123]

other changes I made after the update and before realizing this issue:
– I uninstalled generate blocks plugin
– added custom Next/Prev Post navigation recommend here: https://generatepress.com/forums/topic/post-navigation-with-clickable-thumbnails/#post-1523670

I removed the Next/Perv code snippets to check if that is causing the issue or not, but the issue is still there.

[Fernando]

Hi Milad,

Can you disable your caching/optimization plugins first? Most CSS codes are compiled inline in your header. We’ll recheck again once you’ve disabled them so we can assess the issue better.

[MJ123]

I’m using Ezoic leap. that’s the only caching and optimization system I’m using. Unfortunately I can not disable leap as my website heavily rely on it.
I tried to clearing the cache and tried after each troubleshooting step I took. so caching is not an issue.
I did not make any changes to the PHP code and CSS styles recommended in the codes aded for Custom post nave link I shared.

[Fernando]

I see. It’s not caching that’s the issue though. It’s more of the way your CSS codes are optimized or some custom code you have. With this Optimization setting by Ezoic enabled, it’s hard to assess. Take note that simply updating no matter what theme you’re using may trigger a change in the way Ezoic was optimizing CSS.

Moreover, any form of merging/combination of CSS and JS files more often than not causes more issues than it helps. See here for more insights: https://wpjohnny.com/why-you-shouldnt-combine-css-js-performance-reasons/

Would you be able to start a Staging site? In that way, you can disable Ezoic safely there, and we can proceed with testing.

[MJ123]

Staging site is live now

[Fernando]

You have this code in your style.css file:

#nav-below a:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

May we know what this code is for? It’s the one causing the issue. Can you try deleting it and see how it goes?

[MJ123]

that code is for making the images in the custom Post Navigation clickable.
I removed it and the problem is no longer there but I also lost the Post Nav click option.

is there a better code to keep the Post Navigation clickable without causing this issue?

[Fernando]

As opposed to a code, a better approach would be to use a Block Element – Post Navigation instead. Reference: https://docs.generatepress.com/article/block-element-post-navigation/

GenerateBlock Image Blocks can be turned into links as well if this is the feature you’re looking for.

[MJ123]

Thank you Fernando, the Leap keeps saying GB negatively impacts my site so I removed it.
Im trying to achieve a similar effect without using the BG plugin

[David]

Hi there,

is that the article from Ezoic ? If so, please don’t pay any attention to it. There is no fact or substance as to why they say that.

The plugin is built to the same standards that we built GeneratePress which is performance first.
GenerateBlocks only outputs the HTML for the blocks you add, and only writes the CSS those blocks require.
It has no static stylesheets, Javascript or Font libraries to load. And if you do not add any blocks to a page it will not add any code.
If you use GB to create some content it will create the same amount of front end code if not less code then what we could provide as custom development.

[Author]

Posts