Menu icon Foundation

My Posts

No Content

My Comments

Michael Marcus commented on Nathaniel Flick's post over 5 years

I use Compass and SCSS to customize Foundation for my Django site, and I have found that Compass's philosophy about Django integration (http://compass-style.org/blog/2011/05/09/compass-django/) applies to Foundation as well. TL;DR: Just use them both and don't bother trying to integrate.

My suggestion would be to use the new "foundation" CLI to manage your Foundation assets on your dev machine only, and just modify your STATICFILES_DIRS so that Django knows where to find them. For example, here's my old setting under Foundation 4:

STATICFILES_DIRS = (
    ('javascripts', '/path/to/foundation/root/javascripts'), # all JS including Foundation
    ('stylesheets', '/path/to/foundation/root/stylesheets'), # my generated CSS
)

And here's the modification for Foundation 5:

STATICFILES_DIRS = (
    ('foundation', '/path/to/foundation/root/bower_components/foundation'), # all Foundation assets
    ('javascripts', '/path/to/foundation/root/javascripts'), # might still have some customizations here
    ('stylesheets', '/path/to/foundation/root/stylesheets'), # my generated CSS
)

Then, in my templates, I can reference the JS almost exactly as described in the docs (http://foundation.zurb.com/docs/javascript.html) but with Django's static tag as a prefix:

<script src="{% static 'foundation/js/vendor/modernizr.js' %}"></script>
...
<script src="{% static 'foundation/js/vendor/jquery.js' %}"></script>
<script src="{% static 'foundation/js/vendor/fastclick.js' %}"></script>
<script src="{% static 'foundation/js/foundation.min.js' %}"></script>

Note that this method gives you the added bonus of segregating the Foundation JS from your other JS.

Posts Followed


Following

    No Content

Followers

My Posts

No Content

My Comments

You commented on Nathaniel Flick's post over 5 years

I use Compass and SCSS to customize Foundation for my Django site, and I have found that Compass's philosophy about Django integration (http://compass-style.org/blog/2011/05/09/compass-django/) applies to Foundation as well. TL;DR: Just use them both and don't bother trying to integrate.

My suggestion would be to use the new "foundation" CLI to manage your Foundation assets on your dev machine only, and just modify your STATICFILES_DIRS so that Django knows where to find them. For example, here's my old setting under Foundation 4:

STATICFILES_DIRS = (
    ('javascripts', '/path/to/foundation/root/javascripts'), # all JS including Foundation
    ('stylesheets', '/path/to/foundation/root/stylesheets'), # my generated CSS
)

And here's the modification for Foundation 5:

STATICFILES_DIRS = (
    ('foundation', '/path/to/foundation/root/bower_components/foundation'), # all Foundation assets
    ('javascripts', '/path/to/foundation/root/javascripts'), # might still have some customizations here
    ('stylesheets', '/path/to/foundation/root/stylesheets'), # my generated CSS
)

Then, in my templates, I can reference the JS almost exactly as described in the docs (http://foundation.zurb.com/docs/javascript.html) but with Django's static tag as a prefix:

<script src="{% static 'foundation/js/vendor/modernizr.js' %}"></script>
...
<script src="{% static 'foundation/js/vendor/jquery.js' %}"></script>
<script src="{% static 'foundation/js/vendor/fastclick.js' %}"></script>
<script src="{% static 'foundation/js/foundation.min.js' %}"></script>

Note that this method gives you the added bonus of segregating the Foundation JS from your other JS.

Posts Followed

Following

  • No Content

Followers

  • No Content