3

I need to show cross sell products on pdp (Product Detail Page ) page , like currently related products shows , hows it possible ?

Improve this question
0

2 Answers 2

Reset to default
4

Please follow below instruction to display cross sell products on product page :

Create module registration file :

app/code/Test/Crosssell/registration.php

<?php

\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::MODULE,
    'Test_Crosssell',
    __DIR__
);

app/code/Test/Crosssell/etc/module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../lib/internal/Magento/Framework/Module/etc/module.xsd">
    <module name="Test_Crosssell" setup_version="1.0.0" schema_version="1.0.0">
        <sequence>
            <module name="Magento_Catalog"/>
        </sequence>
    </module>
</config>

app/code/Test/Crosssell/Block/Crosssell.php

<?php

namespace Test\Crosssell\Block;

class Crosssell extends \Magento\Framework\View\Element\Template {

    protected $_registry;

    public function __construct(
    \Magento\Framework\View\Element\Template\Context $context, \Magento\Framework\Registry $registry, array $data = []
    ) {
        $this->_registry = $registry;

        parent::__construct($context, $data);
    }

    public function getCurrentProduct() {
        return $this->_registry->registry('current_product');
    }

    public function getItems() {
        $items = $this->getData('items');
        if ($items === null) {
            $product = $this->getCurrentProduct();
            $items = $product->getCrossSellProducts();
            $this->setData('items', $items);
        }
        return $items;
    }

    public function getItemCount() {
        return count($this->getItems());
    }

}

app/code/Test/Crosssell/view/frontend/layout/catalog_product_view.xml

<?xml version="1.0"?>
<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="product.info.options.wrapper">
            <block class="Test\Crosssell\Block\Crosssell" name="test.crosssell" template="Magento_Catalog::product/list/items.phtml" after="-">
                <arguments>
                    <argument name="type" xsi:type="string">crosssell</argument>
                </arguments>
                <block class="Magento\Catalog\Block\Product\ProductList\Item\Container" name="crosssell.product.addto" as="addto">
                    <block class="Magento\Catalog\Block\Product\ProductList\Item\AddTo\Compare"
                           name="crosssell.product.addto.compare" as="compare"
                           template="Magento_Catalog::product/list/addto/compare.phtml"/>
                </block>
            </block>
        </referenceBlock>
        <move element="test.crosssell" destination="content" after="product.info.media"/>   
    </body>
</page>

After creating above module please run below command :

php bin/magento setup:upgrade

Now on product page you can see crosssell products. :)

Improve this answer
6
  • Do you know why I get HTTP ERROR 500 when I try this?
    – tchau.dev
    Commented Mar 22, 2017 at 0:50
  • It works at my end.
    – Sneha Panchal
    Commented Mar 22, 2017 at 6:01
  • I found the issue. I forgot to update my namespace in Crosssell.php. Thanks.
    – tchau.dev
    Commented Mar 22, 2017 at 11:48
  • For me i get an error "PHP Fatal error: Uncaught Error: Call to a member function toHtml() on null " Any idea where i have gone wrong here?
    – harri
    Commented Jun 30, 2017 at 9:30
  • If i remove the image out of items.phtml where the tohtml function is my page loads with a list of the amount of products just no product data like names ect. Not sure what i have missed out here.
    – harri
    Commented Jun 30, 2017 at 9:46
2

It will be better to use default logic...

app/design/frontend/vendor_name/theme_name/Magento_Catalog/layout/catalog_product_view.xml

 <?xml version="1.0"?>
    <page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
        <body>
            <referenceContainer name="content.aside">
                <block class="Magento\Catalog\Block\Product\ProductList\Crosssell" name="catalog.product.crosssell" template="Magento_Catalog::product/list/items.phtml">
                    <arguments>
                        <argument name="type" xsi:type="string">crosssell</argument>
                    </arguments>
<block class="Magento\Catalog\Block\Product\ProductList\Item\Container" name="crosssell.product.addto" as="addto">
                    <block class="Magento\Catalog\Block\Product\ProductList\Item\AddTo\Compare"
                           name="crosssell.product.addto.compare" as="compare"
                           template="Magento_Catalog::product/list/addto/compare.phtml"/>
                    </block>
                </block>
            </referenceContainer>
        </body>
    </page>
Improve this answer
1
  • It's working only when you add product to basket. So there no benefit.
    – Efex
    Commented Sep 27, 2020 at 21:17

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.