Hyperlink the "cart-row-title" (the individual product title) to the home page.

While on the Cart page (when it contains at least 1 item), how can I hyperlink the "cart-row-title" (the individual product title) to a section on my home page? Rather than to the dedicated product page that it defaults to on Squarespace 7.1. 

*Note:   The specific section on the home page already has a code block that I use as an anchor.

*Note:   It seems that each product title has it's own unique variation of the "cart-row-title". 

I'm hoping to also be able to slightly modify the code for the "continue shopping" button to link to that same section on my home page.

Thanks, 

Do this for all products or just specific product? Can you share site url?

For each individual product.  Each one should link to it's own anchor on the home page, but if that's not possible, it's ok if they all need to go to the same anchor. Sorry I don't have permission to post the Site URL. I was hoping for generic 7.1 code that I could tweak. I have a basic understanding of using browser developer tools to find the name of most elements.

You can use this code to Website Tools (under Not Linked) > Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
  jQuery(document).ready(function($){
  $('a.cart-row-title').attr('href','https://google.com');
})
</script>

Replace Google with your desired url

Reference:  

@tuanphan I appreciate the response, but that didn't work (not even to the google link). I tried switching various naming conventions that I found within my browser's developer tools for the product link; also several variations of similar code before posting my question to this page. 

I also tried using that footer code for the 'continue shopping' button and it also didn't work. I figure when I find the correct code, I can simply switch the name of  'a.cart-row-title' to whatever element I want and it should still link.

While I don't have permission to provide the password, here is the website:  https://www.jessicamoorecoaching.com/

Thanks,

Can you keep my code in Code Injection? I can check again easier

@tuanphan ok, I've pasted your exact version into the Code Injection - Footer. 

On 1/23/2024 at 12:23 AM, calphi said:

@tuanphan ok, I've pasted your exact version into the Code Injection - Footer. 

Try this new code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
  jQuery(document).ready(function($){
     setTimeout(function(){
             $('a.cart-row-title').attr('href','https://google.com');
         }, 3000);
})
</script>

Whooo!!! Progress!  That code works! however is more responsive after changing the time from 3000 to 10 (so now if I happen to click the product link immediately after the page loads, the script will still work.) Unfortunately the code applies the same link to ALL products, whereas I was hoping to provide a custom anchor link for each product (let me know if you think I can find a more specific naming convention rather than the generic a.cart-row-title)

I also applied this same script to the Continue Shopping button (a.cart-continue-button) however it doesn't work if I'm already on the cart page and delete all items from my cart (so there's nothing left). It only works just after freshly navigating to the cart page when it's already empty. Seems weird that the continue shopping button would change it's identifier depending on when it becomes displayed on the cart page. 

So you want, each product will change to a different link?

@tuanphan Yes, that is correct.  

I have also applied this same script to the "continue shopping" button (which I have renamed). I don't understand why the script only works after I navigate to the cart while it's empty. The script won't work if I am already in the cart page, and then delete all the items. 

On 1/25/2024 at 2:55 PM, tuanphan said:

Try this new code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
  jQuery(document).ready(function($){
     setTimeout(function(){
             $('a.cart-row-title').attr('href','https://google.com');
         }, 3000);
})
</script>

 

#1. With this item, 

you can change code to

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
  jQuery(document).ready(function($){
     setTimeout(function(){
             $('a.cart-row-title[href="/purchase/p/reflect-session"]').attr('href','https://google.com');
       
         }, 3000);
})
</script>

You can repeat this line for other items

#2. Which exact script code did you add?

@tuanphan   

#1  Thanks, that naming convention allowed me to customize each product's link. (Although only when first navigating to the cart page) Once an item is deleted from the cart, any remaining product links seem to die completely. 

#2 This script works for the 'continue shopping button' when first accessing an empty cart. But if I add items, and then delete them from the cart, the link stops working when the 'continue shopping' button reappears. 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
  jQuery(document).ready(function($){
     setTimeout(function(){
             $('a.cart-continue-button').attr('href','https://www.jessicamoorecoaching.com/home#sessions');
       
         }, 50);
})
</script>

Delete then add again: I don't know code to fix this.