Add Category Label under Product Title (non-clickable)

[tuanphan]

To add a category label under product title on Squarespace Product Detail Page, you can edit product > Additional Info > Add a Block > Choose Code Block > Paste this code.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('<span class="custom-label">digital marketing</a>').insertAfter('h1.ProductItem-details-title');
});
</script>
<style>
span.custom-label {
    order: 2;
    background-color: green;
    color: white;
    width: 150px;
    text-align: center;
    padding: 5px 10px;
    margin-bottom: 10px;
    border-radius: 20px;
}
</style>

Result