更新日: 2024 / 10 / 04

EC-CUBE4でブロックやテンプレートから必要なデータを取得する方法

EC-CUBE4で新しいブロックやページを作成したとき、データベースのデータが必要になることがあります。

例えば商品情報や新着情報、レビュープラグインのレビューデータなどです。このようなデータを新しく作ったブロックやテンプレートで取得する方法を紹介します。

  1. EC-CUBE4でTwigからお知らせや商品データを取得するには?

  2. EC-CUBE4でデータを表示するには?

    1. 取得したデータの中身をチェックする方法
  3. EC-CUBE4で思い通りのネットショップを作ろう!

EC-CUBE4でTwigからお知らせや商品データを取得するには?

EC-CUBE4ではTwigを拡張するTwig Extensionが実装されています。

// src/Eccube/Twig/Extension/RepositoryExtension.php
public function getFunctions()
{
    return [
        new TwigFunction('repository', function ($entity) {
            $repository = $this->em->getRepository($entity);

            return $repository;
        }, ['pre_escape' => 'html', 'is_safe' => ['html']]),
    ];
}

この関数ではrepositoryという名前で呼び出せる関数が定義されていて、エンティティを指定することでデータを取得できます。

エンティティはsrc/Eccube/Entity/にあるもので、ブロック、カテゴリー、ニュース、商品などがあります。

この機能を使うことでTwigファイルからデータを取得できるようになります。

例えば商品情報を取得するならこのようになります。

{% set productRepository = repository('App\\Entity\\Product') %}
{% set products = productRepository.findAll() %}

また、findBy()を使って特定の条件に合ったデータを取得することもできます。

以下の例ではステータスが「公開」になっているものを新しい順に6件取得できます。

// 第1引数=where
// 第2引数=orderBy
// 第3引数=limit
{% set Products = productRepository.findBy({ Status: 1 }, { create_date: 'desc' }, 6) %}

EC-CUBE4でデータを表示するには?

repositoryでデータを取得できたらあとはTwigの関数を使って表示するだけです。

例えば商品データを一覧表示する場合はこちらのようになります。

<ul>
    {% for product in products %}
        <li>{{ product.name }}</li>
    {% endfor %}
</ul>

取得したデータの中身をチェックする方法

取得したデータからどんなデータを表示できるかはdump()関数でチェックできます。

{{ dump(products) }}

例えばタグのデータを表示したい場合はこちらのようになります。

{% set Tags = repository('Eccube\\Entity\\Tag').findAll() %}

{{ dump(Tags) }}

すると画像のように中身のデータが表示されます。

テンプレートやブロックでどうやって表示すればいいの?

結果を見ると0~2までの3つのデータが入っていることがわかります。

先ほどの商品データのようにfor文で全て書き出すこともできますが、配列の位置を指定することで直接取り出すこともできます。

// 0番目のnameを取得
{{ Tags[0]['name'] }} // 新商品

EC-CUBE4で思い通りのネットショップを作ろう!

シンプルな条件ならこの方法でデータの取得が可能になります。データを取得できるようになったらあとはTwigを使ってブロックやページにデータを表示するだけ。

あらかじめデザイン済みのテンプレートを使うことで効率よくショップを作ることができます。複数パターンのブロックを配置するだけでレイアウトを作れるのであとはデータ入れるだけです。シンプルなショップを作るときにおすすめです。

-> Bootcube2 EC-CUBE4.2&4.3対応のシンプルなデザインテンプレート