Menu icon Foundation
Manually changing the css

I have made several changes to the foundation css file that I originally downloaded. I am (obviously) new to the complexities of css/foundation - not to mention how they are compiled. Now I'm a little concerned (a lot, actually) that the full file and the minified are out of sync. At this point, I have no way to "recompile" - have just been happily making my changes in Dreamweaver. Do I actually HAVE to have the minified version or can I simply use the full css? And if I do need to somehow recompile to create the minified - can someone point me in a general direction for how I could do that? I'm not expecting lessons - just point me to where I should read.

If this helps, my pages are likely to be read by less than 600 people per day. They are not complicated at all and frankly Foundation is probably overkill for what I am doing. But I wanted to start with a good solid css "foundation" (no pun intended) so that I could grow from here. If I go with just using the full css - should I remove the minified entry from my code altogether?

minify; recompiling; css

I have made several changes to the foundation css file that I originally downloaded. I am (obviously) new to the complexities of css/foundation - not to mention how they are compiled. Now I'm a little concerned (a lot, actually) that the full file and the minified are out of sync. At this point, I have no way to "recompile" - have just been happily making my changes in Dreamweaver. Do I actually HAVE to have the minified version or can I simply use the full css? And if I do need to somehow recompile to create the minified - can someone point me in a general direction for how I could do that? I'm not expecting lessons - just point me to where I should read.

If this helps, my pages are likely to be read by less than 600 people per day. They are not complicated at all and frankly Foundation is probably overkill for what I am doing. But I wanted to start with a good solid css "foundation" (no pun intended) so that I could grow from here. If I go with just using the full css - should I remove the minified entry from my code altogether?

Erik M over 2 years ago

Hey Sherry, I understand what you mean. It sounds like your minified is redundant since you are changing the non-minified version. If this is the case, you absolutely can remove the minified version. In fact, if you ever decide you want it back you can just pass it through a website like http://cssminifier.com/ . If I was you I would remove the minified version.

As for learning more about minification. Just know that smaller files means faster loads (especially for mobile). It really isn't a problem when you are on a small project as you described.

When you feel comfortable with this, I'd recommend learning about gulp. Gulp allows you to work with files in one directory, but place the files for distribution in a different directory. The advantage of this is that you can do things like watch a css file for changes, and when it does change, minify it, and put it in a particular folder. It really helps keep an organized workflow - and I think the foundation team is putting together an 'advanced' site that includes this functionality out of the box.

Here is a video I did last year that will teach you how to use gulp + livereload in 5 minutes.
https://www.screenr.com/bhbN

Hope that helps, let me know if you have any other questions!

Sherry Bradford over 2 years ago

Thank you so much! I will watch the video and follow your suggestions. This is exactly the info I needed! Have a great day!