css js file are not displaying in laravel5 - laravel

I've just installed a Laravel 5 project on XAMPP and my pages are not finding the css files.
This is the link to my css in my public folder:
{{ URL::asset('codepath') }}
{!! ('codepath') !!}

Link to CSS should look like this:
<link rel="stylesheet" href="{{ asset("css/my.css") }}" />
To make it work, my.css file should be placed at laravelProject\public\css\my.css.
If this doesn't work, then you should setup XAMP properly and point web server to a public directory which is inside laravel project root.

Your link to CSS file should be like
<link rel="stylesheet" href="{{ asset("yourcssfile.css") }}" />
OR
<link rel="stylesheet" href="{{ url("yourcssfile.css") }}" />
And your file should be in public directory of your project e.g yourproject/public/yourcssfile.css
That's it!

Related

Vite (in Laravel) cannot use with static assets from public directory

I have a problem when I update to laravel 9.19 (using vite instead of webpack).
In my project I using some static assets from public directory like <link rel="stylesheet" href="/css/assets/slick.css"> or <script src="/js/assets/slick.min.js"></script> and have 2 files to compile from resources like resources/sass/app.scss and 'resources/js/app.js', the same for .js files. On webpack I do something like this:
<link rel="stylesheet" href="{{ mix('/css/app.css') }}"><link rel="stylesheet" href="/css/assets/slick.css"> ... and
<link rel="stylesheet" href="{{ mix('/css/style.css') }}
the same situation for .js files and all works perfectlly. How I can do this with Vite
You can read the laravel docs, you should use the blade directive #vite() an use the project path:
#vite('resources/sass/app.scss')
#vite('resources/js/app.js')

laravel - adding custom files in the public folder

I am trying to add custom css and js files to the laravel public folder and I dont want to use the the default css and js folders. I created a folder and tried linking to it with my blade and its returning a 404
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link href="{{ asset('open-iconic/font/css/open-iconic-bootstrap.css') }}" rel="stylesheet">
adding open-iconic-bootstrap.css to the css folder works but I am trying to use a customer folder. Am I missing a step on getting this to work?
404 is app.css or open-iconic-bootstrap.css ?
you don't need link the css\app.css and js\app.js
and delete the line <link href="{{ asset('css/app.css') }}" rel="stylesheet">
check the correct path open-iconic/font/css/open-iconic-bootstrap.css

Laravel 5.5 css path is not working under public directory

I have used the following to generate the CSS file:
<link rel="stylesheet" href="{{ asset('public/global/bower_components/bootstrap/dist/css/bootstrap.min.css') }}">
However, I see the css is not loading. From the view source, I see the below code which is not opening (404).
<link rel="stylesheet" href="http://127.0.0.1:8000/public/global/bower_components/bootstrap/dist/css/bootstrap.min.css">
But, if I remove the "public keyword" from the above path, its working.
I'm using php artisan serve in Ubuntu 16.04
<link rel="stylesheet" href="{{ public_path('global/bower_components/bootstrap/dist/css/bootstrap.min.css') }}">
<link rel="stylesheet" href="http://127.0.0.1:8000/global/bower_components/bootstrap/dist/css/bootstrap.min.css">
these two works. Because when 127.0.0.1:8000 load, it starts making the project from public path.
and asset(/path) is represent asset folder. You must change this with public_path
You can use asset() helper,
<link href="{{ asset('public/global/bower_components/bootstrap/dist/css/bootstrap.min.css') }}" type="text/css" rel="stylesheet">

CSS and JS not working over HTTPS in laravel

My CSS and JS file work fine on localhost but when up to host it not working.
I use laravel 5.4. I tried a lot of ways but still failed.
enter image description here
My embedded CSS and JS code
enter image description here
UPDATE: Thanks all i have fixed my problems follow this:
1. change http://localhost to https://localhost at APP_URL line in .env file
2. add \URL::forceScheme('https') to AppServiceProvider.php file in boot() function
3. the last is include {{asset('--link_on_href--')}} for each CSS and JS embeded on index.php
Use the asset() helper to include assets in your view. This will automatically generate the appropriate URL for the included files based on you APP_URL in your .env file.
For CSS,
<link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" >
Or
<link href="{{ URL::asset('css/app.css') }}" rel="stylesheet" type="text/css" >
For JS,
<script type="text/javascript" src="{{ asset('js/custom.js') }}"></script>
Or
<script type="text/javascript" src="{{ URL::asset('js/custom.js') }}"></script>
For Images and other such assets,
{{ asset('img/photo.jpg'); }}
Link to the Docs

How do i call css file in laravel?

Good day. I'm trying to call css in laravel. Here is the css url
<link rel="stylesheet" href="http://localhost:84/mycms/public/css/index.css">
It's working fine.
Then I'm trying the laravel way with this https://stackoverflow.com/a/16565640/6354277 . And i change it to this
<link rel="stylesheet" href="{{ URL::asset(css/index.css') }}">
It Seems i can't found the css file. How can i fix it ?
You may try this.
My css file is in public/css/sample.css
It works fine
<link href="{{ asset('css/sample.css') }}" rel="stylesheet" >

Resources