Jump to content

"Back to shop" hyperlink - can I change it?

Recommended Posts

Site URL: https://tonyangelimages.com

I've recently spent a good deal of time restructuring my website, as I had a product/landing page with no buying options meaning that customers had to navigate to a standalone shop page which could then result in heavy scrolling. I partially address this by adding product categories but then saw I could utilise the description field under each product to provide as "buy now" link that went straight to the product in the shop. I've now updated all the product descriptions and this has allowed my to unlink the shop page and simplify navigation around the site for visitors.

I now have one issue I'd like to address. At the moment, if a customer adds an item to their cart they will see a back arrow for when they're finished. However, that arrow takes them to the whole of the shop (not good) rather than taking them to the previous page (preferred). Is there a way to change that link so it behaves like a normal "back" link, and also to remove the "... to shop" text so that it just says "Back"?

I've attached a photo which will hopefully clarify what I mean.

256803842_Nature-LeavesTonyAngelImages2021-01-1912-13-57.thumb.jpg.af1606a340f4f9a6f8d9f1b284106799.jpg

Link to comment

Add this to Home > Settings > Advanced > Code Injection > Footer

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
	$('div#productNav a').attr('href','https://beaverhero.com');
  $("div#productNav a").html(function() { 
          return $(this).html().replace("Back to Shop", "Back");  
    });
});
</script>

Replace with your new url

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
On 1/20/2021 at 2:21 PM, tuanphan said:

Add this to Home > Settings > Advanced > Code Injection > Footer


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
	$('div#productNav a').attr('href','https://beaverhero.com');
  $("div#productNav a").html(function() { 
          return $(this).html().replace("Back to Shop", "Back");  
    });
});
</script>

Replace with your new url

Wonderful, thank you!!!

Link to comment
  • 2 years later...

Hi @tuanphan you are the resident genius on this subject of changing 'back to x' hyperlinks so I'm wondering if you could help me... I used the above script that you gave Tony and changed it for our link text and URL; the link is going to the right place now but the displayed text in the link isn't changing - what am I doing wrong?

I want to change the blue "back to bailongo 2023 products" at the top to just "Back". This is what I put in the footer:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
    $('div#productNav a').attr('href','https://www.bailongomontreal.com/test-shop');
  $("div#productNav a").html(function() { 
          return $(this).html().replace("back to bailongo 2023 products", "Back");  
    });
});
</script>

 

Thank you in advance.

Screenshot bailongo product.png

Edited by ProjetTango
Link to comment
On 3/7/2023 at 6:47 AM, ProjetTango said:

Hi @tuanphan you are the resident genius on this subject of changing 'back to x' hyperlinks so I'm wondering if you could help me... I used the above script that you gave Tony and changed it for our link text and URL; the link is going to the right place now but the displayed text in the link isn't changing - what am I doing wrong?

I want to change the blue "back to bailongo 2023 products" at the top to just "Back". This is what I put in the footer:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
    $('div#productNav a').attr('href','https://www.bailongomontreal.com/test-shop');
  $("div#productNav a").html(function() { 
          return $(this).html().replace("back to bailongo 2023 products", "Back");  
    });
});
</script>

 

Thank you in advance.

Screenshot bailongo product.png

Can you share link to a product? We can check easier

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

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.