1

Is there any way to allow users to choose which layout to be applied (Omit the given media queries) for the Omega theme?

For example, ESPN has a switcher for choosing the layout: When browsing in iPad, it has a link to switch to desktop.

screenshot

Do you have any idea on how achieving such functionality with the Omega theme?

1

Responsive designs usually rely on media queries to apply the styles, but you could make a copy of those styles and prefix its selectors with body.desktop. Then, when you want iPad users to see different styles, just add the class to the body element (using jQuery). CSS preprocessors like SASS will help you mantain those styles without duplicating the code — Zen 7.x-5.x has awesome out-of-the-box support to SASS/Compass and responsive designs. See the Sassy module as well.

There is also the adaptive design approach: it relies on browser sniffing to return device-specific markup and styles. The mobile tools module will surely help should you choose this approach.

| improve this answer | |
  • Thanks for the answer. But i think it does not address problem to my question. We are using Omega theme which already comes with media quieries and different stylesheets for each layout. The question is more on how to allow user MANUALLY switch stylesheet. – gilzero Jun 28 '12 at 11:41
  • That's what I'm suggesting: put a widget that adds a class to the layout, use that class to trigger a layout change in CSS. You can't trigger media queries directly (afaik). – Capi Etheriel Jun 28 '12 at 16:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.