Magento – How to override product view page in magento 2

magento2overridesproduct

I want to override product view page and add my custom code over that.

So please help me on how can I override template of product view page.

Thank you.

Best Answer

@Dmync In order to accomplish this the basic answer is "it depends." The first question that would need to be answered is "What do you want to override?" This question is too broad.

If you're trying to override some template(s) that are in place by default for product view then you can need to track down the templates you want to override. You can do so by either of the following:

  1. Follow directions here: enable template hints
  2. Go to vendor/magento/module-catalog/view/frontend/layout/catalog_product_view.xml and track down all the template files that are explicitly assigned here, as well as all other templates included via <update> layout instruction update docs

Once you know which templates you want to update, then you can follow the general ideas within this page to create the correct module structure. Basically if you're creating a module to perform these actions then you'll need a structure like:

app/code/<Vendor>/<module>/view/frontend/Magento_Catalog/templates and then you'd continue to refer to the structure of Magento_Catalog for it's folder hierarchy...and you'd add that into your module...so

If you're wanting to override vendor/magento/module-catalog/view/frontend/templates/product/view/form.phtml then you'd create app/code/<Vendor>/<Module>/view/frontend/Magento_Catalog/templates/product/view/form.phtml. Then you could do your customizations there..again, refer to the templates customization doc I linked.

If you're trying to do this via a theme. Using the above example....you'd create app/design/frontend/<Vendor>/<theme>/Magento_Catalog/product/view/form.phtml and perform whatever customizations you'd like in that template.

So which ever way you go about it, either creating a custom module or a custom design theme, and if you're simply modifying the template content, you're going to need to recreate the target module (in this case Magento_Catalog) in your own custom module/theme (using the correct directory hierarchies...as it's slightly different between module/theme).

If you're interested in modifying css then look here for info on overriding css.

If you need to modify some of the page's layout xml files to rearrange elements, remove elements, add elements, etc...look here to get started.

As you can see, there's a lot that can take place in simply "Overriding product view page."