Debut Theme Mobile Customization

BreCreative
Excursionist
40 0 13

Hey! I have my clients site just like I want it but need to make a couple of adjustments for mobile so I was hoping y'all could help.

 

On the home page, the 'about us' section I've inserted a custom background image but I want it to reveal more of the pink in the mobile view and move to the left. Any code for that?

 

https://noellejamesboutique.com/

 

And in the 'About' Page on mobile, is there a way to center all 3 doggy photos so they are stacked on top of each other?

 

https://noellejamesboutique.com/pages/about-us

 

Thanks!

Reply 1 (1)

KG123
Shopify Partner
22 5 1

The best way I know of to do things differently on mobile, is with media-queries. Google is your friend here, but there are also plenty of examples of these being used by the standard Shopify Themes, in theme.css. 

 

This is a pretty good start:

https://www.w3schools.com/Css/css3_mediaqueries_ex.asp

 

However, you can also just use more responsive layout techniques without needing these. Using things like max-width, and % widths, you can get images to scale so that they display horizontally on a wide screen, and vertically on a mobile. Google for responsive web design and i'm sure there will be tons of examples.

 

Kevin.