Shopify themes, liquid, logos, and UX
Good Evening,
I am using Shella theme and I have an information header block on my site. It seems that the layout for this is perfect on desktop view as per the screenshot below:
However, when I change to mobile view, the layout / text in this header block messes up and does not look good. Please see screenshot below:
Please could anybody advise on how I can amend this on mobile view and ensure it looks as good as desktop view?
URL: https://endless-retro-22.myshopify.com/
Thank you in advance,
sorry are you facing issue but how can i check your store is password protect
Hi @Endlessretro,
Please follow these steps:
- Step 1: Go to Online store > Themes > Actions > Edit code.
- Step 2: Go to Assets > theme.min.css and paste this at the bottom of the file:
@media only screen and (max-width: 749px){
.home-builder .slick-list{
height: 450px !important;
}
.home-builder .slick-track,
.home-builder .promobox,
.home-builder .promobox a,
.home-builder .image-animation,
.home-builder .rimage {
height: 100% !important;
}
}
Hope it helps!
@LitExtension Hello
Thank you for the code however unfortunately I followed your steps and it didn't change the block in the header.
Please could you advise?
Thank you
Hi @Endlessretro,
Is this not what you want? https://i.imgur.com/RY59onb.png
Do you want to reduce your height? https://i.imgur.com/u0OcICb.png
If so, you just need to change 450px => 325px
Hope it helps!
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024