Experimenting with Shopify themes for ecommerce on iPhones

Written by: Jonathan Briggs

March 31, 2009 [4159 views]

I have been using Shopify for the past year to run an experimental French food store Market Quarter selling foie gras and duck confit among other things.

The store allows me to teach and experiment with all aspects of ecommerce from building and running a store to marketing and search engine optimisation. Shopify is the perfect vehicle for this with its clean separation between data and design and the ability to extend and manipulate both.

Today I decided that I needed to start exploring the opportunities for mobile versions of our ecommerce sites and once again Shopify seemed the simplest place to experiment.

I started a new store iShopify: an iPhone Theme for Shopify simply to test out the ideas.

Some lessons learned:

1. It was easy to take an existing Shopify theme (I used Minify) and remove the positional information by removing the width and float tags from the CSS
2. Once the theme had been reduced to a series of blocks then I could style up the blocks for the iPhone
3. I used the viewport metatag (for mobile Safari) to set the width to the iPhone screen
4. I then moved a number of the blocks to make the theme easier to use
5. I still need to integrate the payment system (but this is just a proof of concept)
6. I also need to consider the broader issues around navigation. The theme I have chosen does not categorise the items and while very suitable for a small shop would be too simple for Market Quarter.
7. I need to make sure that the site continues to offer a good experience for people using a PC

Comments and questions gratefully received.

What do you think?

Add your comments