Following the Theme Tutorial I have a user/themes/mytheme/templates/partials/base.html.twig file in my theme. As it is a modular theme, I further have another file user/themes/mytheme/templates/modular.html.twig that doesn’t extend base.html.twig and a couple of “specialized” templates extending modular.html.twig.
The most important thing is, that neither modular.html.twig nor any of its subclasses has a connection to the html <head>.
Now it happens that one of my modules needs some things added to the <head> (in my case it’s some JavaScript but more general it could be anything). This leads to my question:
Is there a clean way to add stuff to the head from a typical module twig?
Of course on solution would be to make a module template that inherits from base.html.twig but as this link would be rather synthetical I wouldn’t find this practice very elegant.
Thanks for sharing! However, I think I don’t understand that completely.
Using this snippet, how would I be able to add stuff to the <head>...</head> section of the page from within a module template (which has no head block)?
ohh, no it’s totally my fault, I read your first post too quickly. I thought you were wanting to add metatag.
For javascript, if the javascript you want to add is not too heavy, I would rather add it on every page, and thanks to pipelining, it might not affect your overrall performance too much.
You also have a few other solution:
add these js files conditionnally with an if statement.
add inline js
add it via your modular file and process it in the footer via the asset manager.
Another option would be to load the js directly in the body.
However, my case sometimes is a bit more difficult because:
some of the parameters passed to the js are related to the information in the module - therefore I cannot run the entire js in the page head (without knowing these parameters)
the js needs to be loaded before the rest of the DOM - therefore I still need to run it in the head
To be more precise, the js I want to use is from google maps and looks like this:
@paulmassendari - I tried that too, doesn’t work when the js is in the body
@flaviocopes - I saw that plugin. However, I’d like to keep my theme general, so I can maybe release it for public use later. Therefore I’d like to avoid implicit dependencies. Is there a way to make the theme install the plugin automatic (like an explicit dependency)? This would be an acceptable solution.
Otherwise I could still make modular.html.twig inherit from base.html.twig and remove everything but keep the javascript block. However, this would be more like an ugly hack than a good solution…
Thank you so far! Of course I would prefer a standalone solution, but this is already a very good way to go. This even more as Admin 1.1 will probably be released soon.
If you (or anyone else) can think of a theme-only solution - please let me know
If I could store and append an array of javascripts to the pages object from within a twig template, I could also loop through this array in the base.html.twig. Another possibility (although not as good) would be to store that array in the page object of the current page.
To do so, I would need the twig-syntax to store something to an existing object. Can you help me with that?
And do you see any reason why this would (not) work?