How to Override Category View Page in Magento 2
Overriding a category view page can be considered as one of the most common tasks for a developer who works on adding functionalities in the category view page in the Magento 2 platform.
As it is well known that customizing the core Magento 2 functionality is a bad coding practice. Thus, it is advisable to override the file instead of modifying any default Magento file.
For instance, you have created a module that adds a button on the category page which prints all the product data in CSV format. In that case, you need to override category view page in Magento 2 to add a well-functioned button on the category view page.
Use the below method and add any custom functionality on the category view page as per your requirement.
Method to Override Category View Page in Magento 2
- Use the below code in the catalog_category_view.xml file at app/code/Vendor/Module/view/frontend/layout
1234567891011<?xml version="1.0"?><page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="2columns-left"xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"><body><referenceBlock name="category.products.list"><action method="setTemplate"><argument name="template" xsi:type="string">Vendor_Module::product/list.phtml</argument></action></referenceBlock></body></page>
- Now you need to create list.phtml at location app/code/Vendor/Module/view/frontend/templates/product
I’ve tried to keep it simple. However, if you find any doubts about the implementation of the above solution, do mention them in the Comments section below.
I’d be glad to help you out.
Feel free to share the post with fellow developers via social media.
You can also refer to the relevant solution to override block, model, and controller in Magento 2 and override a phtml file using a custom module in Magento 2 that I posted earlier.