Magento 2の管理者商品グリッドにフロントエンド商品URL列を追加する方法

目次

  1. はじめに
  2. フロントエンドURL列の実装
  3. 異なる商品タイプの扱い
  4. 結論
  5. FAQ

はじめに

Magento 2の管理者商品グリッドに直接商品ページへのリンクを簡単に追加できる方法があれば便利だと思ったことはありませんか？もし思ったことがあるなら、あなただけではありません。効率的に商品リストを管理することは、Eコマースビジネスを運営する上で重要な側面です。ストアマネージャーや開発者からは、管理者商品グリッドにフロントエンド商品URL列を追加して操作を効率化する機能の要望がよくあります。

このブログ記事では、Magento 2にこの機能を実装する手順をステップバイステップで説明します。必要なファイルの設定、異なる商品タイプの扱い、すべての商品に正しく表示されるURLを確認します。この記事を読み終えるころには、Magento 2の管理者インターフェースを強化し、商品管理をより直感的で効率的に行える知識を持つことができるようになるでしょう。

フロントエンドURL列の実装

Magento 2の管理者商品グリッドにフロントエンド商品URL列を追加するには、いくつかのファイルを作成または変更する必要があります。このゴールを達成するために、各ステップを解説していきます。

ステップ1：構成ファイルの更新

まず、etc/adminhtmlディレクトリ内の必要なファイルを設定します。具体的にはdi.xmlとmodule.xmlファイルに取り組む必要があります。

etc/adminhtml/di.xml

次のコードをdi.xmlに追加することで、カスタム列クラスを宣言します。

<type name="Magento\Catalog\Ui\Component\Listing\Columns\ProductActions">
    <arguments>
        <argument name="data" xsi:type="array">
            <item name="js_config" xsi:type="array">
                <item name="component" xsi:type="string">Vendor\Module\Ui\Component\Columns\ProductGrid</item>
            </item>
        </argument>
    </arguments>
</type>

この設定により、Magentoが製品グリッドでカスタム列コンポーネントを使用できるようになります。

etc/adminhtml/module.xml

module.xmlファイルにカスタムモジュールのセットアップが含まれることを確認してください。

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Vendor_Module" setup_version="1.0.0">
        <sequence>
            <module name="Magento_Catalog"/>
        </sequence>
    </module>
</config>

このスニペットでは、カスタムモジュールとそのバージョンを宣言し、Magentoがセットアップとアップグレード中にそれを認識するようにします。

ステップ2：カスタム列クラスの追加

次に、フロントエンドURLを生成するためのロジックを処理するためのカスタム列クラスを作成します。このクラスはデフォルトのMagento\Ui\Component\Listing\Columns\Columnクラスを拡張する必要があります。

Ui/Component/Columns/ProductGrid.php

モジュールのUi/Component/ColumnsディレクトリにProductGrid.phpファイルを作成します。

namespace Vendor\Module\Ui\Component\Columns;

use Magento\Ui\Component\Listing\Columns\Column;
use Magento\Framework\UrlInterface;
use Magento\Store\Model\StoreManagerInterface;

class ProductGrid extends Column
{    
    protected $urlBuilder;
    protected $storeManager;

    public function __construct(
        UrlInterface $urlBuilder,
        StoreManagerInterface $storeManager,
        ... //他の必要な依存関係
    ) {
        $this->urlBuilder = $urlBuilder;
        $this->storeManager = $storeManager;

        parent::__construct(...);
    }

    public function prepareDataSource(array $dataSource)
    {
        if (isset($dataSource['data']['items']))
        {
            foreach ($dataSource['data']['items'] as &$item)
            {
                $item[$this->getData('name')] = $this->storeManager->getStore()->getBaseUrl() . 'catalog/product/view/id/' . $item['entity_id'];
            }
        }
        return $dataSource;
    }
}

このクラスはMagentoのURLビルダーとストアマネージャーを使用して、各商品に適切なフロントエンドURLを生成しています。

ステップ3：UIコンポーネントで列を定義する

最後に、モジュール内のproduct_listing.xmlファイルを更新して新しい列を追加します。

view/adminhtml/ui_component/product_listing.xml

グリッドのレイアウトに新しい列を追加します。

<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Ui/etc/ui_configuration.xsd">
    <columns name="product_columns">
        <column name="frontend_url" class="Vendor\Module\Ui\Component\Columns\ProductGrid">
            <settings>
                <label translate="true">フロントエンドURL</label>
                <sortable>false</sortable>
            </settings>
        </column>
    </columns>
</listing>

この設定は、ProductGridクラスが新しい列を描画するために使用されることを指定し、「フロントエンドURL」としてラベル付けしています。

異なる商品タイプの扱い

Magentoの異なる商品タイプ（設定可能、バンドル、グループ）には、親子関係がある場合がありますので、注意が必要です。商品の表示に基づいてURLが正しくフォーマットされ表示されるようにしてください：

  1. 設定可能商品：子商品のURLが親商品ページにリンクするようにします。
  2. バンドル商品：設定可能商品に似て、URLはメインのバンドル商品ページにリンクするようにします。
  3. グループ商品：グループ化された商品のURLを表示し、関連するすべての商品がグループ化されたエンティティの下に表示されるようにします。

これらの使用例に対処するには、ProductGrid.php内のロジックを拡張し、商品タイプを確認してURLの生成方法を調整する必要がある場合があります。

結論

Magento 2の管理者商品グリッドにフロントエンド商品URL列を追加すると、商品リストを効率的に管理し、効率よくナビゲートする能力が大幅に向上します。ここで説明した手順に従うことで、異なる商品タイプを考慮し、各商品に対して正確なURLの表示を実現できるようになります。

この機能を追加するためには、設定ファイルの変更、カスタムグリッドロジックの追加、ユーザインターフェースコンポーネントの更新など、Magentoの強力なフレームワークを拡張するのに必要な重要な部分を修正する必要があります。

FAQ

どのようにして、すべての商品タイプに適切にURLが表示されるようにできますか？

設定可能、バンドル、グループのような異なる商品タイプを扱うには、ProductGrid.phpクラス内のロジックを拡張します。子商品を扱う場合には、URLが正しく親商品ページにリンクするようにしてください。

URLが正しく表示されない場合はどうすればよいですか？

ProductGrid.phpのロジックを再度確認し、依存関係のインジェクションが正しく設定されているかを確認してください。また、product_listing.xmlが新しい列の設定を正しく含んでいるかを確認してください。

この列をソート可能にすることはできますか？

デフォルトでは、フロントエンドURL列は簡単にするためにソート不可に設定されています。ソート可能にする場合は、URLが一貫してフォーマットされていることを確認し、product_listing.xmlファイルの列設定を更新してください。

これらのステップを実施することで、Magento 2の管理者商品グリッドを強化し、管理業務をより効率的かつ効果的に行うことができます。