Hi!
I would like to remove the padding of the product information box. So the breadcrumbs could come closer to the picture. I am using Dawn theme. I tried to do something with chatgpt and css but I think I didn’t find the right DIV.
Store is Kylara.com
Thanks in advance!
Hello @Kylara
You can add code by following these steps
Go to Online Store → Theme → Edit code.
Open your theme.liquid file
Paste the below code before on theme.liquid
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.
Hello! @Kylara Please follow these steps to add this CSS code:
.section-template--15907263610949__main-padding {
padding-top: 0 !important;
}
@media (max-width: 480px) {
.breadcrumb {
padding: 10px 15px;
font-size: 14px;
}
}
If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the solution.
Best regards
K.K
Hello @Kylara
Go to online store ----> themes ----> actions ----> edit code---->base.css
add this code at the end of the file.
@media screen and (min-width: 750px) {
.section-template--15907263610949__main-padding {
padding-top: 0px !important;
}
}
result
If this was helpful, hit the like button and accept the solution.
Thanks
Thank you it worked!
Can you also help me get rid of the little line between the heading and the breadcrumb?
And when the name of the product is too long, in the phone version it goes to the next line. How can I keep all of the text on the same line on phone?
@Kylara “Could you please share the code for the breadcrumb.liquid file? I’ll make a change.”
{% if template == ‘product’ %}
{% assign current_collection = product.collections.first %}
{% if current_collection %}
Hey @Kylara ,
please try this code if you have some coding knowledge
- {{ product.title | truncatewords: 6 }}
truncatewords
Shortens a string down to the number of words passed as an argument. If the specified number of words is less than the number of words in the string, an ellipsis (…) is appended to the string.
Sorry but I have no coding knowledge. I’ve done every coding with chatgpt.
@Kylara Please replace the code you provided with the following code.
{% if template == 'product' %}
{% assign current_collection = product.collections.first %}
{% if current_collection %}
{% endif %}
{% endif %}
I am adding a truncatewords
the truncatewords Shorten a string down to the number of words passed as an argument. If the specified number of words is less than the number of words in the string, an ellipsis (…) is appended to the string.
If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the solution.
Best regards
K.K
No worries, @Kylara. Please replace the code you provided with the following code.
{% if template == 'product' %}
{% assign current_collection = product.collections.first %}
{% if current_collection %}
{% endif %}
{% endif %}
I am adding a truncatewords
the truncatewords Shorten a string down to the number of words passed as an argument. If the specified number of words is less than the number of words in the string, an ellipsis (…) is appended to the string.
If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the solution.
Best regards
K.K
Thank you so much!
Can you also tell me how to remove the small line above the breadcrumb?
Hey @Kylara Can you please provide me with a screenshot?
Hello @Kylara , If the solution presented meets your needs and addresses your query effectively, I encourage you to accept it as the chosen My All Answer. This will acknowledge your support and aid fellow community members in identifying reliable and effective solutions for their similar concerns.
Thank you.
Okay.
Is it possible to do something like this: If the customer is scrolling in the collection and scrolls down for 3 seconds and then clicks on a item. They will arrive in the product listing. But when they now want to go back to the collection, the website should automatically bring them to the place where they left off. Not to the beginning of the collection. Can this be done through the breadcrumbs or somehow? Or is it too difficult? Because it should work when the customer so to say hits undo (like swiping left on an iphone so it brings you back to the previous page).
