Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Including a css file in a blade template?

I want to include a css file in my Laravel blade template.

I've tried:

@include(public_path('css/styles.css')) 

But it says view does not exist. It does exist.

How can I include a css file?

Please note, I know this is not the correct way to link css files, but for my use case it is (I'm not building a website).

like image 294
panthro Avatar asked Jul 24 '17 11:07

panthro


People also ask

Where do I put css files in Laravel?

this folder css or whatever you named it, must be placed inside your public folder. Show activity on this post. Search for Public folder in Laravel. Create css folder (that contains stylesheet files of your project), javascript and Images folder (contains images that you will use in your project).

How do I include a css file in an HTML file?

CSS can be added to HTML documents in 3 ways: Inline - by using the style attribute inside HTML elements. Internal - by using a <style> element in the <head> section. External - by using a <link> element to link to an external CSS file.


1 Answers

@include directive allows you to include a Blade view from within another view, like this :

@include('another.view') 

Include CSS or JS from master layout

asset()

The asset function generates a URL for an asset using the current scheme of the request (HTTP or HTTPS):

<link href="{{ asset('css/styles.css') }}" rel="stylesheet"> <script type="text/javascript" src="{{ asset('js/scripts.js') }}"></script> 

mix()

If you are using versioned Mix file, you can also use mix() function. It will returns the path to a versioned Mix file:

<link href="{{ mix('css/styles.css') }}" rel="stylesheet"> <script type="text/javascript" src="{{ mix('js/scripts.js') }}"></script> 

Incude CSS or JS from sub-view, use @push().

layout.blade.php

<html>     <head>         <!-- push target to head -->         @stack('styles')         @stack('scripts')     </head>     <body>          <!-- or push target to footer -->         @stack('scripts')     </body> </html 

view.blade.php

@push('styles')     <link href="{{ asset('css/styles.css') }}" rel="stylesheet"> @endpush  @push('scripts')     <script type="text/javascript" src="{{ asset('js/scripts.js') }}"></script> @endpush 
like image 189
Wahyu Kristianto Avatar answered Sep 23 '22 17:09

Wahyu Kristianto