Mediawiki access/Mobile/Skin

From Bjoern Hassler's website
Jump to: navigation, search

1 Mediawiki for mobile[edit]

1.1 Version 1: Browser detection and mobile skin[edit]

To provide on-the-fly content reformatting for mobile browsers, we need two elements:

  • Browser detection
  • A skin suitable for mobile.

There already is a mediawiki extension that can provide a browser specific skin, i.e. the skin is selected on the basis of the browser type Extension:MobileSkin. I then created a very simple skin by stripping css and js from the standard skin, see this page as an example: Mediawiki access/Monobmo/nocss.

This means, that if you browse this page on a mobile browser, you'd get a different layout.

Demo of version 1: We can demo this using the Opera Mini demo: Show this page in opera mini demo. (Cf. also Opera Mini, Opera mini on desktop).

1.2 Version 2: css media = 'handheld'[edit]

Mediawiki 1.14.0 introduces $wgHandheldStyle: http://www.mediawiki.org/wiki/Manual:$wgHandheldStyle, c.f. Mediawiki access/Skins. This can be set to a string (the skin) or to false. It provides a style for media="handheld". Will also be switched in when 'handheld=yes' is added to the URL, like the 'printable=yes' mode for print media. This is quite useful, as it allows the user to momentarily change the skin, by adding 'handheld=yes'. However, the setting isn't remembered, so only the current page is show in handheld style.

We still need a suitable skin though, that should be lighter weight.

Demo of version 2: View this page with handheld=yes

2 Shortcomings[edit]

Ideally, we would want to give the user a choice over the skin, even if they are not logged in. So we would like to let the user override the browser detection, and choose a skin. For more info, see Mediawiki/Skins and Mediawiki access.

The above demo has now been amended so that 'toggle mobile skin' will also work on mobile devices. For this we've integrated browser detection into the skin itself, and 'toggle mobile skin' will override the automatic selection.

3 Links[edit]

Also see Mediawiki/Skins for some thoughts about skins, and see also Mediawiki access/Monobmo.