This must be really simple, but since I’m new to Laravel, I’m having difficulties on finding this feature on documentation or in stackoverflow.
I’m going to try to build a very simple example to try to show what I want.
Let’s say I have a file called data.blade.php
#php
$myVariable = 'xyz';
#endphp
Then, I have my layout template file, called: home.blade.php
#extends('data.blade')
#section('content')
#php
echo $myVariable;
#endphp
#endsection
When I try to do this, it returns me an error:
Undefined variable $myVariable (etc)
How can I use a variable defined in another blade file? I used extends to exemplify, but I´m not sure if that is the right architecture.
Can anyone point me to the right way of accomplishing this?
Thanks!
you are extending data.blade.php and this file need to have some element to serve as template and be extended.
You can take any html5 file and rename this as template.blade.php, but where you want to render a section in your template must have a yield('section-name').
Make a new app.blade.php should look like this
<html>
<head>
<title>App Name - #yield('title')</title>
</head>
<body>
#section('sidebar')
This is the master sidebar.
#show
<div class="container">
#yield('content')
</div>
</body>
</html>
Then, in your home.blade.php
#extends('layouts.app')
#section('title', 'Page Title')
#section('sidebar')
#parent
<p>This is appended to the master sidebar.</p>
#endsection
#section('content')
#include(data)
{{$myVariable}}
<p>This is my body content.</p>
#endsection
From Laravel Doc
Related
So I created a custom layout for my design, it works on other blade but not for this one blade. I did some recheck just to make sure that it is the same as other blade that works.
Also the controller is prettymuch the same since it has the same function for my other blade.
My checkout.blade :
#extends('layouts.custom')
#section('content')
<h1> Content </h1>
#endsection
My custom layout
<!DOCTYPE html>
<html>
<head>
</head>
<body>
#yield('content')
</body>
<footer>
</footer>
</html>
My Controller:
public function checkout()
{
$keranjangItems = \Cart::session(auth()->id())->getContent();
return view('keranjang.checkout', compact('keranjangItems'));
}
And I've tried to put the content on other blade and got no problem.
And I've tried to change my other controller to view this blade and also working.
Can anyone help me find where the problem is? thanks
Update: I also tried to just put together the code no include layout or what so ever and it's still have the same result
On your custom.blade file it says
#yield('layouts.header')
and on your checkout.blade file it says
#section('content')
<h1> Content </h1>
#endsection
Either update the layout to match the section name on your checkout view or update the checkout view to match the yielded section name on the layout.
I have a little problem with Laravel Blade in Laravel version 5.2. Can someone tell me how to include a Blade template within a Blade template? I already try to include welcome.blade.php
by #include('welcome') but, I always get an error message.
first you need to define a master page or main template what ever you say.
we create main.blade.php as template page .
<html>
<div class="row">
#yield("content")
</div>
the above code is our simple template page.
inside your welcome.blade.php write as below
#extends("main")
#section("content")
your code
#stop
if welcome.blade.php is your template or master page do like below.
welcome.blade.php :
<html>
<div class="row">
#yield("content")
</div>
inside your other page you want use welcome page as template do as below :
#extends("welcome")
#section("content")
your code
#stop
I have two page on Laravel.
I can easily extend this layout in another blade partial to get a working modal with a header, content, and footer which I can embed using #extends('master').
My problem is:
The first page is using header1.blade.php.
And second page is using header2.blade.php.
On master.blade.php is my master page.
<body>
#include('partials.header1')
#yield('content')
#include('partials.footer')
</body>
On index.blade.php is using master.blade.php is master page with extends('master.blade.php).
On listnews.blade.php have same master page.
I want at listnews.blade.php using partials.header2.
Have any way to do this?
As an alternative to #lewis4u's answer you can use the #section directve.
This way you can define the default header to be used but you can change it whenever you need to.
Firstly, change your master.blade.php file to be:
<body>
#section('header')
#include('partials.header1')
#show
#yield('content')
#include('partials.footer')
</body>
Then in your listnews.blade.php file just add another section after the extends:
#section('header')
#include('partials.header2')
#endsection
Hope this helps!
I have inherited a Laravel project to which I need to add a new page with some functionality that I have created. What I've got appears to be a main "app.blade.php" file, which includes some stuff that will always be visible.. like sidebar, login auth stuff and so on.
Now adding stuff to this is no problem. But what I want is a separate .php file that is loaded in the main content area of the app.blade.php when I go to a certain URL, let's call it "mypage.com/newpage". (Essentially, I want a link in the sidebar to load this new content.)
So my custom content should appear in the main content area, but the standard sidebar, etc, should still be there. I'm guessing it's something with routes, but... How do I proceed? Which files do I edit? What do I add and where? I already got my new HTML and Javascript code ready - I simply need to add it into the Laravel project the right way.
Suppose , bellow code is your app.blade.php file which you want to inherit.
<html>
<head>
<title>App Name - #yield('title')</title>
</head>
<body>
#section('sidebar')
This is the master sidebar.
#show
<div class="container">
#yield('content')
</div>
</body>
</html>
and you want to load the app.blade.php file here. You need to extends the page and declare the sections like this.
#extends('app')
#section('title', 'Page Title')
#section('sidebar')
#parent
<p>This is appended to the master sidebar.</p>
#endsection
#section('content')
<p>This is my body content.</p>
#endsection
Extending a layout on laravel This may help you.
What you're looking for is template inheritance. You create a layout template that you use as the main layout and your pages inherit that main layout template. See the Laravel Blade documentation: https://laravel.com/docs/5.2/blade#template-inheritance
When extending a view in laravel blade, to have multiple places of inserting, it can be done as something like this:
<html>
<head>
<title>This is app/view/layout/default.blade.php</title>
{{ HTML::script('js/jquery-2.1.3.min.js') }}
{{ HTML::script('js/angular.js') }}
#yield('extra_libraries')
</head>
<body>
<div class="left-menu-bar">
#yield('left-menu-bar')
</div>
<div class="main-content">
#yield('main-content')
</div>
</body>
</html>
Then, when using the layout,
#extend ("layout.default")
#section('extra_libraries')
{{ HTML::script('js/underscore.js') }}
#stop
#section('left-menu-bar')
testing button
#stop
#section('main-content')
testing
#stop
What I want is a similar function when I am not extending but to include another blade into my current blade. i.e. something like this:
<html>
<head>
<title>This is app/view/layout/default.blade.php</title>
{{ HTML::script('js/jquery-2.1.3.min.js') }}
{{ HTML::script('js/angular.js') }}
</head>
<body ng-app="myTestingApp">
<div ng-controller="testing">
#include('components.componentA.htmlComponent'）
#include('components.componentB.htmlComponent'）
</div>
<script>
var app = angular.module('myTestingApp', []).controller("testing", testingController);
function testingController($scope) {
#include('components.componentA.angularCode')
#include('components.componentB.angularCode')
}
</script>
</body>
</html>
where componentA should be a blade file containing both anguarCode and htmlComponent. I know I can separate them into 2 files, but I want to see if there is a way to put them in the same file as they are closely related. Is there default function in laravel blade to achieve this?
P.S. The example shows why I want to put them together, if you know angularjs.
to include another blade into my current blade
Well, to include another blade file inside an existing one, it is definitely the #include tag that comes to save the day. If it still doesn't satisfies your requirements, you can always write your own methods by extending Blade.
However, the whole thing seems a little too complicated to me. Why don't you separate your JavaScript into different controllers and then use ng-view to call the corresponding HTML, as shown in that example at the bottom of the documentation.
Not sure but you could try
...
<body ng-app="myTestingApp">
<div ng-controller="testing">
#yield('componentA-html'）
#yield('componentB-html'）
</div>
<script>
var app = angular.module('myTestingApp', []).controller("testing", testingController);
function testingController($scope) {
#yield('componentA-angularCode'）
#yield('componentB-angularCode'）
}
</script>
</body>
#include('components.componentA')
#include('components.componentB')
</html>
And your componentA blade should be
#section('componentA-html')
html for A
#endsection
#section('componentA-angularCode')
angularCode for A
#endsection
the same way for compomentB blade