February 9, 2014

Mobile Inclined

In what I am sure is mostly boring website news, the first cut of a mobile theme for my blog is now live.

One of the nice things about wordpress is the availability of plug-ins. There’s a plugin for just about anything. Problem was, non of the plugin’s did exactly what I wanted. I decided to go with mobile-smart since it got me the closest to where I wanted to be.

The key functionality I wanted included:
– Have two themes, one desktop one mobile ( ✔ )
– Allow mobile users to switch to the desktop theme ( ✔ )
– Allow mobile users to switch back to the mobile theme ( ermm…)

So what’s a computer scientist to do? Crack open the code of course!

Original code (paraphrased) for creating links to switch between themes

$is_mobile = $this->switcher_isMobile();
if ($is_mobile || $options[‘allow_desktop_switcher’]) // (1)
{
    …
  if ($is_mobile) { // (2)
    … //(code to write button/link to switch from mobile to desktop)
  } else { // (3)
    … //(code to write button/link to switch from desktop to mobile)
  }
}

The function $this->switcher_isMobile(); returns true if the user is currently viewing the mobile template. The parameter $options[‘allow_desktop_switcher’] is a flag indicating whether any user is allowed to switch to the desktop version from the mobile version.

Since I don’t want desktop users switching to the mobile theme, I need to set that flag to false. That means the only way to enter the first if clause, (1), is if $is_mobile is true. But then there is no way to enter the else clause, (3). A link to switch back to the mobile version is never created. A mobile visitor can return to the mobile version, but only after shutting down their browser and starting a completely new session.

My Change

$is_mobile = $this->DetectIsMobile();
$is_mobile_shown = $this->switcher_isMobile();
if ($is_mobile || $options[‘allow_desktop_switcher’]) // (1)
{
  …
  if ($is_mobile_shown) { // (2)
    … //(code to write button/link to switch from mobile to desktop)
  } else { // (3)
    … //(code to write button/link to switch from desktop to mobile)
  }
}

Green indicates changed lines

In the above code, $this->DetectIsMobile(); returns true if the visitor is using a mobile device, regardless of which version the user is currently viewing. Now, the if clause at (2) is entered if the visitor is viewing the mobile version, and the else clause, (3), if viewing the desktop one.

It’s a very small change, almost not worth a blog post. I know at some point I’ll update my plugins and probably lose my edit. At least now I can easily find & redo what I did!

Related posts:

Posted in Internet & Technology | Tags:


Leave a Reply

Your email address will not be published.