Product Page Breadcrumbs edit

here is an example of a product details page using "simple" mode.

https://www.gallerymilmar.com/artists/ashot-asatryan/p/the-return-of-the-prodigal-son-2013

I would like to remove the separator and a second part of the breadcrumbs and just leave the author link. Also, if possible, an arrow character before the author name would be nice. code injection is okay.

Somewhat similar to what this guy has https://www.steeven-salvat.com/store/warbeast

Add to Design > Custom CSS

span.ProductItem-nav-breadcrumb-separator, .ProductItem-nav-breadcrumb-link:last-child {
    display: none;
}

On 6/8/2023 at 1:23 AM, tuanphan said:

Add to Design > Custom CSS

span.ProductItem-nav-breadcrumb-separator, .ProductItem-nav-breadcrumb-link:last-child {
    display: none;
}

 

thanks, it works. That being said, is there an easy way to change the content of an html tag as well by any chance? for example to change that same breadcrumb from an artist name to just "back to artist". I assume you'd need to use js script to access the content? how would the code injection cool like?

On 6/10/2023 at 7:40 AM, revisor said:

thanks, it works. That being said, is there an easy way to change the content of an html tag as well by any chance? for example to change that same breadcrumb from an artist name to just "back to artist". I assume you'd need to use js script to access the content? how would the code injection cool like?

Change to this?

38 minutes ago, tuanphan said:

Change to this?

I was thinking of "← back to the artist" so that it can be used for any artist, but any code will do since I can reverse engineer the string myself

On 6/12/2023 at 8:19 PM, tuanphan said:

Add to Settings > Advanced > Code Injection > Footer (or Settings > Developer Tools > Code Injection > Footer)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(".ProductItem-nav-breadcrumb-link").html(function() { 
          return $(this).html().replace("Ashot Asatryan", "← back to Ashot Asatryan");  
    });
});
</script>

 

very nice, thanks, I modified it to account for different artists, so this would be the final version.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(".ProductItem-nav-breadcrumb-link").html(function() { 
          return ("← BACK TO ARTIST");  
    });
});
</script>