Unable to load script partial into an html header - twig

I'm currently working on integrating google analytics into a project. However, when I try to load the partial with the <script> code the partial is not loaded into the HTML template.
base.twig
##
{{ function('wp_head') }}
{% block head_extras %}
{% include 'partials/scripts-google-analytics.twig' %}
{% endblock %}
</head>
If I open the developer tools, the page loads but the code within the script is not added.
here is the script for partials/scripts-google-analytics.twig
{% if function('getenv', 'YOUR_API_KEY') != '' %}
<script async src='https://www.googletagmanager.com/gtag/js?id={{ function('getenv', 'GOOGLE_ANALYTICS') }}'></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', "{{ function('getenv', 'YOUR_API_KEY') }}");
</script>
{% endif %}
How can I add a partial to the head tag?

Related

How to integrate Symfony 6 form with proper style into EasyAdmin 4?

I have a logic that wouldn't be easy to implement in EasyAdmin so I decided that I implement it in Symfony 6 then integrate it into EA. The integration worked like a charm but I can't figure out which form_theme should I use to look like the other EA forms.
I have created a form type which doesn't belong to any entity since multiple entities will be generated after the validation based on the input data.
This is the controller
<?php
namespace App\Controller\Admin;
use App\Form\Type\NewTextType;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;
class TextController extends AbstractController
{
#[Route('/admin/text/new', name: 'new_text')]
public function new(): Response
{
$defaultData = [];
$form = $this->createForm(NewTextType::class, $defaultData);
if ($form->isSubmitted() && $form->isValid()) {
$data = $form->getData();
// process the data and persist them as different entities
// redirect to the empty form and do it again
}
return $this->renderForm('admin/text/new.html.twig', [
'form' => $form,
]);
}
}
and the template
{% extends '#EasyAdmin/page/content.html.twig' %}
{% form_theme form 'foundation_5_layout.html.twig' %}
{% block content_title %}
<h1 class="title">Add new Text</h1>
{% endblock %}
{% block main %}
{{ form(form) }}
{% endblock %}
Unfortunately it looks like a crap.
It looks better if I replace foundation_5_layout with {% form_theme form 'bootstrap_5_layout.html.twig' %} but then the appearance setting is not applied even though it is presented in the BODY tag:
data-ea-dark-scheme-is-enabled="true"
What do I miss here?
I use Symfony 6.1.2 and EasyAdmin 4.3.2
Finally I have found the right template which supports the Light/Dark appearance:
{% form_theme form '#EasyAdmin/crud/form_theme.html.twig' %}
The whole template
{% extends '#EasyAdmin/page/content.html.twig' %}
{% form_theme form '#EasyAdmin/crud/form_theme.html.twig' %}
{% block content_title %}
<h1 class="title">Add new Text</h1>
{% endblock %}
{% block main %}
{{ form(form) }}
{% endblock %}

Simple Drupal 8 Facebook login JS code integration in twig template

I am writing a custom module for login using social network websites like Facebook, Gmail, Twitter. I have started with facebook first. I have followed all facebook login Quick Start Steps to get the code js from facebook to integrate in my website.
I am using Drupal 8 for this, I have copied all the code to the TWIG template. I don't know if anything I missed here, I can't get the facebook login button on web page. Can any one highlight my mistakes? Am looking into Network tab of Chrome browser, I can see https://connect.facebook.net/en_US/sdk.js is getting loaded and there are no errors listed.
This is my html.twig file.
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'MyappId',
cookie : true,
xfbml : true,
version : '3.3'
});
FB.AppEvents.logPageView();
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function checkLoginState() {
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
}
</script>
<h2><b>Choose login method</b></h2>
<ul>
{% for methods in items %}
{% if methods.id == 1 %}
<li>
<fb:login-button
scope="public_profile,email"
onlogin="checkLoginState();">
</fb:login-button>
{{ methods.name }}
</li>
{% endif %}
{% if methods.id == 2 %}
<li> GMAIL image {{ methods.name }}</li>
{% endif %}
{% if methods.id == 3 %}
<li> TWITTER image {{ methods.name }}</li>
{% endif %}
{% endfor %}
</ul>

Dynamic nav-bar elements - passed from Flask to Jinja - inherited layout template

Environment: Python 3.6, Flask 1.02, Jinja2
Objective:
Create a dynamic menu in layout.html (which is extended by content.html)
yet the url_for of the dynamic element is frequently requires a parameter to be passed
Issue statement:
How can I pass the parameters for url_for in Jinja template when rendering the template?
I feel like I would need the syntax of str().format in Jinja..
I tried to:
1. pass each part as a separate value:
menus = [{'url': 'func_name', 'menu_title': 'title', 'param': 'param_name', 'param_val': 'param_value'}]
return render_template('content1.html', menus=menus]
in jinja I tried to call it like: (I also tried it without the plus and double-quotes)
{{ url_for(func_name), param_name+ "=" + param_val }}
During rendering it gives error of
url_for() takes 1 positional argument but 2 were given
2. tried to use the {% set var_name: passed_variable %}
Built on 1st version of menus defined on server side, I tried to set the variables within Jinja, but also failed.
menus = [{'url': 'func_name', 'menu_title': 'title', 'param': 'param_name', 'param_val': 'param_value'}]
return render_template('content1.html', menus=menus]
Jinja
{% for menu in menus %}
{% set url = menu.get('url') %}
{% set param = menu.get('param') %}
{% set value = menu.get('param_val') %}
{% url_for(url, param + "=" + value %}
Yet it also didn't work.
It feels like if I give a param for the url_for syntax (not a hard-wired string) I cannot add the parameters.
3. tried to pass whole content of url_for as a string:
menus={'url_string': " 'func_name', param_name=param_value"}
yet it fails again as url_for syntacs put the whole between apostrophes, which I wouldn't need at the end.
Some references I scanned through.
Flask context-processor
It could work if I would create another template of each nav-bar for each content page - yet with that move i could simply move the navbar into the content page. However that seems dull. Stack Overflow topic
Thus question:
How can I pass the
param_id=paramval['id']
for the url_for syntax during rendering
{{ url_for('edit_question', param_id=paramval['id']) }}
The code/structure stg like below:
layout.html
<html>
<body>
{% for menu in menus %}
{% for key, value in menu.items() %}
<a href="{{ url_for(value) }}" >
{{ key }}
</a>
{% endfor %}
{% endfor %}
{% block content %}
{% endblock %}
</body>
</html>
content1.html
{% extends 'layout.html' %}
{% block content %}
content
{% endblock %}
content2.html
{% extends 'layout.html' %}
{% block content %}
content
{% endblock %}
app.py
#app.route('/')
def index():
menus = [{'menu_title1': 'menu_func_name1'}]
return render_template('content1.html', menus=menus)
#app.route('/menu_details/<int:menu_nr>')
def show_details_of_menu(menu_nr):
menus = [{'menu_title3': 'menu_func_name3', 'menu_param_name': 'menu_param_value'}
return render_template('content2.html', menus=menus)
sorry for the Wall of text..
sigh.. after hours I just found how to construct the syntax. I hope it will help others!
During rendering:
menus = [{'url': 'func_name', 'menu_title': 'title', 'parameters': {'param1': param1_value}}]
return render_template('context.html', menus=menus]
In Jinja, I adjusted the syntax to manage cases where no parameters are needed:
{% for menu in menus %}
{% if menu.get('parameters').items()|length > 0 %}
<a href="{{ url_for(menu.get('url'), **menu.get('parameters')) }}">
{{ menu.get('menu_title') }}
</a>
{% else %}
<a href="{{ url_for(menu.get('url')) }}">
{{ menu.get('menu_title') }}
</a>
{% endif %}
{% endfor %}

Set an object with Twig into a template thats imported via another template?

Im including a link.twig into block.twig, and block.twig into page.twig. in my set options is there a way I can change the link objects name to something like heroLink?
I need to set options within page.twig. link.twig is included into other templates so I dont want to change it (eg changing link.url to heroLink.url).
In my page:
{% set options = {
title: 'my title',
link: {
text: 'Search',
url: "www.google.com"
}
}
%}
{% include "block.twig" with options %}
In block.twig:
<div class="something">
<h2>{{ title }}</h2>
<div class="hero">
{% include "link.twig" with {'style': 'primary'} %}
</div>
</div>
In link.twig:
{{ link.text }}
The reason for this is that block.twig actually has other links. link.twig may be imported multiple times. As the mock object needs to be created in page.twig something like heroLink makes a lot more sense in this context.
In my page:
{% set options = {
action: {
text: 'Action',
url: "action.com"
}
}
%}
{% include "component.twig" with options %}
In component.twig:
{% import "link.twig" as mainLink %}
{{ mainLink.link(action.url, action.text) }}
In link.twig
{% macro link(url, text) %}
{{ text }}
{% endmacro %}

Twig, variable inside javascripts block

{% set url = '#ApiBundle/Resources/public/js/themes/'~theme~'.js' %}
{%javascripts
'#ApiBundle/Resources/public/js/highcharts-3d.js'
{{url}}
%}
<script src="{{asset_url}}"></script>
{%endjavascripts%}
I have the following code that gives an error, how can I make it work?

Resources