Cómo anular archivos .phtml en Magento 2

15

Quiero personalizar la página de detalles del producto, por lo que es necesario anular algunos archivos .phtml en las siguientes ubicaciones.

Entonces, quiero saber cómo anular archivos .phtmlvendor\magento\module-catalog\view\frontend\templates\product ovendor\magento\module-theme\view

magento2 module theme overrides nuwaus
fuente

Respuestas:

23

A veces necesitamos hacer modificaciones a las plantillas existentes. En lugar de realizar cambios directamente en los archivos de plantilla existentes, deberíamos anularlos en nuestro propio tema. Supongamos que queremos actualizar la página de listado de categorías ( list.phtml). Para hacerlo, cree la siguiente estructura de directorios:

app/design/frontend/Mycompany/Basic/Magento_Catalog/templates/product

Aquí supongo que nuestro tema actual es Básico. Ahora copie el archivo list.phtml en el directorio del producto desde la siguiente ubicación:

app/vendor/magento/module-catalog/view/frontend/templates/product/list.phtml

Ahora puede realizar las modificaciones que desee en su archivo anulado.

Para más detalles, lea este tutorial, le ayuda mucho.

Arunendra
fuente
2
Hola, acabo de anular el archivo list.phtml en la siguiente ruta, \ app \ design \ frontend \ Magento \ luma \ Magento_Catalog \ templates \ product \ list.phtml. Pero no ha funcionado. ¿Puedo saber dónde hice mal?
Vigna S
El mismo problema, no importa cuántas veces presione Actualizar, el predeterminado se carga sobre mi personalizado. Y SÍ, tengo la ruta correcta antes de que alguien pregunte, pero estoy usando Composer para instalar Magento, por lo que los valores predeterminados están en diferentes ubicaciones si eso es importante.
Dustin Poissant
Tuve que borrar el caché de bloque html y luego esto funcionó perfectamente para mí. ( Borro el caché como este blog.gardenhouse.io/2018/05/29/… )
Paul
Sin embargo, ¿cómo anular la plantilla de tu módulo?
Negro
8

Estoy respondiendo mi propia pregunta,

Descubrí cómo anular los archivos .phtml en las ubicaciones mencionadas en mi pregunta,

Debe colocarlos en las siguientes ubicaciones para anular los archivos originales

app\design\frontend\<VENDOR_NAME>\<THEME_NAME>\Magento_Catalog\templates\product\view

Y creo que la teoría es la misma para anular cualquier otro archivo .phtml en Magento 2

nuwaus
fuente
¿Podría por favor resumir más ... como si tuviera que copiar mi archivo phtml personalizado en la carpeta de temas isit? me gusta en app \ design \ frontend \ <VENDOR_NAME> \ luma \ Magento_Catalog \ ¿Debo crear mi carpeta Vendor y copiar el archivo phtml principal en ella? Si al hacerlo, ¿no necesita plantillas en la carpeta de vista?
Sushivam
Hola, estoy tratando de anular un archivo phtml para un widget, y no estoy seguro de que la ruta que he usado sea correcta. ¿La parte Magento_Catalog de su ruta es específica de la carpeta del módulo que está anulando? Entonces, si estoy anulando el proveedor \ magento \ module-catalog-widget \ view \ frontend \ templates \ product \ widget \ content, ¿reemplazaría Magento_Catalog en su instancia con Magento_Catalog_Widget en mi instancia? Ligeramente confundido ya que aún no me queda claro.
robgt
6

Para anular phtml, diseño y archivos web para tener un tema personalizado

1) Para anular el archivo de plantilla:

vendor / magento / module-catalog / view / frontend / templates / product / list.phtml

Sigue este camino

app / design / frontend / Vendor / theme / Magento_Catalog / templates / product / list.phtml

2) Para anular el archivo de diseño:

vendor / magento / module-catalog / view / frontend / layout / catalog_product_view.xml

Sigue este camino

app / design / frontend / Vendor / theme / Magento_Catalog / layout / catalog_product_view.xml

Príncipe Patel
fuente
¿Cómo anular / personalizar otros archivos de módulo como Observer, Controller, etc.?
Tahir Yasin
6

Para anular pthml y archivos de diseño de

vendor/magento/module-catalog/view/frontend/templates/product/list.phtml

dentro

app/Mycompany/OverideCatalog/view/frontend/templates/product/list.phtml

Diseño:

vendor/magento/module-catalog/view/frontend/layout/catalog_category_view.xml

dentro

app/Mycompany/OverideCatalog/view/frontend/layout/catalog_category_view.xml

<block class="Magento\Catalog\Block\Product\ListProduct" name="category.products.list" as="product_list" template="Mycompnay_OverideCatalog::product/list.phtml">
Pramod Kharade
fuente
3

anular plantillas (phtml) por tema personalizado

si desea anular vendor\magento\module-catalog\view\frontend\templates\product\some.phtmlprimero, necesita crear su tema personalizado, consulte este enlace para saber cómo crear un tema personalizado.

después de eso, crea un archivo phtml en tu tema personalizado para anular uno predeterminado

 app/design/frontend/vendor-name/theme-name/Magento_Catalog/templates/product/some.phtml

eso finalmente limpia el caché de magento y del navegador, luego verifica tu página, solo se refleja el nuevo archivo phtml.

de la misma manera que puede hacer para todas las anulaciones de plantillas.

buena suerte

Bilal Usean
fuente
Gracias, lo descubrí y respondí el hallazgo en mis propias preguntas, su respuesta es muy similar a mis hallazgos.
nuwaus
2

Abrir carpeta: /vendor/magento/theme-frontend-luma/y copie las plantillas de módulo y los archivos de diseño de la carpeta de vista.

Luego crea carpetas: /app/design/frontend/spacename/Theme/

Luego cree la carpeta del módulo y luego cree las plantillas y la carpeta de diseño.

Inserte las plantillas y los archivos de diseño desde la carpeta de vista del módulo.

Abhinav Singh
fuente