How to include a template that set content into blocks using twig - twig

It's difficult to explain but I have a layout.html.twig template like this:
{% block css '' %}
{% block content '' %}
{% block js %}
<script src="jQuery.js"></script>
{% endblock js %}
I have another template index.html.twig that extends the layout one like this
{% extends 'AcmeBundle::layout.html.twig' %}
{% block content %}
{% include 'AcmeBundle:Module:module_1.html.twig' %}
{% include 'AcmeBundle:Module:module_2.html.twig' %}
{% include 'AcmeBundle:Module:module_3.html.twig' %}
{% endblock content %}
{% block js %}
{{ parent() }}
<script ...></script>
{% endblock js %}
Each included module has some javascript inside but they need to have jQuery loaded to work.
But jQuery is set in the layout.html.twig so it's not working.
How can I include my modules being sure that the script is executed after jQuery is loaded?
Is it possible to access the js block somehow? I had a look to embed but I'm not sure it's what I need.
Any ideas?
Cheers,
Maxime

Related

Not able to load multiple blocks in base template in Django

I am having a problem in my templates. I am trying to add two blocks in the base template,
it works when I include them but when I try to extend the base template it won't work and won't even throw an error.
This shud be the problem ... I will also leave a link to the original answer
MOVE THE INCLUDE BLOCKS INTO THE NAMED BLOCKS
Another situation where an include statement will fail without raising an error is if you are working in a template which extends another, and your include is outside of a named block:
{% extends "my_base.html" %}
{% block content %}
{{ block.super }}
{% include "partials/file1.html" %}
{% endblock %}
{% include "partials/file2.html" %}
In this case file2.html will not be included because it is not in a block, and you will get no warning messages, and will try all sorts of things before you realise what you've done.
Include tags not working
My Django ver: 2.2
For all trying to figure out how to declare multiple blocks, even though base has just one {% block content %},
You can declare block within block
This is my base.html:
{% block content %}
{% endblock %}
This is my home.html:
{% block content %}
{% extends 'base.html' %}
Some common content I want
{% block my_variable_data %}
{% endblock %}
{% endblock %}
My some other page:
{% extends 'home.html' %}
{% block data_content %}
{% endblock %}

Twig, is it possible to override an tag atribute of parent template from a child template?

I have two templates, a parent template and a child template.
I want know if its possible to add 'properly' a class to a tag in the parent template from the child template ? and if yes, how ?
By example, if I have this parent.html.twig file :
<body>
{% block body %}{% endblock %}
{% block javascripts %}{% endblock %}
</body>
And this child.html.twig file :
{% extends 'parent.html.twig' %}
{% block body %}
{# ... #}
{% endblock %}
From the child.html.twig file, can I add a class to the body tag ? and how ?
Thanks for help :)
You should modify the parent template adding a block, as example:
parent.html.twig
<body {% block bodyclass %}{% endblock %}>
{% block body %}{% endblock %}
{% block javascripts %}{% endblock %}
</body>
and use in the child:
child.html.twig
{% extends 'parent.html.twig' %}
{% block bodyclass %}class="child-class"{% endblock %}
{% block body %}
{# ... #}
{% endblock %}
You can try in this twigfiddle

Multiple blocks in Grav cms twig template

I am making a Grav template from a static html. This is a one-pager, so I am using modular templates and content. The problem is that I have a gallery, and my clicking on an image, a modal pops up. The code for the modals are places outside the container I am using for the image gallery.
Is there a way to have a twig modular template creating output code two different places on the base template? I have tried using multiple blocks in the modular template, but in the final output all code are places inside the image gallery container? My templates have multiple level nesting just to make it a little bit easier:
main
Listing of categories
Listing of images for each category
base.html.twig (simplified):
{% block body %}
{% block modal %}{% endblock %}
{% block content %}{% endblock %}
{% endblock %}
modular.html.twig:
{% extends 'partials/base.html.twig' %}
{% block content %}
{{ page.content }}
{% for module in page.collection() %}
<div id="{{ _self.pageLinkName(module.menu) }}">
{{ module.content }}
</div>
{% endfor %}
{% endblock %}
category-list.html.twig (simplified):
{% block content %}
{% for module in page.collection() %}
{{ module.content }}
{% endfor %}
{% endblock %}
content template (simplified):
{% block modal %}
{{ page.titel }}
{% endblock %}
{% block content %}
{{ page.content }}
{% endblock %}
My problem: rendering the block modal from the content template in the block Modal in the base template. Currently the block modal is rendered in block content.
Any ideas?
Thanks

Extending twig blocks in a complicated scenario

Let's say I have these twig templates:
base.twig
{# base.twig #}
<html>
<head>
{% include 'head_js.twig' %}
</head>
<body>
{% block content %}{% endblock %}
</body>
</html>
head_js.twig
{# head_js.twig #}
{% block headJS %}
<script src='/js/some-script.js'></script>
{% block headJSExtra %}{% endblock %}
{% endblock %}
page.twig (the one loaded by the controller)
{# page.twig #}
{% extends base.twig %}
{% block content %}
<p>Widget 1</p>
{% include 'widget.twig' with { name: 'foo' } %}
<p>Widget 2</p>
{% include 'widget.twig' with { name: 'bar' } %}
{% endblock %}
widget.twig
{# widget.twig #}
{% if wigetAlreadyIncluded is not defined %}
{% block headJSExtra %}
{{ parent() }}
<script src='/js/widget.js'></script>
{% endblock %}
{% set widgetAlreadyIncluded = true %}
{% endif %}
<p>My name is {{ name }}</p>
This code doesn't work (can't use parent() in widget.twig as it's not extending or using any template), but it should illustrate what I'm trying to achieve. The basic idea is:
In order to work, widget.twig requires a js library to be loaded in as a tag in the .
The widget can be rendered several times in one page.
Other widgets should be able to also add their own tags in the in this fashion, but they shouldn't override previous added tags (they should be appended).
I don't want to add more than once any tag required by any widget found in the page.
Any ideas on how can I achieve this would be greatly appreciated. I've read two SO related questions with no luck at all.
https://stackoverflow.com/a/29132604/4949663
https://stackoverflow.com/a/18160977/4949663
I finally got a good answer in the twig github issue tracker.
https://github.com/twigphp/Twig/issues/2275

Access block from included file

I want to access a block inside an included file.
Something like:
{#template A #}
some HTML
{% block blockA %}
{% endblock blockA %}
some HTML
{% block blockB %}
{% endblock blockB %}
some HTML
{#template B #}
{% extends A %}
{% block blockA %}
{% include C %}
some HTML
{% endblock %}
{#template C #}
{% block blockB %}
some HTML
{% endblock%}
All the HTML that i put on template C didnt go inside "blockB".
I think you are looking for embed instead of include.
Twig Documentation

Resources