3

My client has an existing commercial website developed using OpenCMS and they want to create a mobile version of the same.

I have seen websites starting with "m." instead of "www." I am guessing these are the mobile versions of the websites which access the same database but are independent of the actual website. And users are redirected to the mobile version when the device detected is mobile.

But then, I also saw that OpenCMS has an option for creating mobile friendly templates using the <cms:device type="mobile">

My knowledge about creating mobile websites is quite limited. So I just wanted to know which of the above two options or any other option I don't know about will be the right direction to proceed.

Thank you!

Ashin Mandal
  • 463
  • 1
  • 6
  • 19

2 Answers2

4

More and more web development aims towards "responsive webdesign". You could start with reading a bit about this http://en.wikipedia.org/wiki/Responsive_Web_Design as a start. Deciding which is best to suit your needs is very difficult without seeing the actual website, but a responsive approach could be a good start. The alternative is making a mobile only site (m.) but since mobile platforms are not as homogen as one would like my opinion is heading for responsive alternatives.

jtheman
  • 7,421
  • 3
  • 28
  • 39
  • 1
    Thank you for your reply! But I am contributing to the website as a programmer and I don't really have a say over the design. The website is a very typical OpenCMS template based website with pages based on a template(s). – Ashin Mandal Sep 14 '12 at 07:38
  • 1
    @Ashin Mandal Well having a mobile version of the website most definitively will need to include a design perspective! Choosing between making a separate mobile page or going responsive will need to include the designer... – jtheman Sep 14 '12 at 08:04
  • 1
    "The website is a very typical OpenCMS template based website with pages based on a template" - this doesn't really matter much. OpenCms templates can be anything, they can even contain responsive html5 code. Templates are nothing else then html with jsp snippets in it. OpenCms is only the workhorse in the background to let backend users edit content, everything else pretty much remains the same as for a non-CMS website. – Mathias Conradt Sep 15 '12 at 08:08
  • 1
    @MathiasLin - I figured the same. I'll just create a mobile friendly template and use it when pages are viewed via a mobile device. – Ashin Mandal Sep 17 '12 at 05:16
  • @jtheman - Unfortunately, the firm or the person who created the desktop website is no longer with us. And we don't have a designer with us right now. Guess I'll just have to figure it out myself with what I can improvise. – Ashin Mandal Sep 17 '12 at 05:18
3

For some of my sites I used the approach of creating a "front"-template which decides which real template to include, based on the user-agent.

With this approach of course you would need to create two distinct and separate templates, one for the full desktop version of the site, and one for the mobile version. Of course you can still share css, images and JavaScript between them.

Starting from scratch nowadays, I would go for jthemans answer, with a responsive design.

But if you have no big budget, and need to come up fast with a solution, the distinct-template-approach will be faster.

Anyway, here is the simple "front"-template which I mentioned:

<%@ page session="false" %>
<%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<c:choose>
<c:when test="${    fn:contains(header['User-Agent'], 'Android') or
                    fn:contains(header['User-Agent'], 'iPhone') or
                    fn:contains(header['User-Agent'], 'iPod')
}">
    <cms:include page="/templateMobile.jsp" />
</c:when>
<c:otherwise>
    <cms:include page="/templateFull.jsp" />
</c:otherwise>
</c:choose>
yglodt
  • 13,807
  • 14
  • 91
  • 127
  • 2
    Thank you! This was very helpful. So just to be sure, templateMobile is the template for mobile and the other one for Desktop. And if I use this template for all my pages and it'll use the respective sub-template? – Ashin Mandal Sep 20 '12 at 06:37