I am designing a view loop in the block editor and I need every 'card' in the view to link to the post it's displaying. I've added some javascript inside a HTML block inside the loop item. It refers to CSS class 'view-card' which is the div inside each loop that holds the content. It looks like this:
The linking part works, but not to the right page. It always links to the same post instead of the one that's referred to by the loop item. I'm guessing it's a quick fix, but I need a little help. Do you know what I could do to make it work?
Hello. Thank you for contacting the Toolset support.
Actually - there is no native way to wrap the whole card that is a container for other fields to wrap it using an anchor link.
The thing is that [wpv-post-link] shortcode is returning the same URL because [wpv-post-link] shortcode does not intent to work within the custom JS section.
If you can share the problem URL where I can see the view you added with access details I will try to check if there is any workaround.
*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin and FTP) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.
I have set the next reply to private which means only you and I have access to it.
It's recovered now, admin is speedy again. I've logged out in case you want to try again. I will also talk to my hosting provider to see if they can do some troubleshooting.
I've added the HTML block just before your card block and just after your card block ends. And within the HTML block, I've added the anchor with [wpv-post-url] shortcode and end the anchor tag just after your card block ends as you can see with the following screenshot: hidden link
I can see now proper links wrapped with your all card item posts. Can you please confirm it works at your end as well.
Ok - so there is so successful results while adding the blocks with anchor tag.
So, I've able to find another workaround. I've added the hidden field that holds the URL value of the current post as you can see with the following screenshot: hidden link
And then I've added the following JS code to your view's custom JS box:
jQuery(document).ready(function(){
jQuery('#toolset-maps-distance-center').attr('placeholder','Vul een locatie in');
jQuery(".view-card").each(function(){
val = jQuery(this).find('.currenturl').val();
attrval = "window.location.href='"+val+"'";
jQuery(this).attr("onclick",attrval);
});
});
I can see now it works as expected. Can you please confirm.
I've noticed that the link works great when first loading the web page, but after an Ajax refresh (triggered by pagination) it stops working. Do you know an easy fix?
*** Please make a FULL BACKUP of your database and website.***
Please make sure to update ALL Toolset plugins to it's latest officially released version. You can download the latest plugin release from your accounts page:
=> https://toolset.com/account/downloads/