Mobile-first (or "mobile only")

I’m working on a site that uses a mobile-first design. This means starting from the smallest mobile experience, and scaling up. Putting aside the merits of this approach vs the opposite (“responsive”), I’m wondering what the best way to accomplish this in Discourse is.

In the Discourse admin, there’s a checkbox to disable mobile themes:

image

I’m wondering if there’s a way to do the opposite: to “disable” the desktop theme. In other words, having the users always experience the mobile version, regardless of whether they are on desktop or mobile.

What would be the best way to accomplish this sort of approach, if I wanted to use the current Discourse mobile experience as my basis for a new theme? Would I just take the mobile templates, and use them as the “desktop” templates of a new theme?

Alternatively, is there an admin option to always serve the mobile version? Or could this be accomplished via plugin?

There will be much pain and suffering if you go this route. I don’t recommend it.

(It’s also not possible from the codebase at present, to be mobile-only, afaik)

5 Likes

Note, you would always start from desktop HTML markup anyway, cause it is richer. So your “mobile first” approach would actually be “desktop” first.

We have no option to “disable core CSS”, so you would have to build a plugin of sorts for that, also, warning, if you start from 0 CSS expect this to be about a 2-12 month full time project.

4 Likes

Gotcha. This is what I was suspecting. I suppose we’ll be “desktop first”, then.

Thank you both for your insight!

Understood but…

I feel that I should point out that the mobile “theme” in Discourse involves more than meets the eye. The html layout is different, long lists in the UI switch to dropdowns and most importantly the composer is different

I think this will also not be easy as the desktop composer won’t work well on mobile.

2 Likes