Roundcube for Mobile Devices

We are well aware of the fact that Roundcube performs nicely on desktop browsers, it can be operated on tablets but when opening Roundcube from a smartphone, you’re out of luck.

Although creating a fully responsive theme which works on all screen sizes is on our roadmap and some volunteers are currently drafting it, we still looking at several months until the fully integrated solution will be available.

Luckily there are alternatives, thanks to the nature of free software! The most sophisticated amongst them is the Melanie2 Larry Mobile theme by Thomas Payen. It builds on top of the jQuery Mobile framework and completely replaces the default Roundcube skin with a fully optimized view when connecting with a mobile device. To do the automatic switch, the help of an additional Roundcube plugin is required. So here’s a quick guide how to install all the pieces in order to make your Roundcube mobile friendly:

1. Download the theme from GitHub

git clone skins/melanie2_larry_mobile

If you don’t have a git client available, simply download the Zip archive and unpack it into skins/melanie2_larry_mobile.

2. Install “mobile” and “jquery_mobile” plugins

php composer.phar require melanie2/mobile:dev-master

Since jquery_mobile is a dependency of the mobile plugin, this command will install both plugins right away.

ATTENTION: only the mobile plugin should be activated in Roundcube. Thus, when prompted “Do you want to activate the plugin jquery_mobile? [N|y]“, type “n” and later when the same prompt appears again for the mobile plugin, accept with “y“.

That’s already it.

With both the melanie2_larry_mobile skin and the mobile plugin installed, mobile devices will automatically see the mobile theme when accessing Roundcube. Kudos to Thomas, who added the missing piece to the Roundcube universe!