I am not sure if this is possible or not , but i would like to be able to assign different fields and have a different layout based on the "@media only screen and (max-width:)"

So I could have a more vertical layout for 420px max width and a horizontal layout for +960px max width. As well as adding and removing fields based on the screen size. If this is not currently possible then this is a feature request.

Awesome module and using it a lot more lately over other layout based modules ( i think you know the one ;)

Comments

swentel’s picture

swentel commented
Version: 7.x-1.4 » 7.x-2.x-dev
Assigned: Unassigned » jyve

I'll be honest, I don't know much about those things, so assigning to jyve :)

jyve’s picture

jyve commented

Hi,

we've considered adding support for responsive layouts, but since since responsive DS layouts would be part of a complete responsive theme (and thus custom work anyway), we decided to keep it as a custom task for those who implement DS.

Basically, you can choose the two column layout for example, and then add a media query in your CSS file in your theme to indicate that the two columns should no longer float when the screen width goes under 420px.

As far as having different fields based on a media query and might consider teaming up with the Mobile Tools module to see how we can integrate there.

I will leave this one open for discussion with swentel next week.

swentel’s picture

swentel commented
Status: Active » Closed (won't fix)

Ok I get it. @media is done in css right, so having different fields and layout depending on that is not possible. As jyve says, you can let things float. And maybe do some evil display nones en blocks. Correct me if I'm wrong jyve, but as far as I can see, this is not in the scope of DS at all.

Anonymous’s picture

Anonymous (not verified) commented

ok cool .. thanks

batigolix’s picture

batigolix
Primary language Dutch
Location Utrecht
commented

For people (like me) that find this issue through google:

What are the current possibilities in D7 to use a different view mode for a mobile version of the website?

With a mobile version I mean using modules like mobile tools or themekey to serve content using another theme when a mobile device is detected. Ideally the content would be presented using a different view mode (so it can be light & managed through DS).

Apparently the module mobile tools makes it possible to create a separate view mode but at the moment of writing there is no Drupal 7 version available of this module. There are a dev version and a unstable version for D7 available but this particular option seems not to work in those versions.

A solution proposed in this issue is to use the Display suite Extras module and use the "View mode per node" option. This works in combination with the Mobile tools view mode option, but not automagically: you must append ?v=mobile to the URL.

A second solution would be to override the display suite template files (e.g. ds-1col.tpl.php) in the theme that is served to the mobile device. But that means returning to managing the layouts of many content types in template files inside the theme folder (which Display Suite liberated us from).

Any better suggestions?

Anonymous’s picture

Anonymous (not verified) commented

I have used mobile tools and themekey ... and never again. @media queries is the way forward in my opinion . no messing with the .htaccess file or any other server tweeks which may or my not work depending on the cycle of the moon at the time of implementation. The major difference between using server based mobile detection with dot modi urls is that non smart phones from a few years back will not be able to see the @media queries based site. So you will be losing the huge nigerian market for what ever you are selling ( if you consider that a viable market )

With @media queries everything is controlled in your .css ( of your .less .sass) files and its done no extra modules or heavy lifting .. just simple css that works and it works well. This way you are also designing for ipad and smaller screens at the same time . It just seems to make sense.

batigolix’s picture

batigolix
Primary language Dutch
Location Utrecht
commented

But using @media queries you cannot switch theme or show content using a different view mode (fka "build mode"). I was looking for a way to do that and noticed that there are currently no (stable) solutions for Drupal 7