Magento 2.2.2で最近閲覧した商品をプログラムで取得する方法

目次

  1. イントロダクション
  2. 最近閲覧した商品を表示する理由
  3. 最近閲覧した商品をプログラムで取得する手順
  4. 一般的な問題のトラブルシューティング
  5. 結論
  6. よくある質問

イントロダクション

Magento 2.2.2のeコマースサイトでユーザーエクスペリエンスを向上させる方法を知りたことはありますか?最近閲覧した商品を顧客に表示することは、エンゲージメントとコンバージョン率を大幅に向上させることができます。このブログ記事では、Magento 2.2.2で最近閲覧した商品をプログラムで取得する方法をご案内し、実施しやすくするための具体的な手順とインサイトを提供します。

最近閲覧した商品をプログラムで取得する方法を理解することは、特にMagentoのデフォルト機能を超えるカスタム機能が必要な場合には非常に有益です。この記事の終わりまでに、最近閲覧した商品を取得するためのコードスニペットを実装できるようになり、ビジネスニーズに合わせてカスタマイズする方法も理解できるようになります。

以下のトピックをカバーします:

  1. 最近閲覧した商品を表示する理由。
  2. Magento 2.2.2で最近閲覧した商品を取得する手順。
  3. 一般的な問題のトラブルシューティング。

さあ、始めましょう!

最近閲覧した商品を表示する理由

最近閲覧した商品を表示することにより、ユーザーエンゲージメントが飛躍的に向上し、売上も増加することができます。この機能は、ユーザーが興味を持った商品を思い出させ、それらの商品を簡単に再訪問し、購入する可能性を高める役割を果たします。以下に、この機能の主なメリットを挙げます:

  • ユーザーエクスペリエンスの向上:最近閲覧した商品をユーザーが素早くナビゲートできるため、ショッピングプロセスをシンプルにします。
  • コンバージョン率の向上:ユーザーが商品をより多く見るほど、購入の可能性が高くなります。
  • パーソナライズされたショッピング:パーソナライズされたショッピングエクスペリエンスを提供することで、顧客満足度が向上します。

これらのメリットを考慮すると、この機能をMagentoストアに統合することは、ビジネスに大きな変化をもたらすことができます。

最近閲覧した商品をプログラムで取得する手順

1. 必要なものとセットアップ

コードに進む前に、以下の前提条件が満たされていることを確認してください:

  • Magento 2.2.2がインストールされて稼働中であること。
  • Magentoのモジュールとテンプレートファイルについての基本的な理解。
  • Magentoプロジェクトのファイルシステムにアクセスし、ファイルを追加または編集できること。

2. コードの実装

最近閲覧した商品を取得するには、特定のクラスをインポートし、Magentoが提供する事前定義されたメソッドを使用する必要があります。以下に、この機能の実装手順のステップバイステップガイドを示します:

a. 新しいブロックの作成

まず、カスタムコードが配置される新しいブロックファイルを作成します。

// app/code/YourNamespace/YourModule/Block/RecentlyViewed.php

namespace YourNamespace\YourModule\Block;

use Magento\Catalog\Block\Product\AbstractProduct;
use Magento\Reports\Model\ResourceModel\Product\CollectionFactory as ReportCollectionFactory;
use Magento\Catalog\Api\ProductRepositoryInterface;
use Magento\Framework\Data\Helper\PostHelper;

class RecentlyViewed extends AbstractProduct
{
    protected $_reportCollectionFactory;
    protected $_productRepository;
    protected $_postDataHelper;
    protected $_customerSession;
    protected $_catalogSession;

    public function __construct(
        \Magento\Catalog\Block\Product\Context $context,
        ReportCollectionFactory $reportCollectionFactory,
        ProductRepositoryInterface $productRepository,
        PostHelper $postDataHelper,
        \Magento\Customer\Model\Session $customerSession,
        \Magento\Catalog\Model\Session $catalogSession,
        array $data = []
    ) {
        $this->_reportCollectionFactory = $reportCollectionFactory;
        $this->_productRepository = $productRepository;
        $this->_postDataHelper = $postDataHelper;
        $this->_customerSession = $customerSession;
        $this->_catalogSession = $catalogSession;
        parent::__construct($context, $data);
    }

    public function getRecentProducts($limit = 5)
    {
        $products = [];
        $collection = $this->_reportCollectionFactory->create()
            ->addAttributeToSelect('*')
            ->setPageSize($limit)
            ->setCurPage(1);

        foreach ($collection as $product) {
            $products[] = $this->_productRepository->getById($product->getId());
        }
        return $products;
    }
}

b. 新しいテンプレートファイルの作成

最近閲覧した商品を表示するための新しいテンプレートファイルを作成します。

<!-- app/code/YourNamespace/YourModule/view/frontend/templates/recently_viewed.phtml -->

<?php
$products = $block->getRecentProducts();
?>

<div class="recently-viewed-products">
    <h2>最近閲覧した商品</h2>
    <ul>
        <?php foreach ($products as $product): ?>
            <li>
                <a href="<?= $product->getProductUrl() ?>">
                    <img src="<?= $block->getImage($product, 'category_page_list')->getImageUrl() ?>" alt="<?= $product->getName() ?>">
                    <p><?= $product->getName() ?></p>
                </a>
            </li>
        <?php endforeach; ?>
    </ul>
</div>

c. レイアウトファイルの更新

最後に、レイアウトXMLを更新して、ブロックを必要なページに追加します。

<!-- app/code/YourNamespace/YourModule/view/frontend/layout/catalog_product_view.xml -->

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="content">
            <block class="YourNamespace\YourModule\Block\RecentlyViewed" name="recently.viewed.products" template="YourNamespace_YourModule::recently_viewed.phtml"/>
        </referenceContainer>
    </body>
</page>

3. カスタマイズのヒント

次のヒントを使用して、最近閲覧した商品の外観や機能をカスタマイズできます:

  • 商品数の調整:getRecentProductsメソッド内の$limitパラメータを変更して、表示する商品を増減させることができます。
  • スタイリング:必要に応じてCSSを使用して、商品リストのスタイリングを行います。これにより、ユーザーインターフェースが向上し、視覚的に魅力的になります。
  • 条件付きのロジック:特定の条件を確認してからブロックを表示する前に、ユーザーセッションや特定の条件をチェックするための条件付きロジックを実装します。

一般的な問題のトラブルシューティング

手順に従っているにもかかわらず、いくつかの問題が発生する場合があります。以下に、一般的な問題のトラブルシューティング方法を示します:

  • 商品が表示されない:フルページキャッシュが無効になっていることを確認するか、ブロックにキャッシュが効かないように設定してください:
    <block class="YourNamespace\YourModule\Block\RecentlyViewed" cacheable="false" .../>
    
  • 依存関係の注入エラー:ブロックのコンストラクタで必要な依存関係が正しく注入されていることを確認してください。
  • Magentoキャッシュ:設定の変更後にMagentoキャッシュをクリアして、更新が反映されるようにしてください:
    bin/magento cache:clean && bin/magento cache:flush
    

結論

Magento 2.2.2に最近閲覧した商品の機能を組み込むことは、eコマースサイトのユーザーエクスペリエンスを大幅に向上させ、販売を活気づけることができます。このガイドで説明されている手順に従い、最近閲覧した商品をプログラムで取得し、お客様によりパーソナライズされたエンゲージメントを提供することができます。

より充実したカスタマーエクスペリエンスのために、Magentoストアを最適化・カスタマイズするための洞察やヒントのさらなる情報にご期待ください。

よくある質問

質問1:最近閲覧した商品をキャッシュできますか?

  • はい、ただし、リアルタイムデータを反映しない場合があります。正確性を確保するために、ブロックをキャッシュしないように設定してください。

質問2:表示する最近閲覧した商品の数を制限する方法はありますか?

  • ブロッククラス内のgetRecentProductsメソッド内で$limitパラメータを変更してください。

質問3:最近閲覧した商品を複数のページに表示することは可能ですか?

  • はい、それらのページの関連するレイアウトXMLファイルにブロックを追加することで可能です。

質問4:この機能には追加の拡張機能が必要ですか?

  • いいえ、本ガイドで説明されている方法を使って、組み込みのMagento機能とカスタムコードを使用することで実現できます。

今すぐ実装し、Magentoストアのユーザーインタラクションとコンバージョン率の向上を実感してください!