Designing in Shopify

Shopify LogoRecently I have been working on building an e-commerce site for a client using the tool called Shopify. Overall it has been a great experience. it is amazing how much control you get over the look and feel with be able to still create a fully functional e-commerce site.

I was able to export the code and start editing it right on my local machine. No need for an internet connection or constantly update on a web server and reloading the page like many other CMS systems. I used a tool called Vision to work on my files locally. Just create a new theme in Vision and start editing away. One thing to remember is you can not add any directories to the assets folder, they do not get upload if you do. I tried to make a nice folder structure and separate out my css and image files, but that ended up causing problems when I tried to upload to Shopify.

The Shopify’s template language is liquid. For the most part it is pretty simple to work with the output. Here is an example: {{ product.description | strip_html | truncate: 50 | escape }} . Nothing to complex, you can output the product description, take out the html and truncate it down to 50 characters in a fairly simple line of code.

At this point my only issue is that I want to add some extra functional pages that pull data from Twitter or Flickr and have not been able to figure out a way to do that server side. Sure I could write some Javascript to pull the data, but it would be nice if they allowed you access publish some extra files to the server. They do allow the ability for static pages, which is nice for your about page, terms, returns policies, etc…

Overall I am a pretty happy user of Shopify and hope I get the opportunity to work on another project soon using the tool. The project should be in my portfolio soon!

Share

Reply

Comment moderation is enabled. Your comment may take some time to appear.