Styling Mobile

To edit your theme's Mobile User CSS, go to Online Store > Design Edit your Theme then click the tab marked "CSS". Find the are labeled "Mobile User CSS" here you will be adding all your custom CSS code that will be rendered only for visitors of your website that are viewing on Mobile devices.

How To Change Colors

It is recommended to use CSS tags in your Mobile User CSS for ease of updating but you may also "hardcode" your CSS if you have a specific reason for doing so. For tweaking spacing and other elements be sure to carefully check for the "Class" that you need.

You can paste in your code or type it directly in the "Mobile User CSS" Box then click "Apply" to save your work.

Quick Tip:

Style Tags you set up on "Colors" Tab ( Style Changes ) of the Theme also apply to your Mobile Theme! This is the quickest way to ensure your website looks good and consistent.

How To Test

You can use Google Chrome's Inspect Element with the Mobile Emulation feature for your initial testing but it is recommended to test on real physical devices for the most accurate look at your website.