"Back to collection" button on DAWN theme

Store Design
1

Hi there,

I would like to add a button “back to the collection” on my product page. The button should link to the collection that was just viewed previously / the collection that is associated with a product (I only have one collection for each product). I would need two “back to collection” buttons : one between the product information, and the “you may also like” section, and one between the “you may also like” section, and the footer.

Here is a screenshot:

AnaELW_0-1696945613172.png
AnaELW_0-1696945613172.png1536×1167 313 KB

AnaELW_1-1696945636124.png
AnaELW_1-1696945636124.png1489×1021 256 KB

Here is the link and password to the shop:

https://384f77-3.myshopify.com/collections/archive-six

mewnaw

2

Hi,

Please try this

At product.liquid add the “Back to Collection”


Back to Collection

add this CSS to your theme’s styles

/* Add this CSS to your theme's styles */
.back-to-collection-button {
    display: block;
    margin-top: 20px; /* Adjust the margin according to your design */
    text-decoration: none;
    background-color: #007bff; /* Change the background color to match your theme */
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    transition: background-color 0.3s ease;
}

.back-to-collection-button:hover {
    background-color: #0056b3; /* Change the background color on hover if desired */
}
3

hi @Small_Task_Help

thanks for the code, it works as it should. I just have one small issue. In the mobile view it does not show the button as a button, only as text. How can I fix this?