Shopify themes, liquid, logos, and UX
Hi,
Is there anyone here who might know how to make the banner text smaller on only the mobile version?
As for right now the text covers upp the whole picture? See example below. If it would be possible to make the button and text smaller to make it look more clean.
URL: https://la03ue1o3c6qefsa-86795059542.shopifypreview.com
Hey @norduxe
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag
<style>
@media screen and (max-width: 767px) {
.banner__heading {
font-size: 23px !important;
}
.banner__text.rte.body p {
font-size: 15px !important;
padding: 0 40px !important;
}
}
</style>
RESULT:
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Best Regards,
Moeed
Hello @norduxe
Go to online store ----> themes ----> actions ----> edit code ---->base.css ---> line number 287
search this code
@media screen and (max-width: 767px) {
.h0 {
font-size: calc(var(--font-heading-scale)* 4rem);
}
}
and replace with this code
@media screen and (max-width: 767px) {
.h0 {
font-size: calc(var(--font-heading-scale)* 3rem);
}
}
result
If this was helpful, hit the like button and accept the solution.
Thanks
Do you know if its possible to make it look more like this?
Do you know if its possible to make it look more like this?
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