How to disable HTML escaping of labels in KnpMenuBundle - symfony

I want to render an HTML label like:
$menu->addChild('Dashboard', array(
'route' => 'dashboard',
'label' => '<i class="fa-icon-bar-chart"></i><span class="hidden-tablet"> Dashboard</span></a>',
'extra' => array('safe_label' => true)
)
);
And I've pass the proper option while rendering:
{{ knp_menu_render('WshCmsHtmlBundle:Builder:mainMenu', {'allow_safe_labels': true} ) }}
But my label is still being escaped. What am I doing wrong?

Ok, the answer is!
You set up extra items on menu item not by 'extra' key but by 'extras' key.
So when you setup the item like this:
$menu->addChild('Dashboard', array(
'route' => 'dashboard',
'label' => '<i class="fa-icon-bar-chart"></i><span class="hidden-tablet"> Dashboard</span></a>',
'extras' => array('safe_label' => true)
)
);
it works fine!

There's two steps to achieve this.
1. MenuBuilder
You have to set safe_label to true in extras. Note that you can now write HTML in your label.
$menu->addChild('Home<i><b></b></i>', array(
'route' => 'homepage',
'extras' => array(
'safe_label' => true
),
));
2. Twig
You have to filter the output of knp_menu_render() so that it prints raw HTML (see documentation).
{{ knp_menu_render('main', {'allow_safe_labels': true}) | raw }}
Warning
Please be aware that this may be dangerous. From the documentation:
Use it with caution as it can create some XSS holes in your application if the label is coming from the user.

I used FyodorX's method to add a strong tag. It works like a charm but I must say that the raw filter is not necessary

Related

Drupal 9 How to add pager with entityQuery

We've a Drupal 9 installation and are trying to add a pager using the pagerer module for articles entityQuery, the aim is to list tagged articles in a tag page, but it’s not working. It returns null.
When we dump the data without the pager, using default drupal query, it returns the data of all tagged articles properly.
The code is added in the theme file themeName_preprocess_page hook and being called in page--page.html.twig template file.
Here’s our code:
$query = \Drupal::entityQuery('node')
->condition('status', 1)
->condition('type', 'article');
->pager(2);
$nids = $query->sort('created', 'DESC')
->execute();
if($nids):
$nodesNews = \Drupal\node\Entity\Node::loadMultiple($nids);
$pathNews = base_path();
$pager = [
'articles_data' => $nodesNews,
'results' => [
'#theme' => 'news_pagination',
'#items' => $nodesNews,
'#path' => $pathNews,
'#tag' => $tag
],
'pager' => [
'#type' => 'pager',
'#quantity' => 5
],
];
return $pager;
endif;
And here is the code that calls the query:
<div>
{{ articles_data }}
{{ pager }}
</div>
The above code returns only one page in the navigation and we’ve 10 articles, so given that we set 2 articles per page, the output should be 5 pages instead of 1.
Also articles_data attribute returns null. Could you please help me to find what’s wrong with the code? Happy to share more information as needed, thank you.
Just reading the docs for this module here,
it would seem that you are missing at least the #theme and #style keys in your render array for the pager.
A more likely to succeed version of the above render array would be
$pager = [
'articles_data' => $nodesNews,
'results' => [
'#theme' => 'news_pagination',
'#items' => $nodesNews,
'#path' => $pathNews,
'#tag' => $tag
],
'pager' => [
'#type' => 'pager',
'#theme' => 'pagerer_base',
'#style' => 'standard',
'#config' => [
'display_restriction' => 0,
],
'#quantity' => 5
],
];

A2LiX Translation Form labels options

I'm using KnpLabs/DoctrineBehaviors/Translatable and A2LiX Translation Form to translate my entities in a Symfony application. It works very well. However, when the form is rendered there is a "translations" title that I would like to delete and a "EN [Default]" text on a tab that I would like to change.
In the examples of the doc, there's a "medias" example so I imagine that we can change this text. Moreover, the tabs don't have this [Default] text. So I imagine that's possible to change them.
And this is mine:
Does anybody know how to do it? If we take a look on the form type options we don't see anything concerning the "Translations" label. For the "Default", I can't see where I should search for it.
Default template file is located at vendor/a2lix/translation-form-bundle/A2lix/TranslationFormBundle/Resources/views/default.html.twig. If you want you can specify your own template and set it in config.yml file, like this:
a2lix_translation_form:
....
templating: "#SLCore/includes/translation.html.twig"
More information can be found here.
For the "translations" title, I was able to override it adding a label to the form type just like a normal field. However, it is not possible to use a blank value. I had to use ' ' in order to override the text.
->add('translations', 'a2lix_translations', array(
'label' => ' ', --> this overrides the translations title
'fields' => array(
'name' => array(
'field_type' => 'text',
'label' => 'blabla'
),
'description' => array(
'field_type' => 'textarea',
'label' => 'bleble',
)
)
))
For the "Default" label, I still have no solution.

Custom Symfony ChoiceList way of rendering choices (grouped in divs)

I have a choice form field that has a lot of options that I need to group somehow so that they will be rendered divided in groups, maybe placed inside different divs.
I'm currently trying to implement the ChoiceListInterface to achieve that, but I don't know how to implement the methods so I can render the choices divided by groups, but the docs does not clarify how to do that..
The choices always get rendered together.
You have this array
$grouped_choices = array(
'Swedish Cars' => array(
'volvo' => 'Volvo',
'saab' => 'Saab',
),
'German Cars' => array(
'mercedes' => 'Mercedes',
'audi' => 'Audi'
)
);
First way: quick and simple
$builder->add($name, 'choice', array(
'choices' => $grouped_choices),
)
But I don't thinks it works with 'expanded' => true
So there is another way, more customizable (maybe more dirty)
In your FormType
foreach($grouped_choices as $name => $choices) {
$builder->add($name, 'choice', array(
'choices' => $choices),
'expanded' => true, //custom the widgets like you wants
);
}
Let the controller send the array to the view, then in the view
{% for name, choices in grouped_choices %}
<div class="whatever">
{{ form_row(name) }}
</div>
{% endfor %}

Show labels for datetime form fields in Symfony2

I'm using Symfony2.1 (beta). I can't find a way to display labels for datetime fields in forms.
In the reference there is no trace of a label property. How can it be?!
You can show the label of a field "myDate" for example like this:
<div>
{{ form_label(form.myDate, 'Choose a date: (this is the label sentence)') }}
</div>
(Documentation: http://symfony.com/doc/current/book/forms.html)
You can also personalize your form render: http://symfony.com/doc/current/cookbook/form/form_customization.html
Try this. I use it every time and works like a charm. Maybe docs bug?
$builder->add('creation_date', 'date', array(
'label' => 'Creation date',
));
I had same issue with Symfony 2.7
I fixed this way:
->add('issuedAt', 'date', array( 'label_render' => true,
'show_child_legend' => false,
'label' => 'Issued at date:',
...

Custom styles for Wordpress TinyMCE

I've read several tutorials for adding custom styles to the WYSIWYG (TinyMCE) editor. None of them seem to work in the newest version(s) of Wordpress. I'm using v3.3.2. The instructions from the codex work, but in a limited way...
NOTE: To be 100% clear, I'm trying to add a "Styles" dropdown which the author can use to apply my custom styles to the text. (Please don't confuse my question with how to style the editor its self, using editor-style.css... )
I managed to get the code working, but only using the commented-out line in my_mce_before_init(). The problem with this version is that it adds the class with a generic <span>. I'm trying to use the more powerful version of the code (as shown below), but something isn't quite right. The styles drop-down box appears, but it's blank. If I click it the first item is says "Styles" but does nothing. I suspect there's something off about my array. Hopefully someone more knowledgeable than me can set me straight.
Here's the relevant code in my theme's functions.php...
Here's how I add the button:
// Add the Style selectbox to the second row of MCE buttons
function my_mce_buttons_2($buttons)
{
array_unshift($buttons, 'styleselect');
return $buttons;
}
add_filter('mce_buttons_2', 'my_mce_buttons_2');
Here's how I add the styles (it works when I uncomment the ):
//Define the actual styles that will be in the box
function my_mce_before_init($init_array)
{
// add classes using a ; separated values
//$init_array['theme_advanced_styles'] = "Section Head=section-head;Sub Section Head=sub-section-head";
$temp_array['theme_advanced_styles'] = array(
array(
'title' => 'Section Head',
'block' => 'h3',
'classes' => 'section-head'
),
array(
'title' => 'Sub Section Head',
'block' => 'h4',
'classes' => 'sub-section-head'
)
);
$styles_array = json_encode( $temp_array['theme_advanced_styles'] );
// THIS IS THE PROBLEM !!!! READ BELOW
$init_array['theme_advanced_styles'] = $styles_array;
return $init_array;
}
add_filter('tiny_mce_before_init', 'my_mce_before_init');
UPDATE: I figured it out (see my answer below). Before you scroll down, notice in the code above, theme_advanced_styles is the wrong key. It should be style_formats when defining the custom styles in the way that I'm doing. I suspect this is a common mistake.
It seems you're using this (awesome) tutorial: http://alisothegeek.com/2011/05/tinymce-styles-dropdown-wordpress-visual-editor/
Worked great for me so I compared your code with mine: it seems you lack a
'wrapper' => true
as a fourth parameter to each sub-array. This is needed for adding a class on a parent element of your selection (it can broaden your selection) and not creating a new element around your exact selection before adding it a class.
Thus if you select part of a paragraph or part of 2 paragraphs, it'll select the whole paragraph(s) (not so sure about the 2 paragraphs thing, please test :) but at least it won't create inline element around your exact selection).
From the documentation (above link):
wrapper [optional, default = false]
if set to true, creates a new block-level element
around any selected block-level elements
My customization:
$style_formats = array(
array(
'title' => 'Column',
'block' => 'div',
'classes' => 'col',
'wrapper' => true
),
array(
'title' => 'Some div with a class',
'block' => 'div',
'classes' => 'some_class',
'wrapper' => true
),
array(
'title' => 'Title with other CSS',
'selector' => 'h3',
'classes' => 'other_style'
),
array(
'title' => 'Read more link',
'selector' => 'a',
'classes' => 'more'
)
);
Hope it works for you
AHA!
I found the problem: the two different versions of defining the custom classes must be added to different keys in the settings array.
This version...
"Section Head=section-head;Sub Section Head=sub-section-head";
...needs to be the value of 'theme_advanced_styles'.
Whereas this version...
$style_formats = array(
array(
'title' => 'Column',
'block' => 'div',
'classes' => 'col',
'wrapper' => true
),
);
...needs to be the value of 'style_formats' in the TinyMCE settings array.
I had changed to the second style but hadn't noticed the different key for the array.
Wordpress provides a function for adding a custom stylesheet to the editor: http://codex.wordpress.org/Function_Reference/add_editor_style

Resources