EC-CUBE3のTwigのタグ覚え書き（一部EC-CUBE2系のSmarty比較）

foreach文

• Smarty

# Valueのみ
<!--{foreach item=item from=$contact}-->
    <!--{$item}-->
<!--{/foreach}-->

# Key,Value
<!--{foreach key=key item=item from=$contact}-->
    <!--{$key}-->:<!--{$item}--><br />
<!--{/foreach}-->

• Twig

# Valueのみ
{% for item in contact %}
  {{ item }}
{% endfor %}

# Key,Value
{% for key, item in contact %}
   {{ key }}: {{ item }}
{% endfor %}

生成されるHTMLの空白除去

• Smarty
  

<!--{strip}-->
hogehoge
<!--{/strip}-->

• Twig
  

間に記載された空白を削除
{% spaceless %}
hogehoge
{% endspaceless %}

左側の空白を削除
{%- hoge %}

右側の空白を削除
{% hoge -%}

左右の空白を削除
{%- hoge -%}

コメント

• Smarty

<!--{* コメントアウトされる *}-->

• Twig
  

{# コメントアウトされる #}

If文

• Smarty
  

<!--{if hoge }-->
fuga
<!--{else}-->
piyo
<!--{/if}-->

<!--{if !hoge }-->
fuga
<!--{else}-->
piyo
<!--{/if}-->

• Twig
  

{% if hoge %}
fuga
{% else %}
piyo
{% endif %}

{% if not hoge %}
fuga
{% else %}
piyo
{% endif %}

変数をdump

• Smarty

<!--{$array|@var_dump}-->

• Twig

{{dump(hoge)}}

Twig独特の表現

テンプレートの再利用や拡張

他のテンプレートを読み込んだり、テンプレートの一部（block）を再利用したり拡張したりできる

• 他のテンプレートの読み込み（includeやrequire的な感じ）
  

{% extends 'hoge.twig' %}

• ブロックの作成

{% block hoge %}
hogehoge fugafuga
{% endblock hoge %}

• ブロックの再利用

# hogehoge fugafuga が出力される
{{ block('hoge') }}

• ブロックの拡張
  hoge blockが書かれた、hoge.twigをextendsしたテンプレートで、hoge blockを拡張する

# hoge.twigを読み込み
{% extends 'hoge.twig' %}

# hoge blockを拡張する
{% block hoge %}
fugafuga hogehoge piyopiyo
{% endblock hoge %}

# 拡張されたhoge blockを出力 fugafuga hogehoge piyopiyo が出力される
{{ block('hoge') }}

親の出力を利用する事もできる。

# hoge.twigを読み込み
{% extends 'hoge.twig' %}

# hoge blockを拡張する
{% block hoge %}
{{ parent() }} piyopiyo
{% endblock hoge %}

#  拡張されたhoge blockを出力 fugafuga hogehoge piyopiyo が出力される
{{ block('hoge') }}

特定の条件は別な物をだすblockに作りなおしたい時など、もともとのファイルを修正するのではなく、block内で、if分岐を追加するなどで対応ができるので、便利。

確認画面用の表示

form_widget では、入力フォームを作るだけでなく、form bilderでfreezeを与えて（全てHiddenになる）、確認画面等で表示するようの記述がかける。

以下の例だと、通常はテキストボックス、freezeが与えられると、{% if freeze %} 部分が出力され入力されたテキストが出力される

{% block name_widget %}
    {% if freeze %}
        {# freezeなら単なるテキスト出力 #}
        {{ form_widget(name) }}
     {% else %}
        {# 普段はテキストボックスが表示される #}
        {{ form_label(name) }} {{ form_widget(name, {'attr': {'class': 'box120', 'style': 'ime-mode: active;'}}) -}}
     {%- endif -%}
{% endblock name_widget %}