I host Laravel project on xampp server. but now I run the laravel project using php artisan serve. When I run the artisan server, the url is http://localhost:8000. but my xampp server is http://localhost. The url path is wrong. The images doesn't appear and javascript and jquery don't work on my project. how can i fix it?
use this way to url CSS and JS files path
<link rel="stylesheet" href="{{ URL::asset('css/app.css') }}">
and image path use
<img src="{{url('/images'}}">
//here you have to give public path ex: in your public folder has images then use like this
Related
I am using Laravel, in my layout blade template file (used by all my views) I have the following code to generate my stylesheet URL:
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
When the page is generated this appears like this: http://myapp.test/css/app.css which looks like its correct, I have a file in the following directory \resources\css\app.css.
When I try and access the css file directly via the URL, laravel throws a 404 error, can someoen tell me what I'm doing wrong?
If you aren't using mix.css or tailwind or anything, and are writing your own css, put it in /public/css/app.css
When you use {{ asset('css/app.css') }} , laravel points to public/app.css.
Browser can only access contents of inside public folder.
Laravel uses webpack which complies css file located inside resources/css and saves into public/css.
If you look inside webpack.mix.js located in root folder of your project you can see following:
mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css', [
//
]);
So, if you access http://myapp.test/css/app.css , you should get css located in your public folder. you can confirm this from source tab of your browser's developer tools (i.e. page inspect).
Hope you can clarify this issue:
I am trying to ad a favicon to my website in the head of my html layout, the link i am using is :
href="{{ asset('assets/public/images/favicon-32x32.png') }}"
I have my file in the following route:
backend/public/images/icon.png
the icon is not displaying on the web anyway, any idea about what can be the issue here?
thanks
as in laravel documentation
The asset function generates a URL for an asset using the current
scheme of the request (HTTP or HTTPS):
$url = asset('img/photo.jpg');
You can configure the asset URL host by setting the ASSET_URL variable
in your .env file. This can be useful if you host your assets on an
external service like Amazon S3:
// ASSET_URL=http://example.com/assets
$url = asset('img/photo.jpg'); // http://example.com/assets/img/photo.jpg
so if you use default ASSET_URL value in .env file and your favicon file in file structure like :
project_Folder/public/images/favicon.ico
so you need to make your link like
{{-- favicon --}}
<link rel="shortcut icon" href="{{ asset('images/favicon-32x32.png') }}">
After removing .htaccess from public to main, and renaming server.php to index.php all Asset links and links from the css background-image are wrong.
Is there a way to either have the same problem on localhost (the /public in the url) or is there an other easy fix? Cause right now if I fix my code on my online server, it doesn't work locally anymore and vise versa.
External CSS, Images and JS
Example Here,
Your URL Like:
For CSS
<link rel="stylesheet" type="text/css" href="{{url('/public/file_name.css')}}">
For JS
<script type="text/javascript" src="{{url('/public/file_name.js')}}">
After domain name, you must use public and then your CSS, images, and js path.
In my Laravel 5.7 site I use Ckeditor together with Laravel-Filemanager. After following all the installation instructions I got it to work fine locally. No problems att all. But I cannot get it to work in my remote web server.
On the remote server I have placed the Laravel app in a subfolder 2 levels down from the webroot.
In my blade template I have this (I have tried using both asset and url helpers in the option urls and both of them works locally):
<script src="{{ asset('vendor/unisharp/laravel-ckeditor/ckeditor.js') }}"></script>
<script>
var options = {
filebrowserImageBrowseUrl: "{{ url('/laravel-filemanager?type=Images') }}",
filebrowserImageUploadUrl: "{{ url('/laravel-filemanager/upload?type=Images&_token=') }}"
};
</script>
<script>
CKEDITOR.replace('editor1', options);
</script>
When I want to upload an image in my CKeditor by clicking the Browse server button in my local environment it works as it should and the URL looks like this in Laravel File Manager ('laravel/' being the webroot):
http://laravel/laravel-filemanager?type=Images&CKEditor=editor1&CKEditorFuncNum=0&langCode=sv
When I do the same thing in my remote server the URL looks like this:
http://www.myremoteserver.com/subfolder1/subfolder2/public/laravel-filemanager?type=Images&CKEditor=editor1&CKEditorFuncNum=0&langCode=sv
... and all I get is a 404.
I have tried to clear route, config and site caches. I have also tried to copy the URL above in the remote environment and pasting it a new window without the /public/ part.
Is there anyone out there that can guess what is going on? All help would be greatly appreciated.
please share with me how got the ckeditor to upload files when you click send to server because i have being searching for it for about 2 days now yet no solution.
iam using laravel 5.7
and unisharp laravel-filemanager but no solution was found.
I only saw to add config.filebrowserUploadMethod = 'form';
in the ckeditor congi.js but even after adding that i still didn't get any solution.
every other things seems to be working fine.
please i will be glad to receive your assistance
I finally got it to work. I wiped the web server folder clean and uploaded all files again from the beginning manually instead of doing it by cloning the GIT repo. And then it worked. So I actually am not sure what was wrong.
Anyhow I added this snippet below where I wanted the CKeditor in my blade template:
<textarea id="editor1" name="story" class="form-control">{{ $story }}</textarea>
And this near the bottom of the blade template, just before #endsection.
<script src="{{ asset('vendor/unisharp/laravel-ckeditor/ckeditor.js') }}"></script>
<script>
var options = {
filebrowserImageBrowseUrl: "{{ url('/laravel-filemanager?type=Images') }}",
filebrowserImageUploadUrl: "{{ url('/laravel-filemanager/upload?type=Images&_token=') }}"
};
</script>
<script>
CKEDITOR.replace('editor1', options);
</script>
Be sure to publish as per the filemanager instructions:
php artisan vendor:publish --tag=lfm_config
php artisan vendor:publish --tag=lfm_public
And clear caches:
php artisan route:clear
php artisan config:clear
Also check that the vendor folder exists in your public directory with CKeditor and Laravel filemanager folders inside it, otherwise the asset and url helpers will not work. Also check in the dev window (F12 in browser) what your current path is to ckeditor.js.
I've downloaded a template from here.
I want to design pages like that in laravel blade pages, I put css and js files in public folder and link blade files to them, and it works.
But I can't handle images, there isn't a folder for images in this template and I don't know how to load them in my blade pages.
you can upload images on below path
storage/app/public/images
//this way you can use in your blade file
<img src = "{{ asset('/images/YOUR_IMAGE.png') }}" />
but you need to run one command
php artisan storage:link
it will create a symlink from public/storage to storage/app/public
please insert as below path and make link like that.
try this.
<div class="hidden-xs" style="width:200px; height:auto; margin-left:-10px;">
<img src="{{ asset('uploads/logos/myLogo.png') }}">
</div>
If not working... then check your App Url in /.env and restart your app server.
APP_URL=http://localhost
Happy coding~!:)