Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Changing the URL of "Back to Shop" link on product page


PeterCBlanchard

Question

Site URL: http://www.manifestphoto.com

By default product pages have a "back to shop" link on them, but instead of going back to the sales page I have built (where I have products listed using summary blocks), it goes back to the source product list that I am drawing products from.  I was able to hid the "back to shop link" using the following CSS:

.show-product-item-nav #productWrapper #productNav {
    display: none;
}

However I am wondering if there is a way to change the target instead of hiding it so that it will take people back to the page they came from?  This would be much better!  I would be find with either being able to specify the exact URL, or with simply making it behave like the browser's "back" button, since either one will put them back on the sales page.  

My store page is: https://manifestphoto.com/pandemic-art-sale
I'm on the Bedford template. 

I am hoping @tuanphan or another expert can help me.

Thank you so much!!

Link to comment

25 answers to this question

Recommended Posts

  • 1
10 hours ago, StephanieH said:

Not an answer, but I would also like to change the "Back to Shop" link on my site. Maybe you can see it here: https://www.meraki-m.com/shop/super-m

I'd like for it to link to this page (https://www.meraki-m.com/buy) instead of this one (https://www.meraki-m.com/shop)

 

Add 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');
});
</script>

replace beaver with your page url

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 5/20/2020 at 1:11 AM, tuanphan said:

I don't see back to shop, can you take a screenshot & share link to exact page?

 

Ah, sorry - you don't see it because I hid it with this code:

.show-product-item-nav #productWrapper #productNav {
    display: none;
}

If I remove that code and use the same footer code injection you mentioned above will it work on my site? 
Thank you!

Link to comment
  • 0
On 5/26/2020 at 10:38 AM, PeterCBlanchard said:

Ah, sorry - you don't see it because I hid it with this code:


.show-product-item-nav #productWrapper #productNav {
    display: none;
}

If I remove that code and use the same footer code injection you mentioned above will it work on my site? 
Thank you!

Where is your site url? Each site needs different code.

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
18 hours ago, PeterCBlanchard said:

Code Injection > Footer

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('.collection-type-products.view-item #productNav a').attr('href','https://beaverhero.com');
});
</script>

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 5/28/2020 at 1:33 PM, tuanphan said:

Code Injection > Footer


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('.collection-type-products.view-item #productNav a').attr('href','https://beaverhero.com');
});
</script>

 

Amazing, the code worked a treat. Thank you 

Link to comment
  • 0
9 hours ago, Praneetha said:

Hi @tuanphan any chance you could help me with the code for my site? https://designbypran.com/services/p/botanicals-dmbgj

Where is back to shop link?

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 12/3/2020 at 11:05 PM, Praneetha said:

Sorry, I hid it since it's navigating to the wrong place. I just made the breadcrumbs available again.

try this

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('a.ProductItem-nav-breadcrumb-link').attr('href','https://beaverhero.com');
});
</script>

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

Also I have two shop collections so I only want to change the 'back to shop' link for one collection. Is that possible?

At https://www.hewn.ie/vip-shop-5555/serving-spoon-cherry, there is a link 'The VIP Shop' which links back to /vip-shop-555. I would like to change this link.

However, at https://www.hewn.ie/shop/forge-and-carve for instance, the link 'Hewn Shop' links to /shop. I don't want this link to be changed.

Link to comment
  • 0
On 12/18/2020 at 2:39 AM, E_J_L said:

@tuanphan

 Well done! I would like to do the same thing but I'm wondering how are you finding the product specific bit of that code? It might save you doing this for everyone individually!

My product page is https://www.hewn.ie/vip-shop-5555/serving-spoon-cherry

The url doesn't exist. Can you check again?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

I finally managed to change the 'back to shop' link on the product page using the code below. It also allows you to change the back link for products in one product collection only. 

The code was provided by @tuanphan on another thread. Thanks!

On 8/8/2019 at 4:25 AM, tuanphan said:

Add to Header


 

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

 

 

Add to Footer


 

<script>$('a[href="/shop-main"]').attr('href','https://carolyn-thompson-ah98.squarespace.com/shop/');</script>


 

 

 

Link to comment
  • 0

Quite late here, but wondering if you @tuanphan can also help me with this...

I'd love to change my "back to store" to read "back to merch" and also direct to this page: https://www.dannyelfman.com/merch as opposed to the "store"

 

Thank you!

Link to comment
  • 0
On 3/2/2021 at 5:14 AM, skelly said:

Quite late here, but wondering if you @tuanphan can also help me with this...

I'd love to change my "back to store" to read "back to merch" and also direct to this page: https://www.dannyelfman.com/merch as opposed to the "store"

 

Thank you!

Add to Settings > Advanced > Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
	$('#productNav a').attr('href','https://beaverhero.com');
   $("#productNav a").html(function() { 
          return $(this).html().replace("Back to Store", "New text");  
    });
});
</script>

replace with new text/url

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 3/6/2021 at 4:46 AM, tuanphan said:

Add to Settings > Advanced > Code Injection > Footer


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
	$('#productNav a').attr('href','https://beaverhero.com');
   $("#productNav a").html(function() { 
          return $(this).html().replace("Back to Store", "New text");  
    });
});
</script>

replace with new text/url

Amazing! Thank you!

Link to comment
  • 0

Site URL: https://www.jeffreyzie.com/nextdoor

Hey guys,

I'm looking to see how I can change where the "Back" button links to on the product page. Right now, it links to back to  my print store (where it says "Back to prints")

I've attached a screenshot for a preview of what it looks like right now. Any suggestions?

Thank you

-Jeff

 

Screen Shot 2021-06-21 at 12.56.19 PM.png

Edited by jeffreyzie

Creator of ivorycolors.net & stoplitteringtoday.org

Link to comment
  • 0

Site URL: https://www.jeffreyzie.com/nextdoor

Hey guys,

I'm looking to see how I can change where the "Back" button links to on the product page. Right now, it links to back to  my print store (where it says "Back to prints")

I've attached a screenshot for a preview of what it looks like right now. Any suggestions?

Thank you

-Jeff

 

Screen Shot 2021-06-21 at 12.56.19 PM.png

Edited by jeffreyzie

Creator of ivorycolors.net & stoplitteringtoday.org

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