WebAsyst and Shop-Script forums / How do you change the mobile stylesheet?

terpsphan · 2008-09-21 19:48

Hello,

I am still getting used to this new WebAsyst, and have been battling with it throughout the weekend, going back and forth with customization (and backing everything up in case of these overriding updates??), and with the built in design editor (which I really, really do not like!)...

Anyways, how do you alter the mobile styles?

Specifically, I am pleased the shop is now being mobile friendly, but the background I have is a blue color, and you cannot see the links on a mobile device (iPhone)... it would be great if I could change the mobile background color to white...

I tried putting this in my head template:

Code:

<style type="text/css">

@media handheld {
html { 
    margin: 0px;
    padding: 0px;
    background:#fff;
}
}

@media screen {
html { 
    margin: 0px;
    padding: 0px;
    background:#3b6ca4;
}
}
</style>

But still, it will not override the html color of my theme (ocean) with a white color. If I put in white as the html background in the main.css, then my mobile site looks good, but then the real one doesn't. Any help is great appreciated!

thanks,
Brian

Last edited by terpsphan (2008-09-21 20:10)

rat · 2012-03-19 01:51

To debug stylesheets for mobile devices in a desktop browser, open file published/SC/html/scripts/core_functions/functions.php, find function detectPDA, and change line

Code:

return $pda;

to

Code:

return $pda || isset ($_GET['testpda']);

This will display the mobile design version on your desktop computer whenever you add the testpda parameter to the URL of the storefront page being tested; e.g.:

http://domain.com/?testpda
http://domain.com/?productID=123&testpda

#1 2008-09-21 19:48

How do you change the mobile stylesheet?

Code:

#2 2012-03-19 01:51

Re: How do you change the mobile stylesheet?

Code:

Code:

Board footer