I am looking to Bootstrap my site and as such, have put common twitter bootstrap components into blade templates.
sidebar.blade.php
#include('panel1')
#include('panel2')
panelTemplate.blade.php
<div class="panel panel-primary">
<div class="panel-heading">
<div class="panel-title">
#yield('title')
</div>
</div>
<div class="panel-body">
#yield('body')
</div>
<div class="panel-footer">
#yield('footer')
</div>
</div>
This way, every time I wish to use a panel, then I can use #extends('panelTemplate').
panel1.blade.php
#extends('panelTemplate')
#section('title')
title panel 1
#stop
#section('body')
body panel 1
#stop
#section('footer')
footer panel 1
#stop
panel2.blade.php
#extends('panelTemplate')
#section('title')
title panel 2
#stop
#section('body')
body panel 2
#stop
#section('footer')
footer panel 2
#stop
The problem that I am facing is that instead of showing the contents of panel1.blade.php, then the contents of panel2.blade.php as declared in sidebar.blade.php the contents of panel1.blade.php is being repeated (shown twice).
Is Blade caching the request which is why panel1 is being repeated twice? Is there a way to override this behaviour or am I using the blade templating engine in a way which it was never intended?
You can achieve this by overwriting the sections.. try what you have already, but with these two updated sub-views:
panel1.blade.php
#extends('panelTemplate')
#section('title')
title panel 1
#overwrite
#section('body')
body panel 1
#overwrite
#section('footer')
footer panel 1
#overwrite
panel2.blade.php
#extends('panelTemplate')
#section('title')
title panel 2
#overwrite
#section('body')
body panel 2
#overwrite
#section('footer')
footer panel 2
#overwrite
It's tested and working here, though I'm not sure it's the intended use of #overwrite, so test thoroughly!
Related
I am using UIKIT Lightbox to display post images like Facebook as below:
Controller
$postImages = postsImages::where('postId', $post->postId)->limit(3)->get();
Blade
<div class="uk-child-width-1-3#m" uk-grid uk-lightbox="animation: slide">
#foreach ($postImages as $postImage)
<div>
<a class="uk-inline" href="{{$postImage->imageLink}}">
<img src="{{$postImage->imageLink}}">
#if ($loop->last && $post->hasImage > 3)
<div class="uk-overlay-default uk-position-cover more">
<div class="uk-position-center">
<h1>+{{$post->hasImage - 3}}</h1>
</div>
</div>
#endif
</a>
</div>
#endforeach
</div>
I limited the image thumbnails to 3 and the rest will be shown as +number_of_remaining_photos same like Facebook.
The problem is that when I click on a thumbnail to make it large and view the rest then I can see only those three images which I limited.
I went through UIKIT lighbox documentation and I found items option but I don't know how to use it in order to view all the images of that post by creating another query like below:
$postImages = postsImages::where('postId', $post->postId)->get();
to get all images there and showing it in the lightbox.
P.S. I am not sure, that is item option for that purpose or not. )
This is a practical solution.
1- Make another query without limit.
$postImagesAll = postsImages::where('postId', $post->postId)->get();
2- Add data-uk-lightbox="{group:'my-group'}" attribute to the result of both queries like below and everything will work fine:
<div class="uk-grid-collapse" uk-grid uk-lightbox="animation: slide;">
#foreach ($postImages as $postImage)
<div>
<a class="uk-inline" href='/storage/posts/{{$postImage->imageLink}}' data-uk-lightbox="{group:'my-group'}">
<img src="{{$postImage->imageLink}}"/>
#if ($loop->last && $post->hasImage > 3)
<div class="uk-overlay-default uk-position-cover more">
<div class="uk-position-center">
<h1>+{{$post->hasImage - 3}}</h1>
</div>
</div>
#endif
</div>
</a>
</div>
#endforeach
#foreach ($postImagesAll as $postImage)
<a class="uk-hidden" href="{{$postImage->imageLink}}" data-uk-lightbox="{group:'my-group'}"></a>
#endforeach
</div>
I've made a site with laravel and have a page where there are pictures that can be seen in hi-resolution via fancybox or downloaded. In the database i have counters for each action. and I do already have GET routes set up for the counting since they are used in other situations too.
for example: www.mysiste.com/somecode/someothercode/image/viewed
the simplified structure of each image is this.. This is called inside a for each loop.. i removed all styling and classes for better reading...
<div >
<div class="card" style="background-color: lightgray">
<div >
<a data-fancybox="gallery" href="/images/......../{{$photo->filename}}">
<img class="card-img" src="/images/......../thumb/thumb_{{$photo->filename}}">
</a>
</div>
<div class="card-footer">
<div>
<div>
<a download="{{$photo->filename}}" href="/images/......../{{$photo->filename}}">
<span>Download (Hi-Res)</span>
</a>
</div>
<div>
<a download="social_{{$photo->filename}}" href="/images/......../social_{{$photo->filename}}">
<span>Download (Social-Res)</span>
</a>
</div>
</div>
</div>
</div>
</div>
I would need that when they hit the download button it calls a certain URL in the background for upcounting.. (most important)
If possible I would like to hit another URL when the images are viewed fullscreen through fancybox.
how can this be done?
You can do something in the lines of:
<a data-fancybox="gallery" href="{{ route('photo.fancybox', ['photo' => $photo])}}">
<img class="card-img" src="/images/......../thumb/thumb_{{$photo->filename}}">
</a>
...
<a href="{{ route('photo.download', ['photo' => $photo])}}">
<span>Download (Hi-Res)</span>
</a>
PhotoController
public function download(Photo $photo){
$photo->downloadCount->increment();
return redirect('/images/......../'. $photo->filename);
}
public function fancybox(Photo $photo){
$photo->fancyboxCount->increment();
return redirect('/images/......../social_'. $photo->filename);
}
And make sure to register your new routes accordingly:
Route::get('photo/download', 'PhotoController#download')->name('photo.download');
Route::get('photo/fancybox', 'PhotoController#fancybox')->name('photo.fancybox');
I'm trying to yield a section inside another section. But this does not work as expected, I see blank output.
#section('3show')
This is a text string
#stop
#section('page-content')
<div id="content">
<article>
#yield('3show')
</article>
</div>
<!--#content-->
#stop
Any ideas to yield section inside another section ?
Ok, this is what I tried and I can confirm that this works, at least for Laravel 5+ (I have L5.2). This is how I suggest you to use your blade templates.
Lets start saying that to yield a section into another section you have to define your included section before container section definition. So, with that clear, I solved this situation like this:
I got a main blade (main.blade.php) template which has something like:
<section class="content">
<!-- Your Page Content Here -->
#yield('main-content')
</section><!-- /.content -->
I got a second blade (common.blade.php) template which has that common stuff you may want to show across many pages and where main-content section is defined. This one looks like:
#section('main-content')
<div class="container">
#yield('extra-content')
</div>
#endsection
Finally I got a 3rd template (test.blade.php) which extend the main template and include the common stuff I want to show, but be careful because the order matters. This one looks like:
#extends('main')
#section('extra-content')
<div>
<span> This is a test! </span>
</div>
#endsection
#include('common')
In your controller or your route (wherever you return your view), you should return the 3rd template.
In my projects i create some partials in order to have cleaner code and i give them as an example a name : 3show.blade.php. In order to use them in a section i just include them.
I think this will do what you want.
#section('content')
#include('3show.blade.php')
#endsection
I had the same issue.
You can't use the #extends option in this case, you need to use #include .
So lets say you have:
the root layout (layouts/app.blade.php)
an extra layout (layouts/extra.blade.php)
the actual view that you are calling (someview.blade.php)
The solution is to use add/inherit the root layout (1) to the top line of your view (3):
#extends('layouts.app')
Next, add/inherit the extra layout (2) to the second line of your view, BUT use #include not #extends:
#include('layouts.extra')
...and remember to wrap the content of your extra layout in an #section name, for example #section('extra')
Finally you can call your extra layout content from your view:
<p>Look below, you will see my extra content...</p>
#yield('extra')
So in summary, your someview.blade.php view would look like:
#extends('layouts.app')
#include('layouts.extra')
#section('content')
<p>Look below, you will see my extra content...</p>
#yield('extra')
#endsection
solution 1:
you can use #show instead of #stop at the end of section
then laravel will render your #yield parts ...
like this :
#section('page-content')
<div id="content">
<article>
#yield('3show')
</article>
</div>
#show # not #stop
#section('3show')
This is a text string
#stop
this way render you view and show result
so if you cll your section for twice then result will be shoed twice
solution 2:
insert call section before yiel it
like this :
**first call section :**
#section('3show')
This is a text string
#stop
**then define your section : 3show**
#section('page-content')
<div id="content">
<article>
#yield('3show')
</article>
</div>
#stop **not #show**
assume you have two files:
-article_base.blade.php -> the default data in every article.
-article_index.blade.php -> the customized file.
article_base.blade.php
#extends('layout')
#section('page-content')
<div id="content">
<article>
....
#yield('3show')
....
</article>
</div>
<!--#content-->
#stop
article_index.blade.php
#extends('article_base')
#section('3show')
This is a text string
#endsection
I hope this works
You have to both #include and #yield the child template in your main template to be able to add the child template at a specific place inside the main template (not just before or after the main template - this is done by adding #parent in the child template - but in between):
main.blade.php
#include('child')
<div>
...
#yield('child')
</div>
child.blade.php
#section('child')
<div>
...
</div>
#endsection
I have default blade , it will have 3 section and one yield content as like below
<div id="wrapper">
#show
#section('sidemenu')
#include('partials.admin_sidemenu')
<div id="page-wrapper" class="gray-bg">
#show
#section('navheader')
#include('partials.admin_navheader')
#show
#yield('content')
#show
#section('footer')
#include('partials.admin_footer')
</div>
</div>
In my login blade i don't want to show header,menu and footer so i have used below code to overwrite the header menu and footer
#extends('layout.default')
#section('sidemenu')
#stop
#section('navheader')
#stop
#section('content')
Login Form
#stop
#section('footer')
#stop
It's not over writing the footer content ... it was a issue?
How can i handle this?
Thanks Advance
You forgot about putting: #show at the end of section declaration:
#section('footer')
#include('partials.admin_footer')
#show
This is my first post so please be gentle with me.
I have set my master layout to call "main"
<div class="row">
{{$main}}
</div>
and I have a view called home.blade
<div class="col-md-9">
<div class="content">
{{$content}}
</div>
</div>
<div class="col-md-3">
<aside class="sidebar">
{{$sidebar}}
</aside>
</div>
and in my controller I have:-
$this->layout->main = View::make('home')->nest('content', 'property.viewmany', compact('properties'));
This works for the content variable, but at this point I'm stumped at how to get the sidebar variable to work. Is there a way to nest the two variables into the home.blade from the controller?
I've attempt various, albeit, shots in the dark, but I always get either content not defined or sidebar not defined.
You can put a first variable in the first view like this:
$this->layout->main = View::make('home', compact('sidebar'))->nest('content', 'property.viewmany', compact('properties'));