How can I redirect a product click to a terms agreement page?

[KiwisINC]

Hello.  I use the debut theme, and what I am trying to do may sound unusual. What I would like to have happen is when a user clicks on a product from a collection box, rather than it take them to a screen where they can select the quantity and add to cart I want it to take them to a warning page (not a popup) where they have to agree to certain terms by checking a box then clicking continue, which would then send them to the product page.  How can I change the path so when someone clicks it goes where I want it to?  I appreciate any help you can offer!

[OpenThinking]

Hi there,
Jack from OpenThinking here!

The quickest way to explain here on the forums would be with JavaScript.

1. Open your theme editor: Online store > Themes > Actions > Edit code

2. Navigate to layout/theme.liquid > paste the following code before </head>

<script>document.addEventListener("DOMContentLoaded", () => {  Array.from(document.querySelectorAll('a.grid-view-item__link')).forEach((el) => el.href="https://openthinking.net/") });</script>

3. In the above code Change "https://openthinking.net/" with the url where you want to redirect the user.

4. Now in your Shopify backend navigate to: Online store > Pages 

5. Create a new page and populate with the text you want to show the user.

6. Copy the link of the page and replace it with the one in STEP 3!

let me know if this works for your. If yes; accept my answer and give me thumbs up! Thank you.

[KiwisINC]

This worked beautifully, and was very easy to follow.  Thank you.  I'm curious if you'd lend me a bit more of your time if you don't mind, and explain to me if there is a way to have each separate collection navigate to a different page?  As of me applying the code you gave me, all of the collections navigate to the same page.   If it would be easier to have each image within a collection navigate to a different page that would work splendidly as well. Thanks again for your help!  You managed to help me more in 5 minutes than I was able to help myself with several hours of searching different sites.  

[OpenThinking]

Yes, sure.

The code below redirects to a "Consent" page, from this page once you click the "I agree" link it takes you to the original Product page the user wanted to go originally. 

Replace the old with this one:

<script>
document.addEventListener("DOMContentLoaded", () => {
const urlToConsentPage = 'https://openthinking.net/'
const aElement = 'a.grid-view-item__link'
Array.prototype.forEach.call(document.querySelectorAll(aElement), function(el){const og = el.href; el.href = urlToConsentPage + '?go=' + og })
const qS = window.location.search
const urlParams = new URLSearchParams(qS)
const redir = urlParams.get('go')
const butt = document.getElementById('consent')
butt.href = redir
});
</script>

On the redirect page create a link with ID of consent (id="consent") like so:

<a href="#" id="consent">I agree</a>

and you're good to go.

let me know if this works for your. If yes; accept my answer and give me thumbs up! Thanks