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).
@include directive allows you to include a Blade view from within another view, like this :
@include('another.view')
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>
@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
if your css file in public/css use :
<link rel="stylesheet" type="text/css" href="{{ asset('css/style.css') }}" >
if your css file in another folder in public use :
<link rel="stylesheet" type="text/css" href="{{ asset('path/css/style.css') }}" >
As you said, this is a terrible way to do so Laravel doesn't have that functionality, AFAIK.
However blade can run plain php so you can do like this if you really need to:
<?php include public_path('css/styles.css') ?>
in your main layout put this in the head at the bottom of everything
@stack('styles')
and in your view put this
@push('styles')
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
@endpush
basically a placeholder so the links will appear on your main layout, and you can see custom css files on different pages
<link rel="stylesheet" href="{{ URL::asset('css/styles.css') }}">
It will search for the file in your project public folder
just put your CSS file into resources/css then you need to compile it with mix
and your CSS file will be in public/css
use:
<link rel="stylesheet" type="text/css" href="{{ asset('css/app.css') }}" >
to refer to it ... i recommend this video
Most of the answers does not include the building of the css file. Adding the following to the HTML.
<link rel="stylesheet" type="text/css" href="{{ asset('css/app.css') }}" >
And adding the file /resources/css/app.css to the project.
Assuming it is a fresh project, running the following commands does the trick. Off course using run prod for the deployment build.
npm install
npm run dev
I use this. Inside your blade
<style> {{ file_get_contents(public_path('css/app.css')) }} </style>
For newer versions of Laravel (that use Vite)
<head>
...
@vite("resources/css/app.css")
...
</head>
You should try this :
{{ Html::style('css/styles.css') }}
OR
<link href="{{ asset('css/styles.css') }}" rel="stylesheet">
Hope this help for you !!!
<link rel="stylesheet" href="{{ asset('css/filename') }}">so css is applied in a blade.php file.
Work with this code :
{!! include ('css/app.css') !!}
