Magento 2- Add custom container into product listing page
-
07-04-2021 - |
質問
I've search for some answers to this but unfortunately I can't seem to find anything. I would really appreciate some help about this.
I have created a custom container using XML in 'catalog_category_view.xml
' file and then move other blocks (elements) in there. The idea is to display the container on the product listing page (category page) just next to the product grid.
However, I find difficulties with the placement for my new container. I would like to move the container next to the products into the products grid.
Is it possible to insert a custom container inside the products listing (ol > li
) as a first element.
My idea is to have a grid which has 4
products per row (25% per product
) and to start with custom section. So the 4
columns grid and rows would look like this:
50% custom container + 25% product + 25% product
25% product + 25% product + 25% product + 25% product
25% product + 25% product + 25% product + 25% product
Right now I have added the custom container just before the product listing section using XML and then using simple jQueary move the container into the product listing using the following code:
$('.custom-container').detach().prependTo('ol.product-items');
I understand that this is not a perfect solution and that's why I am asking here, any help would be appreciated. Thank you in advance!
解決
It doesn't possible move container in block.. Becuase Container is grouping of blocks. I think it is better that using block. You can render child block in template using getChildHtml method of Block class.
ref) https://devdocs.magento.com/guides/v2.3/frontend-dev-guide/layouts/xml-instructions.html ref) https://www.simicart.com/blog/magento-getchildhtml/