Where does Twig's ease of use come from?

R

Roman2015-06-16 22:28:17

PHP

Roman, 2015-06-16 22:28:17

Good evening, friends. I started to develop a heavy project a long time ago, and I ran into a problem. Still, I would like the blocks from the topbar and sidebar layout to be in separate files, and all sorts of canoe and hash happened in them. A template engine came to the rescue, but I have no idea how to use it, despite the described simplicity. The functionality also implies the addition of blocks, but what is their meaning if the blocks are defined in the base template and are already propagated from it to other files? For example, in the base there is a content block , and in the child, which overrides it, as well as the magical inheritance of the base template {% extends %}. Then you need to refer to the child template, because it is from there that everything else is called? That's all I understood. The most helpful is{% include 'topbar.html.php' %}So how then to describe the skeleton, using the full power of the template engine, and not the includers? Thank you. I am reading the documentation.

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

D

Denis, 2015-06-16
@Exotic33

{#- /views/header.twig -#}
<div>
    <div class="left">
        {% include "/views/header/left" %}
    </div>
    <div class="right">
        {% include "/views/header/right" %}
    </div>
</div>

{#- /views/header/left.twig -#}
<ul>
    <li><a href="#!">Link</a></li>
    <li><a href="#!">Link 2</a></li>
</ul>


{#- /views/header/right.twig -#}
<p class="text-left">Right</p>


{#- /views/base.twig -#}
<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>{% block title %}Hello!{% endblock %}</title>
    </head>
    <body>
        <div class="row">
            <div class="col-md-2">
                {% include "/views/header.twig" %}
            </div>
            <div class="col-md-10">
                {% block content %}{% endblock %}
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                {% block footer %}{% endblock %}
            </div>
        </div>
    </body> 
</html> 


{#- /views/ajax.twig -#}
{% block content %}{% endblock %}




{#- /views/pages/base.twig -#}
{% extends "/views/base.twig" %}
{% block title %}
    Welcome.
{% endblock %}
{% block content %}{% endblock %}
{% block footer %} (c) 2015 {% endblock %}




{#- /views/pages/blog/index.twig -#}
{% extends app.isAjax() ? "/views/pages/ajax.twig" : "/views/pages/base.twig" %}
{% block title %}
    {{ parent() }} This best blog.
{% endblock %}
{% block content %}
    <h1>Header</h1>
    <p>Content text</p>
{% endblock %}
{% block footer %}{#- remove parent -#}{% endblock %} 


Что тут происходит.
При рендере /views/pages/blog/index.twig 
шаблонизатор будет подниматься вверх.

В нём переопределяем footer, дополняем title.
title  = "??? This best blog."
footer = ""
content = "<h1>...."

index (проверка переменной) +-> ajax.twig -> вывод
                            |
                            | or
                            |
                            +-> page/base.twig + 
                                               |
      +----------------------------------------+
      |      Тут по пути уже к базовому шаблону переопределяем footer и title
      |      title  = "Welcome. This best blog."
      |      footer = ""
      |      content = "<h1>...."
      |
      v                 А тут уже include
      base.twig - - - > header.twig - + - - > left.twig
      |                               + - - > right.twig
      v
    вывод


+---------------------------------------+
| +-----------------------------------+ |
| |                                   | |
| | +--------------+ +--------------+ | |
| | | left         | | right        | | | header
| | +--------------+ +--------------+ | |
| |                                   | |
| +-----------------------------------+ |
| |                                   | |
| | +----------------------------+    | | base | ajax
| | | Welcome. This best blog.   |    | | title
| | +----------------------------+    | |
| |                                   | |
| | +----------------------------+    | |
| | |  Header                    |    | | content
| | |  Content text              |    | |
| | +----------------------------+    | |
| |                                   | |
| +-----------------------------------+ |
+---------------------------------------+

In addition to the simple hierarchy of blocks, there are a lot of interesting things in the template engine.
Just have time to read the documentation ...
Shl. By default, for some reason, html highlighting is here. (rave)