Solved

How do i make my mobile banner a different size than my desktop banner?

AURA20223
Excursionist
40 0 6

I have two different banners, one for desktop and one for mobile.

 

My mobile banner is 1080x1080, i wish to keep this resolution, however on shopify it doesnt seem to keep that resolution and shrinks it.  My desktop banner size is fine though, it seems the only option i have is to 'Adapt to first image' or my desktop banner is half off the screen.

 

AURA20223_0-1710264190102.png

 

 https://aurathefragrance.co.uk/ is my website. Thank you.

Accepted Solution (1)

PageFly-Richard
Shopify Partner
4206 950 1599

This is an accepted solution.

Hi @AURA20223 

 

This is Richard from PageFly - Shopify Page Builder App

 

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
@media (max-width:767px){
.slideshow__media.banner__media.media,.mobile-image {
    height: 500px !important;
}
}
</style>

PageFlyRichard_0-1710315339019.png

 

Hope this can help you solve the issue 

 

Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Replies 3 (3)

AURA20223
Excursionist
40 0 6

My password is jyotsna

PageFly-Richard
Shopify Partner
4206 950 1599

This is an accepted solution.

Hi @AURA20223 

 

This is Richard from PageFly - Shopify Page Builder App

 

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
@media (max-width:767px){
.slideshow__media.banner__media.media,.mobile-image {
    height: 500px !important;
}
}
</style>

PageFlyRichard_0-1710315339019.png

 

Hope this can help you solve the issue 

 

Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

AURA20223
Excursionist
40 0 6

Thank you so much!