37
37

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

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

Last updated at Posted at 2015-04-17

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) }}&nbsp;{{ form_widget(name, {'attr': {'class': 'box120', 'style': 'ime-mode: active;'}}) -}}
     {%- endif -%}
{% endblock name_widget %}
```
37
37
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
37
37

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?