I am trying to change how a website looks on mobile only, without changing how the desktop view looks. More specifically, I am trying to change this for the Showcase theme. Is there any way to do this? Also, I am trying to change the menu links from being a burger menu on mobile to being regular. Is there any way to do this? Thank you!
of course, there is. Alternatively, you need to set a parameter for the maximum screen resolution.
@media only screen and (max-width: 425px)
Okay, which file would I put that code in?
theme.css
There is no theme.css file, do you mean theme.liquid or style.css.liquid or theme.js?
theme.css.liquid ?
Hi @ctraff908 ,
Thanks for bringing your questions to the Community!
Themes added through the Shopify theme store are optimized for both mobile and desktop viewing. Can you elaborate on what changes you want to make to the mobile version only?
If you want to make mobile-specific changes to your website, it is essentially creating a new set of theme code, which is actually not possible within our support scope. There’s a discussion providing some more information about separate themes over mobile vs desktop.
When you asked about:
I am trying to change the menu links from being a burger menu on mobile to being regular.
Do you mean you want the menu to be inline horizontal links? If that’s the case, you can follow the tutorial supported by Clear Canvas, the theme designers of Showcase.
When it comes to a third-party theme customization, your best bet is to contact the theme designers for consultation. If it’s something specific you want to change, you would need to hire a third-party professional to tackle that task. I would suggest checking out some Shopify Experts for this customization and communicate through your expectations.
Hope the information helps clarify things.