Hi there,
My collection descriptions are not showing on mobile, is there a way I can fix that?
Something on the code or shopify?
Desktop is okay, but mobile isn’t showing.
https://www.manukapharm.co.nz/collections/powder
https://www.manukapharm.co.nz/collections/manuka-honey
Thank you!
1 Like
Hi @maaferreirac
- In your Shopify Admin go to online store > themes > actions > edit code
- Find Asset > app.scss.css and paste this at the bottom of the file:
@media (max-width:767px){
.rte.collection-description.subtitle.s-hide {
display: block!important;
}
}
Hello @maaferreirac
You need to remove or change the property of the following CSS.
OLD CSS
@media (max-width: 1023px) {
.template-collection .collection-header .collection-description {
display: none;
}
}
@media (max-width: 700px) {
.s-hide {
display: none !important;
}
}
NEW CSS
@media (max-width: 1023px) {
.template-collection .collection-header .collection-description {
display: block;
}
}
@media (max-width: 700px) {
.s-hide {
display: block !important;
}
}
Attach Screenshot
For Tablet
For Mobile
Thank you
Hi @maaferreirac
Please go to your Online Store > Themes > Customize > Theme settings, open Custom CSS, add this code, save change and check again.
.template-collection .collection-header .collection-description {
display: block !important;
}
Hello @maaferreirac
Go to online store ---------> themes --------------> actions ------> edit code------->assets-----> app.scss.css
add this code at the bottom of the file.
@media (max-width:767px){
.rte.collection-description.subtitle.s-hide {
display: block !important;
}
}
adn the result will be
If this was helpful, hit the like button and mark the job as completed.
Thanks