One of my Code Ignitor based projects desperately needed a iPhone view. I didn’t have many requirements but I knew I needed to find a way to do the following
- NOT restructure the architecture of my existing controllers or models
- Display the same content in a slightly different format
- Use the same URLs and not have to redirect to a completely different “mobile site” cause I hate it when I get stuck in bad redirect loops from my iPhone, or loose the page I’d found on a search engine because the mobile redirect drops me on the home page!
Since I’d already (fully) built out the desktop view and since the content of the pages will be the same between versions (with different presentation styles) I didn’t want to re-engineer all my controllers to be aware of the device, only the view or display needs to be aware.
I built a quick extension of the CI_Loader class using the MY_ prefix but when I dropped the class into /application/library but it just didn’t work.
Well after about an hour of Googling I came across why the class wasn’t loading: code classes like Loader or rather the My_Loader extension (or replacement) of CI_Loader need to be in the /application/core directory. (duh!)
MY_Loader extension of CI_Loader class into /application/core in CI 2.2
Here’s the beginning of that class, it loads the views out of the decided directory mobile or desktop based on the user agent.
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class MY_Loader extends CI_Loader {
public function __construct()
{
parent::__construct();
log_message('debug', "MY_Loader Class Initialized");
}
function view($view, $vars = array(), $return = FALSE)
{
if(isiPhone())
$view = 'mobile/'.$view;
else
$view = 'desktop/'.$view;
return $this->_ci_load(array('_ci_view' => $view, '_ci_vars' => $this->_ci_object_to_array($vars), '_ci_return' => $return));
}
function common_view($view, $vars = array(), $return = FALSE)
{
$view = 'common/'.$view;
return $this->_ci_load(array('_ci_view' => $view, '_ci_vars' => $this->_ci_object_to_array($vars), '_ci_return' => $return));
}
}
And I have a function in my common_helper.php file that gets auto loaded because it’s functions are used across the site
function isiPhone()
{
if(strstr($_SERVER['HTTP_USER_AGENT'],'iPhone') || strstr($_SERVER['HTTP_USER_AGENT'],'iPod'))
return true;
return false;
}
Now when I use $this->load->view('home'); based on the user agent the application will render the /application/views/mobile/home or /application/views/desktop/home or if I have a common view that persists between the different views I’ll use $this->load->common_view('home'); and the application will render the /application/views/common/home
This way I don’t have to troll through my entire application and change all the calls to $this->load->view only the ones that are common to both displays.
Why do it this way?
Now all the URL’s indexed by the search engines will produce appropriate experiences for both iPhone and web users and it’ll be easy for me to build out other versions of the site based on user agent! Though I will need to figure out how to tell the engines that the page is built to be iPhone friendly. Also, I can easily add a session or cookie to the view() method to bypass iPhone if a user has opted to see the desktop version from their phone.
If I was going to display completely different sets of data I’d want to detect the device on the controller level then probably call specific views that way but that’s not my task at hand today!
This site runs on the Thesis WordPress Theme
If you're someone who doesn't understand a lot of PHP, HTML, or CSS, Thesis will give you a ton of functionality without having to alter any code. For the advanced, Thesis has incredible customization possibilities via extensive hooks and filters. And with so many design options, you can use the template over and over and never have it look like the same site.
If you're more familiar with how websites work, you can use the fantastic Thesis User's Guide and world-class support forums to make more professional customizations than you ever thought possible. The theme is not only highly customizable, but it allows me to build sites with a much more targeted focus on monetization than ever before. You can find out more about Thesis below:
