I have 4 blade page
=> layout.blade.php
=> index.blade.php
=> contact.blade.php
In layout.blade.php i have two yield
One Is:
#yield('css') // to add additional css
Another One Is:
#yield('script') //to add additional script
index.blade.php extends layout.blade.php
so that i can add section('css') and section('script') for additional css or script only for index.blade.php page
Now the problem is: In layout.balde.php has all the common link and script But i don't want those link to every page. i want some way to; not to load a specific link or some link in some page that extends layout.blade.php.
Example:
=> layout.blade.php
-> <link href="one.css">
-> <link href="two.css">
=> index.blade.php extends layout.blade.php
-> <link href="one.css"> // because index extends layout
-> <link href="two.css"> // because index extends layout
=> contact.blade.php extends layout.blade.php
-> <link href="one.css"> // because index extends layout (i don't want to load this link)
-> <link href="two.css"> // because index extends layout
Note
I NEED SOME DYNAMIC WAY TO SAY FROM contact.blade.php TO OFF THIS LINK OR SOME LINK THAT COME FROM layout.blade.php
#yield only use one time from #section
So use #push
#stack in you main layout and many #push in multiple views
In your layout.blade.php add #stack('scripts')
And in index.blade.php add
#push('scripts')
<script src="/index.js"></script>
#endpush
And in contact.blade.php add
#push('scripts')
<script src="/contact.js"></script>
#endpush
You can push multiple css or js or content with #push and #stacks
See https://laravel.com/docs/5.8/blade#stacks
If you want to disable some css or js in specific page you can make check if page is contact
In web.php add route name to contact page
Add this to layout.app.php
#if(request()->route()->getName() != "contact")
Load your css here as page not contact
#endif
So if you open contact page the css not loaded as route name is contact
Related
This is a complete new application using Laravel 9 and Livewire
By default you have two layouts, guest and app. I want to create a new layout for all my admin things.
So, first I create a component
php artisan make:component AdminLayout
This creates \app\View\Components\AdminLayout.php, it read as:
<?php
namespace App\View\Components;
use Illuminate\View\Component;
class AdminLayout extends Component {
public function render() { return view('layouts.admin'); }
}
As any of the other two AdminLayout.php or GuestLayout.php
So now I write app\resources\views\layouts\admin.blade.php which is a stantandard HTML with the {{ $slot }} blade directive, something as...
<html>
<head>
...
<title>Admin Page</title>
...
#livewireStyles
#vite([...])
</head>
<body>
<main class="...">
{{ $slot }}
</main>
#livewireScripts
</body>
</html>
Then I create the admin routes... The Index class is in \app\Livewire\Admin\Index.php and it is correctly imported
Route::get('', Index::class)->name('home');
The Index.php reads as
class Index extends Component {
public function render() { return view('livewire.admin.index'); }
}
The \app\resources\views\livewire\admin\index.blade.php reads:
<x-admin-layout>
Hello
</x-admin-layout>
So everything seems to be right... now I have two problems that I can't spot/solve. When I load the http:://server.test/admin it should load this page. 1) It doesn't change the title in the page for Admin Page, 2) It always loads the #livewire('navigation-menu'), and looks like the followin picture:
If I add things above the {{ $slot }} or below, they are rendered. If I add another #livewire('navigation-menu') it is rendered. But I'm not able to take it out, even when I'm not telling to display it.
Any idea?
I just noticed that if I add a comment in the guest layout or the admin layout, it simply ignores it. If I add a comment in the app layout it somehow "propagates" to both the guest and admin layout. Is this the expected behaivour?
The "/" (index page as landing page) and "pages/home" (Home page) must be different in that the landing page must not have navigation and footer.
I have tried the redirect method which led both urls showing the same page.
I have also used the standard routing method which works partially. The only problem is I do not want to have the header and footer of the home page on the landing page.
Maybe, one way to achieve this is to use two different blade layout files. Like app.blade.php and landing.blade.php. But the problem again might be of routing between the landing page and home page as both are from two different layout files.
WEB/PHP
Route::redirect('/', '/home', 301);
Route::get('/home', 'PagesController#index');
CONTROLLERS/PagesController
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class PagesController extends Controller
{
public function index(){
return view('pages.index');
}
public function home(){
return view('pages.home');
}
}
app.blade.php
<body>
<div class="container">
#include('inc.navbar')
#yield('content')
#include('inc.footer')
</div>
</body>
I expect a different page for landing but header and footer appears on the landing page as well.
You can get rid of the controller entirely for this
Route::view('/', 'pages.index');
Route::view('/home', 'pages.home');
Now if you go to visit the site example.com you'll see the landing page
And example.com/home shows the home page
Another solution would be to exclude the header and footer from the app layout if the request path is '/' i.e the landing page
<body>
<div class="container">
#includeWhen(request()->path() != '/', 'inc.navbar')
#yield('content')
#includeWhen(request()->path() != '/', 'inc.footer')
</div>
</body>
Hope this helps
Ths should be simple enough, but...
I have a layout view dashboard-layout.blade.php with:
#section('headscripts')
<script src="{{ mix('/js/app.js') }}" defer></script>
#show
And a billing.blade.php view that extends the layout file:
#extends('layouts.dashboard-layout')
#section('headscripts')
#parent
<script src="https://js.braintreegateway.com/web/dropin/1.17.2/js/dropin.min.js"></script>
#endsection
The problem is, this only outputs the first script...what am I doing wrong?
You can simply use #stack('name here') instead of #yield('name here')
and use
#push('name here')
// Add Your Script Here
#endpush
instead of
#section('name here')
// Scripts
#endsection
to solve your problem.
I'm still new to Laravel. Anyway, I'm making a small system of viewing and creating articles to be shown in the main site. I wanted to create a page that displays an article from the database, using a parameter from the URL, like this:
http://localhost:8000/read/1
The above, for example, will display the article with 'id' value of 1 in the database.
So it works just fine, but problem is, after I got it to work (which took me some time since I'm a newbie), the whole style just disappears from the page. I tried to rewrite everything but it still didn't work. New pages that I create include the style just fine.
This is my route line:
Route::get('read/{id}', array('as' => 'read', 'uses' => 'NewsController#readArticle'));
NewsController readArticle function:
public function readArticle($id) {
$article = NewsMessage::where('id', $id) -> first();
return View::make('news.read', array('article' => $article));
}
And the file read.blade.php (located in views/news/read.blade.php)
#extends('layouts.main')
#section('content')
{{ $article -> title }}
#stop
So the whole PHP code works fine and I manage to get the title. But for some reason, the whole style disappears and this is what I see:
http://puu.sh/ctO6J/db30fbe102.png
So any idea, what have I dont wrong that caused this? The other pages work just fine with the style included.
Thank you!
The issue is that the path to the image is incorrectly specified.
You can either use the built in asset methods or something like {{ URL::to('/')/imagepathhere/filename.jpg }}
Assuming you have your styles links wrote as:
#extends('layouts.main')
#section('styles')
<link href="css/custom.css" rel="stylesheet" />
<link href="css/styles.css" rel="stylesheet" />
#endsection
#section('content')
{{ $article -> title }}
#endsection
Correct Syntax:
#extends('layouts.main')
#section('styles')
<link href="{{ asset('css/custom.css') }}" rel="stylesheet" />
<link href="{{ asset('css/styles.css') }}" rel="stylesheet" />
#endsection
#section('content')
{{ $article -> title }}
#endsection
And make sure your css folder is located at public folder when calling with asset() helper.
This issues of disappearing the whole page styles is causing by accessing the image or css file or any other resources, and the solution is to use asset() helper function.
NOTE: YOUR ROUTES AND CONTROLLER HAS NO ISSUE, YOU DON'T NEED TO TOUCH EITHER.
I am using a fresh build today of Laravel 4.
I have a dashboardController
class DashboardController extends BaseController {
protected $layout = 'layouts.dashboard';
public function index()
{
$this->layout->content = View::make('dashboard.default');
}
}
I have a simple route
Route::get('/', 'DashboardController#index');
I have a blade layout in views/layouts/dashboard.blade.php
For the sake of saving everyone from all of the actual HTML ill use a mock up.
<html>
<head>
<title></title>
</head>
<body>
#yield('content')
</body>
</html>
I have a default blade file in views/dashboard/ that has the following (edited for simplicity)
#section('content')
<p>This is not rocket science</p>
#stop
For some reason the content gets generated before the layout.
I am using a different approach to set the layouts globally to routes using a custom filter. Put the following filter into the app/filters.php
Route::filter('theme', function($route, $request, $response, $layout='layouts.default')
{
// Redirects have no content and errors should handle their own layout.
if ($response->getStatusCode() > 300) return;
//get original view object
$view = $response->getOriginalContent();
//we will render the view nested to the layout
$content = View::make($layout)->nest('_content',$view->getName(), $view->getData())->render();
$response->setContent($content);
});
and now instead of setting layout property in the controller class, you can group the routes and apply the filter as shown below.
Route::group(array('after' => 'theme:layouts.dashboard'), function()
{
Route::get('/admin', 'DashboardController#getIndex');
Route::get('/admin/dashboard', function(){ return View::make('dashboard.default'); });
});
When creating the views, make sure to use the #section('sectionName') in all the sub views and use #yield('sectionName') in the layout views.
I find it easier to do my layout like this for example. I would create my master blade file like so
<html>
<body>
#yield('content');
</body>
</html
And in the blade files that I want to use the master at the top i would put
#extends('master')
then content like so
#section('content')
// content
#stop
Hope this helps.
When you use controller layouts, i.e. $this->layout->..., then you get access to data as variables, not sections. So to access content in your layout you should use...
<html>
<head>
<title></title>
</head>
<body>
<?php echo $content; ?>
</body>
</html>
And in your partial, you would not use #section or #stop...
<p>This is not rocket science</p>