Minimous < Skins > Monobook (talk | users | test page | RWD? | set as default | unset | validate: HTML, CSS)
This is a very bare-bones basic template that is mobile-device compatible. There's no frills here, so you may want to use this in conjunction with DetectMobileFree (or DetectMobile) as a mobile-only skin. It's a basic 1140-grid adapted to PmWiki, and you can add a banner graphic, sidebar columns, etc. and use it as the base skin of your website and it will gracefully change size down to mobile devices.
PmWiki skin compatible with mobile devices such as iPhone, iPod Touch, cell phones, Android devices, etc..
Download the package, place the entire contents including the "mobile" folder into your pub/skin/ directory.
To enable the skin site-wide, change the $Skin = 'pmwiki'; line to:
$Skin = 'mobile';
Thanks to http://cssgrid.net/ for the original template ("1140 CSS Grid: 12 columns fluid to mobile"). The original template is Creative Commons By-attribution, created by Twitter's @andytir.
Crisses aka XES adapted the original template to PmWiki, and really seriously dumbed it down. It's much more adaptable than it appears, with very slick HTML code that's easy to play with on the back-end.
See discussion at Mobile-Talk
How can I make this template only show for mobile devices?
After installing the template into your /pub directory, install the DetectMobileFree recipe. Then add these lines to your config.php file instead of the "$Skin = 'pmwiki';" line.
include_once("$FarmD/cookbook/detectmobilebrowsers.php");
if(detect_mobile_device()) {
$Skin = 'mobile';
} else {
$Skin = 'pmwiki';
}
How can I make this into the main template look better on iPad, computer and laptop displays?
You can use the instructions at http://cssgrid.net (edit see https://web.archive.org/web/20111228012843/http://cssgrid.net:80/) and some basic knowledge of HTML to customize the design of your website. This template can have up to 12 columns, so it's based on a 12 block grid. I made the skin very basic because it's meant for mobile devices, but you have a lot of room to make this design pretty for standard web browsers. There's many examples at that website. In case the website goes away, the main webpage is included in the package (view "documentation.html" in a browser -- all images have been removed so you're better off viewing on the original site).
How can I exclude the iPad from the mobile browser?
DetectMobileFree already excludes tablet devices.
If you're using DetectMobile, try this instead:
if(detect_mobile_device() && (!strstr($_SERVER['HTTP_USER_AGENT'],'iPad'))) {
$Skin = 'mobile';
} else {
$Skin = 'pmwiki';
}
User notes +2: If you use, used or reviewed "Mobile", you can add your name. These statistics appear in the Skins listings and will help newcomers browsing through the wiki.