Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hello!
I'm having trouble with my Debut Theme's main image. It shows great on a computer however for mobile view it's too large. How do I change it for mobile only?
I've been researching for two days and have seen in the shopify discussion people asking the same question the only problem is the Debut theme does not have the assets/theme.scss.liquid file and I cannot add the code
@media only screen and (max-width: 749px){ a.site-header__logo-image img { max-width: 50px !important; } .main-content{ padding-top: 13px !important; } }
I even tried adding the above code to layout/theme.liquid or assets/theme.js and it doesn't work.
Any other suggestions? I'd greatly appreciate it! My website is: www.rmlifegoods.com
@RMLifeGoods
I believe this tutorial solves your exact problem. Let me know if you need any further assistance.
Kind regards,
Diego
Hello!
Thank you for the reply. I don't think that is what I am looking for it seems to be directed towards the logo. On the Debut theme you have a main image on the website (rmlifegoods.com) <-- if you take a look at our site on your mobile device you will see it's cut off which is typical of the Debut theme... I just want that image to be resized to fit mobile view. I do not want it to change for computer, just mobile. Any suggestions on that?
*I included a screenshot of our website on my mobile device. The image is cut off on the left and right sides.
I'm all set I figured it out it was soooooo simple just a click of a button - thank you though!!!
may i know how you fixed it?
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025