Jump to content

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

Recommended Posts

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, 

 

 

Link to comment
  • Replies 13
  • Views 1.4k
  • Created
  • Last Reply

Top Posters In This Topic

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.

Link to comment

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:  

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

 

@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,

 

Link to comment
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>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

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. 

 

Link to comment

@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. 

Link to comment
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, 

image.thumb.png.49f39d9f76fd609f91c8705da6081553.png

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

image.thumb.png.010480ab4b212fc11ed249a49df9d57d.png

#2. Which exact script code did you add?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

@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>

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.