How to Use CodeKit with WordPress and Foundation

admin

Administrator
Staff member
I’m a new user to CodeKit and sass and I’ve been playing around with it for the past few days trying to figure out how to use it correctly to improve my workflow.

I’m building a WP project so I start by creating a new CodeKit project with Zurb and compass. It outputs the files and I throw them into a folder called 'Foundation'. I then throw in my WordPress files, and throw that ‘Foundation’ folder into the theme I’m working on in WP in my ‘assets’ folder. I know in the YouTube video CodeKit mentions not to pull the files out so that any linking isn’t messed up, but I can’t keep those files in the root of my project because they need to be within the theme.

So it looks like this:

Code:
wordpress/theme/assets/foundation

Assets is also where my sass files live for the overall site

Code:
wordpress/theme/assets/sass

Where I get hung up is in the compiling of the files.

I have one master style.sass file where I import all my partials and that works correctly. I want to include the foundation
Code:
app.scss
file so everything is in one place, but it doesn’t call it up. It says the compiling is complete, but when I look at the code it’s just the import line without the foundation code actually being outputted. I also found that if I place my sass partials in a folder called partials, CodeKit can't compile them, even though I'm importing them with the folder name, example:
Code:
partials/layout
, instead of
Code:
layout
.

I’m doing this locally so I can’t show you the link, but I guess I just feel like I’m setting this up entirely wrong.

<strong>My question are:</strong>

How do others setup their projects on CodeKit with WordPress and Foundation?

Is it correct to import .scss files into a .sass file?

Any help would be appreciated.