Update – May 3, 2017 – if you are using Laravel 5.3 you can check out the Html class in Laravel Collective’s class here. The Html class is no longer part of a vanilla Laravel install—for good reason in my opinion—and Laravel Collective is now the maintainer. All the same functionality, just install their package.
Original – October 13, 2013 Here is a simple how-to with Laravel if you are wondering how to link to CSS correctly from a View. I was having trouble finding it in the documentation or in an article online, so hopefully people can find this article and rejoice!
In your Blade template you can just include:
[gist id=6968323]
By using the HTML class using the style method you can take care of the linking to the public folder. I typically store my Sass files (.scss) in a stylesheets folder that compile into a main.css file in a css folder. Since the HTML class using the style method links to the public folder, I just need to include that extra directory level in my URI.
Here it is in a sample Blade layout:
[gist id=6967825]
If you are looking for more info on the style method or the HTML class in general check out the /vendor/laravel/framework/src/Illuminate/Html/HtmlBuilder.php html/src/HtmlBuilder.php in your project the Laravel Collective Html package. There is more happening than just linking to the public directory when using the style method – you can even do things like specify the screen type.
Feel free to comment if you have any thing to add to this quick, easy example!
Comments
18 responses to “Link to CSS File in Laravel 4 using the HTML Class”
Thanks, this post helps me a lot with little problems in .blade files 😀
No problem! It’s funny how simple things like this get lost in the documentation sometimes.
what about {{ asset(‘css/main.css’) }} ? Is it make a different output? i’m new to laravel (my first MVC framework i try to learn) and found this asset management is confusing… Thanks!
@ahmad_anshori:disqus I think “{{ asset(‘path/goes/here’) }}” might just create an anchor tag, instead of the needed tag for including CSS in the head of the document. @odainebarnes:disqus’s solution would work great too – I like the simplicity of “HTML::style” though.
i get it now. thanks!
Mine is driving me crazy because I have tried all things possible to no avail. I have used HTML::style and it does not work.
Hm…it should work – it’s still in Laravel as of 4.1 (which is the current version as of now). Can you post some code?
I used this approach to link to my assets
Im not sure if its the structure of Laravel 4.2 but i had to use: {{HTML::style(‘assets/css/style.css’)}}
Where have people been putting the css and js folders in L5?
Hey @RoderickSilva:disqus – I’m pretty sure they still need to be in the public folder. If you are using a build process like Gulp or Grunt, you could use an “assets” folder in your “app” folder and then just compile, uglify, etc. down to get your minified version in your “public/js” directory.
remember to put the assets in the public folder, after that, it works for me.
About the js? Is it the same processus ?
Hey Reivax – yup, check out this method on line 58 of the class HtmlBuilder right above the “style” method: https://github.com/illuminate/html/blob/master/HtmlBuilder.php#L58
You should also be able to still use the Facade syntax: “HTML::script(‘uri/goes/here.js’)”
I used this code. But it shows error.
”
Class ‘HTML’ not found”
Could you please help me on that?
Hey @tilottamadeb:disqus – if you are using Laravel 5 the HTML class has been moved to an external package outside of the Laravel core. This package is maintained by the Laravel Collective.
Also, I think they changed the class from “HTML” to “Html”
You can find out more information here:
https://laravelcollective.com/docs/5.2/html
Does that answer your question?
I wanna access my files under the public/assets/css it is not accessible for me the styles are not coming
@adiakalaraj:disqus I have updated this post. If you are using Laravel 5.3 you can check out the Html class as maintained by Laravel Collective (see links above). The Html class is no longer part of a vanilla Laravel install—for good reason in my opinion—and Laravel Collective is now the maintainer. All the same functionality, just install their package.