Can someone please help me place a back to collection button before the product description on product page in Kalles theme? Beside the product title or under the “buy button”
Any ideas would be greatly appreciated. Thanks in advance!
A user seeks help adding a “Back to Collection” button on the product page in the Kalles theme, positioned before the product description or under the buy button/product title.
Proposed Solution:
A responder provides step-by-step instructions:
product-template.liquid in Sections or Templates<a href="{{ collection.url }}" class="back-to-collection">Back to Collection</a>
theme.scss for button appearance (padding, background color, border radius, etc.)Status: The solution has been offered but not yet confirmed as implemented or tested by the original poster.
Can someone please help me place a back to collection button before the product description on product page in Kalles theme? Beside the product title or under the “buy button”
Any ideas would be greatly appreciated. Thanks in advance!
Hi @Edith_2 ,
To add a “Back to Collection” button before the product description in the Kalles theme:
Log in to Shopify Admin and go to Online Store > Themes.
Click Actions > Edit code on your Kalles theme.
In Sections or Templates, find product-template.liquid
Locate the product title or buy button section and add this code before the product description :
Back to Collection
Add the following to theme.scss.liquid for styling:
.back-to-collection {
display: inline-block;
margin: 10px 0;
padding: 10px 20px;
background-color: #f0f0f0;
color: #333;
text-decoration: none;
border-radius: 5px;
}
Got it! If you found my suggestions helpful, please consider liking or marking it as a solution.
Your feedback is appreciated! If you have any more questions or need further assistance, just let me know.
Thanks & Regards
Akshay Bhatt