Archived topic
Weird problem: Post title links become disabled in archive pages
5 replies · Started by qpaq on May 31, 2021
Hi,
I realised that the title links on my posts become disabled in one of the custom taxonomy archive pages, but the weird thing is only the ones that are visible on the screen becomes disabled. When you scroll down, the rest works fine.
If you change the size of the window and refresh, only the links on the visible part of the screen becomes disabled, the rest work fine.
It might be about the pagination of the archive listing even though I've included
.paging-navigation {
display: none;
}
to the CSS, I still see it underneath. I also checked the 'Use infinite scroll' option for the archive pages on Customization. Still on the profile archive page the pagination navigation exists and I can't click any of the post titles that are visible on the screen. It seems there as a layer over the page that navigates to the next page only.
Hi qpaq,
I've checked the site and these errors may be related - https://share.getcloudapp.com/4gunDkL5
I don't see any disabled title links but what's weird here is, the whole page is a link.
When I click anywhere within the page, it goes to the 2nd page of the archive pagination.
Is this created using a child theme template? Perhaps there's a syntax error with the code.
Let us know.
Hi Elvin,
Thanks for your reply. I couldn't understand what those errors you've pointed out means. What's weird is only the links that are visible on the top part of the page (the first visible screen area before scroll) are not active, as if the whole screen becomes one single link to the second page.
I use a child-theme but I didn't change anything in the theme code.
It must be related something to pagination and infinite scroll settings but I couldn't figure it out. Now even though infinite scroll is set up, I see the pagination navigation before the last post!?
Hi there,
the issue is this CSS:
#nav-below a:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Presumably you want that for your Paging navigation on the Single Post, but its also being applied to the archive pagination because they both use the #nav-below element ID.
Any of your CSS that uses the #nav-below selector that you want to apply only to the Single post should be changed to:
#nav-below.post-navigation
For example the above CSS would become:
#nav-below.post-navigation a:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Hi David,
You're a hero! Thanks so much.
You're welcome