i'm developing a multi-tenant application with laravel & livewire.
I've a bootstrap template mounted such as a laravel project and i've integrated this template in my project.
For how the template is built, when I am on the localhost:8000/... views I get the correct rendering of the template, while when I go to the domain of a tenant, example: tenant.localhost:8000/... I completely lose the template.
I noticed that in resources/layout/default.blade to load all css and js there is a for loop that takes the css from the configuration file and loads them into the page
{{-- Global Theme Styles (used by all pages) --}}
#if(!empty(config('dz.public.global.css')))
#foreach(config('dz.public.global.css') as $style)
<link href="{{ asset($style) }}" rel="stylesheet" type="text/css"/>
#endforeach
#endif
using asset($style) when I go to the tenant domain, it looks for the css in a location that does not exist (the css are under localhost).
I thought of inserting an if-else inside the foreach loop in order to check the domain in the asset($style) and make sure that when in the tenant domain the css are searched as if we were in the localhost domain.
It's a good idea? do you have any advice or suggestions?
Now the asset location is changed for each tenant. You could 'hardcode' it.
Something like:
<link href='{{ env('APP_URL') }}/location/style.css'>
Another solution is to use the url() helper function instead of asset(), since it would generate an absolute path for the assets, this way you can use it in the same way as you use asset() function
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).
I have compiled my assets with Laravel mix. In blade file, the traditional way is
<link rel="stylesheet" href="{{ mix('/css/app.css') }}">
Favicon also works:
<link rel="icon" type="image/png" sizes="16x16" href="{{ mix('/favicon/favicon-16x16.png') }}">
What am I trying to do is, utilising mix() helper inside javascript, so that in my javascript I can access the cached asset path.
So in my component, I can do:
<img :src="mix_path('/img/hello.svg')" />
Is there a way to achieve that?
What comes to my mind is creating a global mixin and use that method in my read my mix-manifest.json and put the version id.
Edit: Use window object answer. That's sounds fine (as a workaround) as long as you don't use SSR as window object is not defined.
Maybe is there a way to write a javascript helper method to access the manifest.json to get the versioned path? Is it possible?
Update: This is how I solved it:
How to read mix-manifest.json from javascript
To pass PHP variables to the javascript will require you echo them to the page when it is loaded within a PHP file (i.e. a Blade template).
If you want to use them in pure javascript files, you could do something as simple as assigning them to properties of the window object
I have a header file that links to the user dashboard that displays on all pages on my site, but if I access the link from a page such as localhost/pages/page, I have to put href="../dashboard". If I am on the root directory (such as localhost/page) then using href="dashboard" works.
Is there a simpler way than changing the directories on every single page so I can just use href="dashboard" on all pages?
Use url() helper method:
<link rel="stylesheet" href="{{url('/dashboard/plugins/bootstrap/css/bootstrap.min.css')}}">
In Laravel 5.0, I am using the helper function asset to show where different assets are ( css, js images etc. ). I am building a platform that shows different information depending on the url which means I cannot bind the asset to a url. I know in config/app.php it has 'url' => 'http://localhost' but I cannot change that because the url will not always be the same. Is there a way to set this up to handle the domain changing within the same application?
Assuming your assets are always going to be in the same relative path from the root of the site (regardless of the domain), you should just be able to output the URL to various assets as a relative URL. So, for example, if in your blade template you had something like:
<link rel="stylesheet" href="{!! asset('css/style.css') !!}">
you could replace it with a relative URL like this:
<link rel="stylesheet" href="/assets/css/style.css">
This should resolve correctly regardless of what domain you're on, and should also be fetched via HTTPS in the case that the user is on a secure page.
If you need something more complicated, you might consider setting a session('domain') variable or something that would be accessible from a global scope that could then be used to generate links to assets like:
<link rel="stylesheet" href="http://{{ session('domain') }}/assets/css/style.css">
If none of these work, then your situation is probably complicated enough that you'll need to provide us some more code before we can offer workable solutions.
TL;DR: What is the correct way to link to a stylesheet in Laravel 5?
Background:
I'm using the dev version of Laravel 4.3 (5) because I want to use Socialite, and it makes sense to develop with that from the start. I am having a problem getting templates transferred from 4.2
I've moved my blade layout files to the new directory structure (resources/templates) and placed my CSS in the public/css/ folder.
When I load my route /test/ all I get is "Whoops, looks like something went wrong."
For testing purposes I've removed all blade layout syntax from my layouts - the raw HTML works, but there is no styling (as there is no linked stylesheet). That tells me the routes, views and controllers work.
The problem:
In my layouts, if I remove the following, the layouts work:
{{ HTML::style('css/bootstrap.min.css') }}
{{ HTML::style('css/style.css') }}
Question:
What is the correct location and syntax for Blade Stylesheet inclusion in Laravel 5 and what I should be using instead?
The HtmlBuilder has been removed from Laravel's core, so HTML::style() is no longer available.
If you want to use it in laravel 5, add the following to your composer.json file, under the require key:
"laravelcollective/html": "~5.0"
Also note, since HTML::style() returns HTML code, you don't want it escaped. Use the raw brackets:
{!! HTML::style('css/style.css') !!}
Adding to #joseph's answer, for the users preferring not to switch to the new syntax, you can use
Blade::setRawTags('{{', '}}');
and continue with the old syntax . this can be set almost anywhere, but a better choice would be a service provider, say legacy service provide for l4 . you can find further discussion on this at laracasts, where you can find taylor otwells thoughts on this .
If you want to use plain HTML then use like this-
<link rel="stylesheet" href="/css/folder/style.css">