Twig – igreks開発日記

ECCUBE3の商品一覧の並び順に「お気に入り数順」を追加する

まず最初に、並び順テーブル(mtb_product_list_order_by)に新しく「お気に入り数順」を追加

（一例）
・id：4
・name：お気に入り数順(任意)
・rank：3

※optionの順番を前に持ってきたければrankの番号を減らす

/src/Eccube/Resource/config/constant.yml.dist に追加したorderbyパラメタの番号(4)に名前を定義する

  :
++ product_order_favorite_higher: 4
  :

++ product_order_favorite_higher: 4

参考）
https://github.com/EC-CUBE/ec-cube/issues/2703

/src/Eccube/Repository/ProductRepository.php に、SQLを定義する

// 新着順のセクションの後に以下を追加

// お気に入り数順
else if (!empty($searchData['orderby']) && $searchData['orderby']->getId() == $config['product_order_favorite_higher']) {
   $qb->addSelect('COUNT(cfp.id) as HIDDEN favorite_count');
   $qb->leftJoin('p.CustomerFavoriteProducts', 'cfp');
   $qb->groupBy('p');
   $qb->orderBy('favorite_count', 'DESC');
   $qb->addOrderBy('p.id', 'DESC');
}

// 新着順のセクションの後に以下を追加

// お気に入り数順

else if (!empty($searchData['orderby']) && $searchData['orderby']->getId() == $config['product_order_favorite_higher']) {

$qb->addSelect('COUNT(cfp.id) as HIDDEN favorite_count');

$qb->leftJoin('p.CustomerFavoriteProducts', 'cfp');

$qb->groupBy('p');

$qb->orderBy('favorite_count', 'DESC');

$qb->addOrderBy('p.id', 'DESC');

}

※クエリビルダーを使用する際、JOINするテーブル名やカラム名はdoctrineの定義に基づくので、 /src/Eccube/Resource/doctrine/Eccube.Entity.CustomerFavoriteProduct.dcm.ymlなどの中を確認して、同じ名前にする。

ちなみに、上記は、生のSQLとしては下記のような感じとなる。多分。

SELECT * , Count(cfp.product_id)        AS favorite_count
FROM       dtb_product                  AS p
LEFT JOIN dtb_customer_favorite_product AS cfp
ON         p.product_id = cfp.product_id
GROUP BY   p.product_id
ORDER BY   favorite_count DESC, p.product_id DESC

SELECT * , Count(cfp.product_id) AS favorite_count

FROM dtb_product AS p

LEFT JOIN dtb_customer_favorite_product AS cfp

ON p.product_id = cfp.product_id

GROUP BY p.product_id

ORDER BY favorite_count DESC, p.product_id DESC

参考）
https://xoops.ec-cube.net/modules/newbb/viewtopic.php?topic_id=17472&forum=10
https://ameblo.jp/withathena/entry-12173872626.html
https://umebius.com/eccube/sort_admin_product_master/
http://doctrine-orm.readthedocs.io/projects/doctrine-orm/en/latest/reference/query-builder.html
https://teratail.com/questions/30434
https://teratail.com/questions/43888
http://www.aiship.jp/knowhow/archives/25107
http://d.hatena.ne.jp/Fivestar/20100423/1272013815

以上で、商品一覧ページのドロップダウンに「お気に入り数順」が追加され、選択するとお気に入りに追加された数の多い商品順にソートされる。

twigのフィルターまとめ

随時更新中。

HTMLタグをエスケープ無しで出力(デフォルトではエスケープされる)

{{ html | raw }}

1	{{ html \| raw }}

参考サイト

ECCUBE3(Symfony)のテンプレート(Twig)内でのシステムURL出力

忘備録として随時更新中。テンプレ内をよく探せば出てくるのだが、、、。

トップページURL

{{ url('homepage') }}

1	{{ url('homepage') }}

カレントページ(現在アクセスしているページ)URL

{{ app.request.uri }}

1	{{ app.request.uri }}

商品一覧ページURL

{{# 基本形 #}}
{{ url('product_list') }}

{{# カテゴリ情報を付ける場合 #}}
{{ url('product_list') }}?category_id="カテゴリID"

{{# EntityでCategory.idが定義されている場合 #}} 
{{ url('product_list') }}?category_id={{ Category.id }}

{{ url('product_list') }}?category_id="カテゴリID"

{{ url('product_list') }}?category_id={{ Category.id }}

商品画像保存ディレクトリの絶対パス

{{# 基本形 #}}
{{ app.config.image_save_urlpath }}

{{# ファイル名を指定する場合 #}}
{{ app.config.image_save_urlpath }}/"画像ファイル名"

{{# EntityでProduct.ProductImageが定義されている場合 #}}
{{ app.config.image_save_urlpath }}/{{ Product.ProductImage."添え字"|no_image_product }}

{{ app.config.image_save_urlpath }}/"画像ファイル名"

{{ app.config.image_save_urlpath }}/{{ Product.ProductImage."添え字"|no_image_product }}

商品詳細ページURL

{{# 基本形 #}}
{{ url('product_detail', {'id': "商品ID") }}

{{# EntityでProduct.idが定義されている場合 #}}
{{ url('product_detail', {'id': Product.id}) }}

{{ url('product_detail', {'id': "商品ID") }}

{{ url('product_detail', {'id': Product.id}) }}

商品詳細ページでのメイン画像URL (Pinterestボタンに画像URLのパラメタ付けたい時とか)

{{ "Product.ProductImage"が商品画像のファイル名が入った配列 }}
{{ url('homepage') }}upload/save_image/{{ Product.ProductImage.0|no_image_product }}

1 2	{{ "Product.ProductImage"が商品画像のファイル名が入った配列 }} {{ url('homepage') }}upload/save_image/{{ Product.ProductImage.0\|no_image_product }}

参考サイト）

ECCUBE3でカテゴリに補足情報を追加する

EC-CUBE 3.0.16
MySQL 5.6.19
PHP 5.6.36

例として、あるカテゴリに「関連A」(assoc_A)という補足情報を追加する場合。

１．テーブルへのカラム追加
dtb_categoryテーブルへ”assoc_A”という名前のカラムをtinyintタイプで追加。また、NULLを許可にする。

２．エンティティファイルに、セッターゲッター追加
/src/Eccube/Entity/Category.php

以下のように追記。

    /**
     * @var integer
     */
    private $assoc_A;
 
    /**
     * @return string
     */
    public function getAssocA()
    {
        return $this->assoc_A;
    }
 
    /**
     * @param string $assoc_A
     * @return \Eccube\Entity\Category
     */
    public function setAssocA($assocA)
    {
        $this->assoc_A = $assocA;
        return $this;
    }

    /************************************
     ※メソッド名とその引数にアンダーバーを使うと
       エラーになるので、宣言した変数名にアンダーバー
       を含む場合は上記のように、アンダーバーを消して
       その次の文字を大文字(キャメルケース)にする。
    ************************************/

/**

* @var integer

private $assoc_A;

/**

* @return string

public function getAssocA()

{

return $this->assoc_A;

}

/**

* @param string $assoc_A

* @return \Eccube\Entity\Category

public function setAssocA($assocA)

{

$this->assoc_A = $assocA;

return $this;

}

/************************************

※メソッド名とその引数にアンダーバーを使うと

エラーになるので、宣言した変数名にアンダーバー

を含む場合は上記のように、アンダーバーを消して

その次の文字を大文字(キャメルケース)にする。

************************************/

３．データベース定義ファイルへカラム追加
/src/Eccube/Resource/doctrine/Eccube.Entity.Category.dcm.yml

fields一覧にassoc_Aの項目を追加。データベースとエンティティクラスを接続するのがdcm.yml(Doctrineマッピングファイル)。これにより、Categoryエンティティのassoc_Aとdtb_categoryのassoc_Aカラムが接続される。

       assoc_A:
            type: boolean
            nullable: true

assoc_A:

type: boolean

nullable: true

※データ型がint,smallint,tinyintでも、Formでcheckboxタイプを使う予定のため（論理型(値が1か0のタイプ)と認識されるので）ブーリアンタイプにしておく。

ECCUBE3で使用できるtype一覧は過去記事参照。

4．フォーム定義ファイルへの項目追加
/src/Eccube/Form/Type/Admin/CategoryType.php

下記のように、管理画面の商品登録フォームへ定義を追加。

$builder->add('assoc_A', 'checkbox', array(
                'label' => 'A',
                'required' => false,
                //valueはデフォルトで"1"らしい
          ));

$builder->add('assoc_A', 'checkbox', array(

'label' => 'A',

'required' => false,

//valueはデフォルトで"1"らしい

));

5．管理画面（カテゴリ登録画面）へフォーム表示
/app/template/admin/Product/category.twig

フォームを表示したい場所に下記のように記述。

{{ form_row(form.assoc_A) }}
{{## もしくは ##}}
{{ form_widget(form.assoc_A) }}{{ form_errors(form.assoc_A) }}

6．商品詳細ページへの表示
/app/template/default/Product/detail.twig

関連付けした情報を使って詳細ページでごにょごにょするには、多少の工夫が必要。これについては別途書く予定。

とりあえず以上。

参考URL）

http://symfony.com/doc/current/reference/forms/types/checkbox.html

ECCUBE3で商品に新しい項目を追加

EC-CUBE 3.0.16
MySQL 5.6.19
PHP 5.6.36

例として、商品名かな(name_kana)という項目を追加する場合。

１．テーブルへのカラム追加
dtb_productテーブルへ”name_kana”という名前のカラムをtextタイプ(またはvarchar)で追加。また、NULLを許可にする。

２．エンティティファイルに、セッターゲッター追加
/src/Eccube/Entity/Product.php

以下のように追記。

    /**
     * @var string
     */
    private $name_kana;
 
    /**
     * @return string
     */
    public function getNameKana()
    {
        return $this->name_kana;
    }
 
    /**
     * @param string $name_kana
     * @return \Eccube\Entity\Product
     */
    public function setNameKana($nameKana)
    {
        $this->name_kana = $nameKana;
        return $this;
    }

    /************************************
     ※メソッド名とその引数にアンダーバーを使うと
       エラーになるので、宣言した変数名にアンダーバー
       を含む場合は上記のように、アンダーバーを消して
       その次の文字を大文字(キャメルケース)にする。
    ************************************/

/**

* @var string

private $name_kana;

/**

* @return string

public function getNameKana()

{

return $this->name_kana;

}

/**

* @param string $name_kana

* @return \Eccube\Entity\Product

public function setNameKana($nameKana)

{

$this->name_kana = $nameKana;

return $this;

}

/************************************

※メソッド名とその引数にアンダーバーを使うと

エラーになるので、宣言した変数名にアンダーバー

を含む場合は上記のように、アンダーバーを消して

その次の文字を大文字(キャメルケース)にする。

************************************/

３．データベース定義ファイルへカラム追加
/src/Eccube/Resource/doctrine/Eccube.Entity.Product.dcm.yml

fields一覧にname_kanaの項目を追加。データベースとエンティティクラスを接続するのがdcm.yml(Doctrineマッピングファイル)。これにより、Productエンティティのname_kanaとdtb_productのname_kanaカラムが接続される。

       name_kana:
            type: text
            nullable: true

name_kana:

type: text

nullable: true

ちなみに、EC-CUBE３が採用しているSymfonyの標準ORM、Doctorineで設定できるフィールドタイプは以下の通り。

    const TARRAY = 'array';
    const SIMPLE_ARRAY = 'simple_array';
    const JSON_ARRAY = 'json_array';
    const BIGINT = 'bigint';
    const BOOLEAN = 'boolean';
    const DATETIME = 'datetime';
    const DATETIMETZ = 'datetimetz';
    const DATE = 'date';
    const TIME = 'time';
    const DECIMAL = 'decimal';
    const INTEGER = 'integer';
    const OBJECT = 'object';
    const SMALLINT = 'smallint';
    const STRING = 'string';
    const TEXT = 'text';
    const BINARY = 'binary';
    const BLOB = 'blob';
    const FLOAT = 'float';
    const GUID = 'guid';

const TARRAY = 'array';

const SIMPLE_ARRAY = 'simple_array';

const JSON_ARRAY = 'json_array';

const BIGINT = 'bigint';

const BOOLEAN = 'boolean';

const DATETIME = 'datetime';

const DATETIMETZ = 'datetimetz';

const DATE = 'date';

const TIME = 'time';

const DECIMAL = 'decimal';

const INTEGER = 'integer';

const OBJECT = 'object';

const SMALLINT = 'smallint';

const STRING = 'string';

const TEXT = 'text';

const BINARY = 'binary';

const BLOB = 'blob';

const FLOAT = 'float';

const GUID = 'guid';

4．フォーム定義ファイルへの項目追加
/src/Eccube/Form/Type/Admin/ProductType.php

下記のように、管理画面の商品登録フォームへ定義を追加。

$builder->add('name_kana', 'text', array(
                'label' => '商品名かな',
                'required' => true,
            ));

$builder->add('name_kana', 'text', array(

'label' => '商品名かな',

'required' => true,

));

上記の書き方で入力必須とならない場合（未入力で保存した際にエラーとならない）場合は、下記のようにする。

$builder->add('name_kana', 'text', array(
                'label' => '商品名かな',
                'required' => true,
                'constraints' => array(
                    new Assert\NotBlank(),
                ),
            ));

$builder->add('name_kana', 'text', array(

'label' => '商品名かな',

'required' => true,

'constraints' => array(

new Assert\NotBlank(),

));

なお、フォームの入力形式として整数型としたい場合は、第2引数に”integer”, 浮動小数点型としたい場合は、第2引数に”number”を指定するなどして対応。

このほかにも選択型(choice型)も指定できる。詳細は公式ドキュメントを参照。

5．管理画面（商品情報登録画面）へフォーム表示
/app/template/admin/Product/product.twig

フォームを表示したい場所に下記のように記述。

{{ form_row(form.name_kana) }}

1	{{ form_row(form.name_kana) }}

form_rowは、form_label、form_widget、form_errorsを同時に出力する関数。テキストの入力幅を小さくしたい場合などは、form_label、form_widget、form_errorsに分割するなどしてCSSで対応。

<!-- 入力幅を小さく -->
<div id="" class="form-group">
    {{ form_label(form.name_kana) }}
    <!-- col-sm-* col-lg-* の「*」値で調整すると簡単 -->
    <div class="col-sm-2 col-lg-2">
        {{ form_widget(form.name_kana) }}
        {{ form_errors(form.name_kana) }}
    </div>
</div>

</div>

6．商品詳細ページへの表示
/app/template/default/Product/detail.twig

フロント側で出力。好きな場所に下記のように記載。未登録であれば何も出力されない。

{{ Product.name_kana }}

1	{{ Product.name_kana }}

以上。

参考URL）

Twigの小技まとめ

文字列省略（Twig1.6以降）

{{# 32文字目まで表示して残りは...にする #}}
{{ name | length > 32 ? name | slice(0, 32) ~ '…' : name }}

1 2	{{# 32文字目まで表示して残りは...にする #}} {{ name \| length > 32 ? name \| slice(0, 32) ~ '…' : name }}

HTML参照文字エスケープ

{{ html | e }}
{{# または、#}}
{{ html | e("html") }}

リプレース

{{ "I like %this% and %that%." | replace({'%this%': foo, '%that%': "bar"}) }}

{{ "I like this and --that--." | replace({'this': foo, '--that--': "bar"}) }}

{{ "I like %this% and %that%." | replace({'%this%': foo, '%that%': "bar"}) }}

{{ "I like this and --that--." | replace({'this': foo, '--that--': "bar"}) }}

改行文字をbrに

{{ text | nl2br }}

1	{{ text \| nl2br }}

ループ

{## 基本形 ##}
{% for Product in Products %}
  ID:      {{ Product.id }}
  Name: {{ Product.name }}
{% endfor %}

{## キーだけ表示 ##}
{% for Product in Products | keys %}
  key: {{ Product }}
{% endfor %}

{## キー,値をそれぞれ取得 ##}
{% for ProductKey, ProductValue in Products %}
  key:   {{ ProductKey }}
  value: {{ ProductValue }}
{% endfor %}

{## sliceと組み合わせたり ##}
{% for key, value in ['太郎', '次郎', '三郎', '四郎', '五郎']|slice(2, 4) %}
    {{ key }}:{{ value }}
{% endfor %}
{# 0:三郎 1:四郎 2:五郎 #}

{## 基本形 ##}

{% for Product in Products %}

ID: {{ Product.id }}

Name: {{ Product.name }}

{% endfor %}

{## キーだけ表示 ##}

{% for Product in Products | keys %}

key: {{ Product }}

{% endfor %}

{## キー,値をそれぞれ取得 ##}

{% for ProductKey, ProductValue in Products %}

key: {{ ProductKey }}

value: {{ ProductValue }}

{% endfor %}

{## sliceと組み合わせたり ##}

{% for key, value in ['太郎', '次郎', '三郎', '四郎', '五郎']|slice(2, 4) %}

{{ key }}:{{ value }}

{% endfor %}

{# 0:三郎 1:四郎 2:五郎 #}

ループの中で使える便利なやつ

{## loop.lastは、最後の要素の時true ##}
{% for Product in Products %}
  ID:      {{ Product.id }}
  Name: {{ Product.name }}
  {## 最後の要素じゃなかったらコンマ出力 ##}
  {{ loop.last ? '' : ',' }}
{% endfor %}

{## loop.lastは、最後の要素の時true ##}

{% for Product in Products %}

ID: {{ Product.id }}

Name: {{ Product.name }}

{## 最後の要素じゃなかったらコンマ出力 ##}

{% endfor %}

正規表現マッチング

{# 基本形 #}
{% if Product matches '{^abc$}' %}
  match！
{% else %}
  not match！ 
{% endif %}

{# メタ文字(.や?など)エスケープ時はバックスラッシュ3つ #}
{% if Product matches '{\\\?id=1234}' %}
  match！
{% else %}
  not match！
{% endif %}

{# 基本形 #}

{% if Product matches '{^abc$}' %}

match！

{% else %}

not match！

{% endif %}

{# メタ文字(.や?など)エスケープ時はバックスラッシュ3つ #}

{% if Product matches '{\\\?id=1234}' %}

match！

{% else %}

not match！

{% endif %}

その他は随時更新。

参考URL）

https://hrroct.hatenablog.com/entry/2017/04/28/184032
https://qiita.com/assa/items/4fef2f3abd95248ed626
https://twig.symfony.com/doc/2.x/filters/replace.html
https://tetra-themes.com/eccube3-dump-498/
http://www.tomcky.net/entry/2018/02/08/010639
http://mononofu.hatenablog.com/entry/20111209/1323431291