With Laravel’s Blade templating engine, it is possible to stack multiple sections with the same name throughout a template, and yield them all together in one place. This is particularly useful if you have multiple partial views that each need to append some JavaScript to a\u00a0<script><\/span>\u00a0tag at the end of your page, for instance.<\/p>\n

tl;dr<\/h3>\n

Unlike when using\u00a0the @section<\/span>\u00a0 Blade directives, there can be as many @push(‘name’)<\/span>\u00a0 directives with the same name as you need. Using the @stack(‘name’)<\/span>\u00a0 directive in place of @yield<\/span>\u00a0, will then pop them all out at once in a single location in your template (in reverse order).<\/p>\n

Example usage<\/h2>\n

Suppose you’re using jQuery and that you have two partial views that each need a bit of JavaScript to run on page load:<\/p>\n

Desired output<\/h3>\n

<!-- From first partial -->\r\n<div class=\"must-init\">\r\n    <p>Sample<\/p>\r\n<\/div>\r\n\r\n<!-- From second partial -->\r\n<div class=\"needs-setup\">\r\n    <p>Example<\/p>\r\n<\/div>\r\n\r\n<script>\r\n    $(function () {\r\n        \/\/ Required by first partial\r\n        $('.must-init').initialise();\r\n        \/\/ Required by second partial\r\n        $('.needs-setup').setup();\r\n    )};\r\n<\/script><\/pre>\n
Adding the scripts adjacent to the views is problematic, because likely jQuery won’t be loaded when they are executed. You could try to always remember to yield two different sections in the main layout view, but that is rather error prone.<\/p>\n
Enter stacks<\/h2>\n
By stacking the script sections in your views, the same output that you’d create above if you weren’t using partials is easy to achieve. First, @push<\/span>\u00a0 the script needed by each view onto the stack:<\/p>\n
Partial template one<\/h3>\n
<!-- From first partial -->\r\n<div class=\"must-init\">\r\n    <p>Sample<\/p>\r\n<\/div>\r\n\r\n@push('readyscripts')\r\n    \/\/ Required by first partial\r\n    $('.must-init').initialise();\r\n@endpush<\/pre>\n
Partial template two<\/h3>\n
<!-- From second partial -->\r\n<div class=\"needs-setup\">\r\n    <p>Example<\/p>\r\n<\/div>\r\n\r\n@push('readyscripts')\r\n    \/\/ Required by second partial\r\n    $('.needs-setup').setup();\r\n@endpush<\/pre>\n
Popping the stack<\/h2>\n
You can’t use @yield<\/span>\u00a0 to insert the pushed scripts\u00a0into another template, since they weren’t defined in @section<\/span>\u00a0 directives. Instead, simply use @stack<\/span>\u00a0 in otherwise the same way:<\/p>\n
<script>\r\n    $(function () {\r\n        @stack('readyscripts')\r\n    });\r\n<\/script><\/pre>\n
One potentially important caveat to keep in mind is that since this is indeed a\u00a0stack<\/a>, the last<\/em>\u00a0section that you push onto it will be the first<\/em> to appear in your rendered output. So instead of obtaining an exact formulation of the code we initially wanted, in this example we’d end up with something like this:<\/p>\n
<!-- From first partial -->\r\n<div class=\"must-init\">\r\n    <p>Sample<\/p>\r\n<\/div>\r\n\r\n<!-- From second partial -->\r\n<div class=\"needs-setup\">\r\n    <p>Example<\/p>\r\n<\/div>\r\n\r\n<script>\r\n    $(function () {\r\n        \/\/ Required by *second* partial\r\n        $('.needs-setup').setup();\r\n        \/\/ Required by *first* partial\r\n        $('.must-init').initialise();\r\n    )};\r\n<\/script><\/pre>\n
 <\/p>\n","protected":false},"excerpt":{"rendered":"
With Laravel’s Blade templating engine, it is possible to stack multiple sections with the same name throughout a template, and yield them all together in one place. This is particularly useful if you have multiple partial views that each need to append some JavaScript to a\u00a0<script>\u00a0tag at the end of your page, for instance. tl;dr … [Read more…]<\/a><\/span><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/posts\/153"}],"collection":[{"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/comments?post=153"}],"version-history":[{"count":13,"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/posts\/153\/revisions"}],"predecessor-version":[{"id":166,"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/posts\/153\/revisions\/166"}],"wp:attachment":[{"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/media?parent=153"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/categories?post=153"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.munderwood.ca\/index.php\/wp-json\/wp\/v2\/tags?post=153"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}