d
Topic
Posts:
5
Last edited March 01, 2007

Do I have to use Vision for a custom design? This post is outdated

If I already have a site designed and want to integrate with shopify do you use the vision tool to do that? IF not how to you apply a custom design to shopify. Thanks for the help!
i
Replies
danW Shopify Advisor
Posts:
1037
March 01, 2007

Hi Jason. You can do it one of two ways. You can do it under the look and feel of the admin interface, or you can download a theme, modify it with your design, zip it and upload it back into shopify.

Dan - http://www.xtremechargers.com
Posts:
5
March 01, 2007

Hi Dan, thanks for the quick reply. I’m still a little confused. Do I have to use Vision or can I just modify the code using dreamweaver. I might need to read more about Vision and what it does. I just discoverd Shopify today and everything is still new to me. Thanks for your time.

Posts:
258
March 01, 2007

You don’t have to use Vision, Jason; it just makes design development, at least initially, much quicker and easier. I generally use it in conjunction with Dreamweaver.

Vision just runs a little demo store on your own computer locally, holding the theme directory structure that you can edit directly in Dreamweaver until you’re ready to export and install in a store for further development/testing.

This screencast may be helpful.

Cliff Spence www.PromotionSickness.com
Posts:
5
March 01, 2007

Thanks, my next question would be is Liquid a new coding language I need to learn? and if I’m still building sites the old way, tables, will that not work well with the templates.

I’m wondering if this is a huge learning curve or if I’m making it more complicated then it actually is. With The vision tool I’m not actually doing any coding in it correct? I would modify the .liquid files located in the template folder in a text editor or dreamweaver correct?

Thanks for the help!

Jared Burns Shopify Advisor get.sy
Posts:
496
Last edited March 01, 2007

Jason, seems that you’re scrambling around here with some confusion based on your posts for the past couple days. Let me see if I can help simplify Shopify for you.

  • Shopify is built with Ruby on Rails. You’ll probably want to check out how cool of a programming language/web framework it is and why Shopify rocks because of it.
  • Liquid is a template engine that Shopify utilizes to make designing and basic logic very easy. It’s not a full blown programming language, but you can do quite a bit.
  • Shopify’s Wiki has all the liquid tags and filters available there. Definitely the place you need to go to learn how to use liquid with Shopify.
  • Read this tutorial to understand how to use Shopify’s theme system. It’s quite easy.
  • Vision is simply a self contained Ruby on Rails server that runs a demo Shopify store locally. You can’t modify the database, but you can use it to design themes without having to work on your hosted Shopify store. You will be writing liquid, XHTML, CSS, and maybe some javascript and using Vision to get a live version of your theme. You edit the .liquid files, .css, etc.
  • Tables? What are those? =) Probably want to learn about div’s and float. Get a good CSS book.

Hope that helps. Spend some time researching this stuff before building a theme or it won’t make sense. In the end, it’s not hard to do.

Jared

Jared Burns, CEO at Getsy (http://get.sy)
danW Shopify Advisor
Posts:
1037
March 01, 2007

You can modify vision’s database, but make sure you know what you are doing, because you can make a mess of it!

I always keep a fresh backup before doing any mods to the database.

Dan - http://www.xtremechargers.com
Jared Burns Shopify Advisor get.sy
Posts:
496
March 02, 2007

I’ve seen several Windows users mention using Dreamweaver, such as Jason a couple posts above. Dreamweaver has always seemed like a very expensive and bloated text editor to me. Not to mention there’s really no need for the built in FTP when working with Shopify.

I’m a Mac user through and through so I obviously use Textmate, but I recently stumbled upon what seems to be a great clone for Windows, E-TextEditor. I haven’t used it, but if it’s anything like Textmate, it should be great. Plus it’s only $35.

Jared Burns, CEO at Getsy (http://get.sy)
Posts:
339
March 02, 2007

That might be a little harsh on DW Jared.

It’s probably a hang up from my early web building experiences, but I still use DW in split design/code view for most sites I build, the predictive css attribute insertion is particularly handy if you don’t think in syntactically perfect css. Granted, lots of its functionality is irrelevant when building Shopify templates and you also have to get used (still!) to the fact that the WYSIWYG ‘design’ view has some fundemental misunderstandings of float rendering (and common css hacks for that matter). But for all its faults, I still wouldn’t be without it.

Ironically, of course, the first Shopify site I did was entirely without Dreamweaver : )

Mike www.cardiaconline.co.uk | www.anothervision.co.uk
Jared Burns Shopify Advisor get.sy
Posts:
496
March 02, 2007

Yeah, DW is a fine program…if you want to spend $400, install extra memory to run it, and require the visual aide of a WYSIWYG editor. =) Just giving you a hard time Lorem Ipsum.

My post wasn’t to bash DW, just simply noting that there’s a much more affordable alternative available that doesn’t have all the bells and whistles of DW, but gives you everything you need to build a Shopify theme.

Jared Burns, CEO at Getsy (http://get.sy)
Posts:
339
March 02, 2007

No worries. And your right, if someone comes to Shopify and wants to know the best way to get started then DW, frankly, isn’t it. Much better to try to get your head around xhtml & CSS with a few tutorials and a ready-made Shopify theme to muck about with.

They both look like cracking text editors, and for the money you can’t go far wrong. All that lovely colour coding and auto-tag-closing. Reminds me of disovering TopStyle for the first time (not that I use that anymore either!).

Cheers
Mike

Mike www.cardiaconline.co.uk | www.anothervision.co.uk
Posts:
258
March 02, 2007

Textmate is an awesome text editor on the Mac. On the PC, unless you already have DW, there’s no need to spend the money (especially for Shopify work) unless you need more WYSIWYG features, FTP, etc. I generally use DW when I’m working from the PC, but I use it in the same setup as I’d use Textmate on the Mac; file structure on the left and code on the right.

For PC users, there’s an up-and-coming text editor called Intype, which is in Alpha but is pretty good so far, and already greatly resembles Textmate with it’s bundles, etc.

Cliff Spence www.PromotionSickness.com
Posts:
8
March 02, 2007

Hi guys, relatively new to Shopify but taking all these posts into account as I have a current site and I’m about to develop a theme to use with shopify.

And hey Jason, I would seriously recommend getting to learn CSS. I’m semi new to CSS but it’s made designing alot easier in once sense, especially since alot of apps like this utilize CSS. Once you understand it, you will not turn back.

From time to time I want to use tables again, but they’re such a headache at times and the code… UGH! I’ve never manually entered code until using CSS.

And DW isn’t that bad. If you’re a student, you can get it from Academic Superstore for like $100. I hate to admit that I use it exclusively for editing, but I have a handicap called “WYSIWYG”.... :)

Good luck with your theme development.

danW Shopify Advisor
Posts:
1037
March 02, 2007

You can also check out a couple of these sites. They provide basic theme structure that you can them implement in shopify and just edit the css to get your look at feel.

http://csstinderbox.raykonline.com/
http://www.oswd.org/
http://www.openwebdesign.org/

There are more but these are a few that come to mind.

Dan - http://www.xtremechargers.com

Log in or sign up for an account to reply.

This thread has been closed! You will not be able to reply.