How do I translate a whole page into another language in Symfony2? - symfony-2.1

I want to translate a whole html page (text and some markup) including <p>,<italic>, <strong> tags in Symfony2. For simple phrases I use {{ 'read.first'|trans }} but this does not accept html tags like <p>. How do I do that ?

You shouldn't translate complete pages with the Translation component of symfony, that is meaned for just short strings.
Twig always escapes tags in strings, you can read in the translation docs how to disable this for your translations:
Using the translation tags or filters have the same effect, but with one subtle difference:
automatic output escaping is only applied to variables translated using a filter. In other
words, if you need to be sure that your translated variable is not output escaped, you must
apply the raw filter after the translation filter:
{# text translated between tags is never escaped #}
{% trans %}
<h3>foo</h3>
{% endtrans %}
{% set message = '<h3>foo</h3>' %}
{# a variable translated via a filter is escaped by default #}
{{ message|trans|raw }}
{# but static strings are never escaped #}
{{ '<h3>foo</h3>'|trans }}

Related

Mustache and Twig: not escaping HTML

I've got Twig and Mustache combined. Since they both use same tags for bookmarks
{{ var }}
I changed Mustache tags, like this
Mustache.parse(template, ['${', '}']);
So I use this bookmark in Mustache
${ var }
And there are no conflicts.
The problem comes out when I need to tell Mustache not to escape HTML. As the Documentation says, I am to use
{{{ do_not_escape_this_var }}}
But this leads to a conflict with Twig! And It seems like there is no way tu customize it.
I know I could override Twig's bookmarks, but this is bad for the frontend team, used to Twig default tag.
Any solutions? Thank you
Like the Twig's documentation says, code can be escaped like this:
{{ '{{{ do_not_escape_this_var }}}' }}
For larger blocks of code, you can use verbatim to prevent Twig from parsing Mustache code as Twig code:
{% verbatim %}
{{{ do_not_escape_this_var }}}
{% endverbatim %}
With verbatim, you could also avoid parsing chunks of Mustache code with the default Mustache tags:
{% verbatim %}
<h1>Hello {{ name }}!</h1>
<p>How are you {{ today }}?</p>
{{! This is just Mustache, not Twig }}
{% endverbatim %}
Of course, then you can't use Twig between {% verbatim %} and {% endverbatim %}. I don't think it's a problem as mixing Mustache (with the default tags) and Twig code would be very confusing.

Automatically declare variables used in Twig template

I am refactoring some old twig templates, where many variables are passed to the templates but not declared in doc comments (which also work in PhpStorm for type hinting), like this:
{# #var user AppBundle\Entity\User #}
{# #var message string #}
<p>Hello {{ user.fullName }}!</p>
<p>{{ message }}</p>
Is there a tool that can pre-generate these doc comments from variables used in a template, ideally usable as PhpStorm plugin?
It will be good enough if it would extract just variable names without types (which are hard to guess from Twig syntax), just for me to make sure that I have not overlooked some variables.
Also, it will be great if it would not declare variables created in the template, like this:
{# #var users AppBundle\Entity\User[] #}
{# "user" variable is not documented as it is not passed into the template from outside #}
{% for user in users %}
<p>Hello {{ user.fullName }}!</p>
{% endfor %}
Such comments are helpful not only for type hinting, but also for the developer to see what should be passed into the template when refactoring/reusing the template.
Thanks in advance.
As far as I can see there's unfortunately nothing that IDE or available plugins could suggest for your use case.

How to push values to array in templates and partials to output them in layout?

We are using Twig as our templating engine but I'm stuck with a problem of the rendering order now. See - https://straightupcraft.com/articles/twig-processing-order
We are using amp for our new site and with amp and web components in general it is necessary to import the components (once) to use them. So the idea was to create a Twig Extension to accomplish exactly this. Everytime a component is used it is called via this twig function call. The function is checking the component, adding it to a stack and you can use it from now on. The stack then is transformed into a list of imports for the head of the page.
The problem here is Twigs top to bottom rendering. When I call said function in a partial or a template the rendering of "layout.twig" already took place and all function calls below/after are not affecting the stack.
Is there an option to change the rendering to inside out, so that the rendering is first using the lowest partial and "bubbles" up to templates and finally layout without them rendering before?
Another way to get the values in layout would nice as well.
Desired behavior:
Layout.twig
{{ getAllComponents() }}
{# should output component1 and component2 #}
{% block content %}
Page.twig
{% extends Layout.twig %}
{{ addComponent('component1') }}
{% include partials.twig %}
<component1>...</component1>
partials.twig
{{ addComponent('component2') }}
<component2>...</component2>
Actual behavior:
Layout.twig
{{ getAllComponents() }}
{# is empty #}
There is no option to change this behavior. However you can use a trick to archive this:
Render your content to a variable before you call getAllComponents()
layout.twig
{% set mainContent %}
{% block content %}{% endblock %}
{% endset %}
{{ getAllComponents() }}
{{ mainContent }}
There actually is a magical solution to this problem -- some genius wrote this Deferred Twig Extension which lets you run some code (output a variable, call a function, etc) in a block near the top of your layout, but wait until the rest of the twig templates have parsed before executing them. There's an example on that github page showing how you can achieve this.
As far as I know, no you cannot switch the rendering of a TWIG template.
However, I would recommend possibly looking at the {% embed %} or {{ render }} tags.
Embed allows specific TWIG files to be placed within others with variables, so you could pass each component into their relevant partials.twig file.
Render allows the use of embedding a separate controller action, so you create a ControllerAction that took in a component variable and renders its own TWIG file.
Documentation on Embed: https://twig.sensiolabs.org/doc/2.x/tags/embed.html
Documentation containing Render: https://twig.sensiolabs.org/doc/2.x/api.html

Combining optional block with element in twig

In defining a base template in twig, I want to reserve an area for special notifications, using a block. It could be an extra sidebar that may contain all kinds of things (calendar, or some extra information, whatever.) The default should be emtpy, but any child template may extend and fill it.
Now I want to have all those extensions be included in a <div class='special-sidebar'> if the block is extended, and not show anything if it is not included. Is there any way to define the containing element in the base template?
{# Base template #}
Content etc...
{% block special %} {# may be overridden by child template #}{% endblock %}
{# child template #}
{% block special %} Here, the special sidebar is filled! {% endblock %}
The base page should show just the content:
// base template:
Content etc...
And the child page:
// child template
Content etc...
<div class"special-sidebar"> Here, the special sidebar is filled! </div>
Where and how do I put the html for this? I could define it in every child, but that means you have to remember to use the correct html each time, I'd rather set this in the base template and not bother with it. But I don't want empty elements in my page if the block is not overridden.
You can solve it like this, if you want to display a certain block only if it has content. Hope, this is what you're looking for.
Example index.html.twig
{% set _block = block('dynamic') %}
{% if _block is not empty %}
{{ _block|raw }}
{% endif %}
Example part.html.twig
{% extends "index.html.twig" %}
{% block dynamic %}
Block content goes here.
{% endblock %}
Source: How to check if a block exists in a twig template - Symfony2

Twig - Do not interpret

I'm looking for a tag which would enable me to stop interpreting in a section, in a template.
So I'm looking for something that is similar to smarty's literal tag.
Thanks
I think you're looking for {% verbatim %} / {% endverbatim %}. In earlier versions these were called {% raw %} / {% endraw %}.
See also Twig Escaping.
In Twig, it is now verbatim, see http://twig.sensiolabs.org/doc/tags/verbatim.html

Resources