Forum for discussing general topics related to Couch.
31 posts Page 2 of 4
Hi KK,

I was thinking of using jQuery or PHP to detect the device and auto redirect or force a modal offering the "mobile version"


http://www.jquery4u.com/mobile/detect-m ... es-jquery/

http://code.google.com/p/php-mobile-detect/
Implementing a desktop and mobile version of a site is similar conceptually to a multi-lingual site. This would in my opinion best be handled with cookies. You won't run into the complications of managing multiple templates and will only have one URL for each page.
http://www.couchcms.com/forum/viewtopic.php?f=8&t=74
Fine.

Assuming we go with http://code.google.com/p/php-mobile-detect/ (though the jQuery method will also work) to detect if the visitor should be served the mobile version, following (IMHO) should be the cleanest approach for creating two versions of the same site -

Continuing with the example of 'news.php', this is what we do (the approach will remain identical for every single template of the site) -
1. 'news.php' remains the single point of entry for both versions of the site.
2. It defines editable regions the normal way ..
3. .. but does not output anything at all by itself.
4. It uses the' php-mobile-detect' PHP class mentioned above to detect if the visitor requires a mobile version and sets a Couch variable (say 'is_mobile') accordingly.
5. Next, depending on the value of the 'is_mobile' variable, the template embeds either the 'normal' version of the news or the 'mobile 'version.
Code: Select all
<?php require_once 'couch/cms.php'; ?>
<cms:template clonable='1'>
    .. define all editable regions ..
</cms:template>

<cms:php>
    include 'Mobile_Detect.php';
    $detect = new Mobile_Detect();
    if ($detect->isMobile()) {
        // Any mobile device.
        global $CTX;
        $CTX->set( 'is_mobile', '1' );
    }
</cms:php>

<cms:if is_mobile >
    <cms:embed 'mobile/news.htm' />
<cms:else />
    <cms:embed 'normal/news.htm' />
</cms:if>

<?php COUCH::invoke(); ?>

Basically, with this method, the two complete versions of your site now reside completely in the 'normal' and 'mobile' subfolders of the 'snippets' folder.

Hope I was able to explain myself.
Do let me know what you make of it.

EDITED: Code rectified
Hi KK,

I like the approach and am in the process of testing it, however I get Server Error when I try to include my Mobile_Detect.php - should that not be wrapped in <cms:php> ?
Ok, so it's fine running in <?php> tags - I think the error is in the


global $CTX;
$CTX->set( 'is_mobile' '1' );


I'll have a play I hopefully can figure it out
$CTX->set( 'is_mobile', '1' );
Thanks @cheesypoof. Have fixed the typo in code.
Hi cheesypoof,

I spotted that thanks, seems to stop the error but my mobile template always shows so wondering if the "setting" of "1" is persisting.

I tested the mobile detection with an echo - see below, and it's certainly detecting the device as it says "mobile" on the iPhone

Code: Select all
<?php
    include 'Mobile_Detect.php';
    $detect = new Mobile_Detect();
    if ($detect->isMobile()) {
      echo 'mobile';
    }
?>
This is strange.

It must be setting
Code: Select all
'is_mobile', '1'
because it loads the mobile version on phone, but also on desktop.

If I remove the single quotes it doesn't embed the mobile version but does embed the desktop version, therefore the "else" must also be working.

I'm stumped. Sorry I know this is probably 3rd party. Any means to debug this?
I sincerely apologize, Patrick, but I really should have tested out the code before posting.
Have done so now. Please copy and use the (now rectified) code in the previous post.

It is working fine for me both from mobile as well as desktop. Let me know how it goes for you.
31 posts Page 2 of 4
cron