Goal: hide a specific Multicolumn section on desktop while keeping it visible on mobile in the Dawn theme.
Initial attempt: adding CSS globally (theme.liquid) hid all Multicolumn sections site‑wide, which was not desired.
Final solution: apply CSS only to the targeted section via the Theme Editor.
Clarification provided: where to place the code was shown via a screenshot of the Custom CSS field in the section settings.
Outcome: the requester confirmed it works; issue resolved with no further open questions.
Hello,
How can I hide a section in Desktop but keep enabled on mobile?
DAWN theme.
The Section is Multicolumn, on the Home page.
I believe this is the ID: shopify-section-template–17621732491523__multicolumn_RG4RWg
Here is the link to the demo site and the section is located at the bottom above the footer titled ALL ABOUT US (8 images on top of each other):
You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code above the tag
Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!
Thanks but this hides all Multi columns!
I only want 1 multi column hidden, which is (I think)
shopify-section-template–17621732491523__multicolumn_RG4RWg
Can you help with this?
Okay. got it.
Step 1: Go to the online store ->Theme ->Customize.
Step 2: Find the multi column you want hidden and add the code to custom css box
@media screen and (min-width: 750px) {
.multicolumn {
display: none;
}
}
Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!
Sorry which file should this code be added to?
Section-multicolumn.css ?
And where would the code be placed?
Works, thanks very much!
