1

I want to change product page structure and layout by categories wise, high customization. For example if I have 3 categories then it should have 3 different category page view.

(whatever I change should reflect on each category page).

Improve this question
1
  • Could you explain it properly means could you share some designs Because Magento basically provides 4 different type layout view you could set it from the admin side but if you want more view than you need to create more layouts type
    – Abhishek Tripathi
    Commented Oct 27, 2017 at 7:37

2 Answers 2

Reset to default
1

I'm slightly confused as to what your requirements are, it sounds like you want to customise the layout for every category page?

If so the easiest way to achieve this is to use layout XML.

  1. Create /app/design/frontend/Vendor/theme/Magento_Catalog/layout/catalog_category_view.xml

  2. Make your layout changes here.

  3. Clear Magento cache if it's enabled

For example:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <move element="category.view.container" destination="content" before="category.products" />

        <referenceBlock name="category.view.container">
            <block
                class="Magento\Framework\View\Element\Template"
                name="layered.nav.trigger"
                as="layeredNavTrigger"
                template="Magento_Catalog::category/layered-nav-trigger.phtml"
                before="-"/>
        </referenceBlock>

        <referenceContainer name="footer-container">
            <block class="Magento\Framework\View\Element\Template" name="category.sticky.banner" template="Magento_Catalog::sticky-banner.phtml" before="footer.social">
                <block class="Magento\Cms\Block\Block" name="category.sticky.banner.block">
                    <arguments>
                        <argument name="block_id" xsi:type="string">category-sticky-banner</argument>
                    </arguments>
                </block>
            </block>
        </referenceContainer>
    </body>
</page>

Here I am moving 1 element and adding a few new blocks to every category page.

Improve this answer
2
  • this will reflect for every page
    – Ganesh
    Commented Oct 27, 2017 at 7:52
  • This will only affect category pages, if you want to affect every single page you need to add the file /app/design/frontend/Vendor/Theme/Magento_Theme/layout/default.xml
    – Ben Crook
    Commented Oct 27, 2017 at 8:05
0

To achieve this ,you will require to create extra layout with creating custom module.Magento2 default provided layouts are as follows. 

1 column
2 columns with left bar
2 columns with right bar
3 columns

So you need to create more layouts by using Empty layout and need to choose these layout in category Design section.

enter image description here

For creating layout,you can take help from: https://magento.stackexchange.com/a/11136/24878

Hope this will help you.

Improve this answer
1
  • when im updating any column except "1 column layout" it will just adding more elements in 1 column layout. that is its updating to "1 column layout "
    – Ganesh
    Commented Oct 27, 2017 at 7:57

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.