If you’ve been using Magento as e-commerce platform, then you may have noticed that it comes bundled with an iPhone directory in the app and skin folder.  Until recently I didn’t pay this theme much attention.  However, after experimenting with Magento for a while today I’ve figured out how to automatically display this iPhone theme for anyone with an iPhone, iPod or even an Android browser, and still use your default store theme for everyone else…

  1. Login to your Magento Admin
  2. Go to System -> Configuration from the top menu
  3. Click the Design tab on the left
  4. Click the Themes tab to expand the Themes options
  5. Under Templates click the Add Exception button.  Two new boxes will appear underneath it
  6. In the Matched Expression field enter:
  7. In the Value field enter:
  8. Repeat steps 5-7 for Skin (Images/CSS) and Layout
  9. Click the Save Config button in the top left

That’s it! Your store should now automatically display your mobile theme whenever it detects the iPhone, iPod or Android user-agent.

Don’t forget to update the logos in the iPhone theme to match your stores.

TIP: In step 6 you can enter additional mobile user agents such as Opera, Blackberry etc.