Shopify themes, liquid, logos, and UX
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:
Here is the link and password to the shop:
https://384f77-3.myshopify.com/collections/archive-six
mewnaw
Hi,
Please try this
At product.liquid add the "Back to Collection"
<!-- Add this code where you want the button to appear -->
<a href="{{ product.collections.first.url }}" class="back-to-collection-button">Back to Collection</a>
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 */
}
User | RANK |
---|---|
227 | |
180 | |
63 | |
54 | |
47 |
On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023The year-end shopping season is just around the corner. Is a flash sale on your radar? Are...
By Jasonh Nov 6, 2023