Integrate Laravel and Foundation CSS Framework

Well, maybe this post is too “you don’t say”, but it was a problem for me as a newbie in Laravel Framework. I started using Laravel a week ago and didn’t know how to integrate Foundation into my project. I didn’t even know where to put my css code. πŸ˜€

So, for some newbie like me, here it is. Laravel put any public file such as css, javascript, assets, images, etc in public folder in the project. Extract all Foundation files in public folder of Laravel. After that your directory will be like this:

Foundation Files

You can use this code as an initial template for your web:

That code will be used in layout file, so you don’t have to load all foundation files repeatedly. The point is you should load the Foundation’s files with the right path. In the code above, Foundation’s files are loaded with this command:

That’s all. Now you can use Foundation CSS in your code. I use Laravel 4 and Foundation 5 btw. πŸ™‚

Good luck! πŸ˜€

Nanda Firdaus

Ex-engineer who is switching to product management role in Traveloka. Passionate about new technology and have interest in product development, business, and investment. Ex-Microsoft Student Partner. Master of Information System Management at Carnegie Mellon University. Bachelor of Information System, Faculty of Computer Science, Universitas Indonesia.

You may also like...

9 Responses

  1. Nurul Fitria says:

    can you show me your directory list ? i still some confused to put directory files from foundation . Thx

  2. Dave says:

    This is great!

  3. LichtAnd says:

    Hi, anybody done this for Laravel 5 yet?
    Would love to see someones file structure.

  4. Conor O'Reilly says:

    Thanks so much, this really helped me get started.

  5. Tharcius Vinicius says:

    Thank’s. Help so much.

  6. Jean says:

    No creo que sea lo mas adecuado para un proyecto real, si quieren desarrollar aplicaciones realmente optimas deben usar la versiΓ³n sass de foundation

  7. Jean says:

    I do not think that is the most suitable for a real project, if you really want to develop optimum applications must use the sass version of foundation

Leave a Reply

Your email address will not be published. Required fields are marked *