How to change product pages structure , layout for multiple categories in magento 2?

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).

edited Oct 27 '17 at 7:33

ABHISHEK TRIPATHI

1,6881626

asked Oct 27 '17 at 7:07

Ganesh

418

bumped to the homepage by Community♦ 2 mins ago

This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.

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
Oct 27 '17 at 7:37

add a comment |

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).

edited Oct 27 '17 at 7:33

ABHISHEK TRIPATHI

1,6881626

asked Oct 27 '17 at 7:07

Ganesh

418

bumped to the homepage by Community♦ 2 mins ago

This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.

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
Oct 27 '17 at 7:37

add a comment |

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).

edited Oct 27 '17 at 7:33

ABHISHEK TRIPATHI

1,6881626

asked Oct 27 '17 at 7:07

Ganesh

418

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).

magento2 product category layout theme

edited Oct 27 '17 at 7:33

ABHISHEK TRIPATHI

1,6881626

asked Oct 27 '17 at 7:07

Ganesh

418

edited Oct 27 '17 at 7:33

ABHISHEK TRIPATHI

1,6881626

asked Oct 27 '17 at 7:07

Ganesh

418

edited Oct 27 '17 at 7:33

ABHISHEK TRIPATHI

1,6881626

edited Oct 27 '17 at 7:33

ABHISHEK TRIPATHI

1,6881626

edited Oct 27 '17 at 7:33

ABHISHEK TRIPATHI

1,6881626

asked Oct 27 '17 at 7:07

Ganesh

418

asked Oct 27 '17 at 7:07

Ganesh

418

asked Oct 27 '17 at 7:07

Ganesh

418

bumped to the homepage by Community♦ 2 mins ago

This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.

bumped to the homepage by Community♦ 2 mins ago

This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.

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
Oct 27 '17 at 7:37

add a comment |

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
Oct 27 '17 at 7:37

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
Oct 27 '17 at 7:37

add a comment |

2 Answers
2

active

oldest

votes

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.

edited Oct 27 '17 at 7:35

ABHISHEK TRIPATHI

1,6881626

answered Oct 27 '17 at 7:14

akgola

1,347518

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
Oct 27 '17 at 7:57

add a comment |

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.

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

Make your layout changes here.

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="MagentoFrameworkViewElementTemplate"

                name="layered.nav.trigger"

                as="layeredNavTrigger"

                template="Magento_Catalog::category/layered-nav-trigger.phtml"

                before="-"/>

        </referenceBlock>



        <referenceContainer name="footer-container">

            <block class="MagentoFrameworkViewElementTemplate" name="category.sticky.banner" template="Magento_Catalog::sticky-banner.phtml" before="footer.social">

                <block class="MagentoCmsBlockBlock" 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.

answered Oct 27 '17 at 7:49

Ben Crook

8,8252376

this will reflect for every page

– Ganesh
Oct 27 '17 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
Oct 27 '17 at 8:05

add a comment |

Your Answer

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "479"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');

var $window = $(window),
onScroll = function(e) {
var $elem = $('.new-login-left'),
docViewTop = $window.scrollTop(),
docViewBottom = docViewTop + $window.height(),
elemTop = $elem.offset().top,
elemBottom = elemTop + $elem.height();
if ((docViewTop elemBottom)) {
StackExchange.using('gps', function() { StackExchange.gps.track('embedded_signup_form.view', { location: 'question_page' }); });
$window.unbind('scroll', onScroll);
}
};
$window.on('scroll', onScroll);

});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f198902%2fhow-to-change-product-pages-structure-layout-for-multiple-categories-in-magent%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

2 Answers
2

active

oldest

votes

2 Answers
2

active

oldest

votes

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.

edited Oct 27 '17 at 7:35

ABHISHEK TRIPATHI

1,6881626

answered Oct 27 '17 at 7:14

akgola

1,347518

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
Oct 27 '17 at 7:57

add a comment |

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.

edited Oct 27 '17 at 7:35

ABHISHEK TRIPATHI

1,6881626

answered Oct 27 '17 at 7:14

akgola

1,347518

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
Oct 27 '17 at 7:57

add a comment |

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.

edited Oct 27 '17 at 7:35

ABHISHEK TRIPATHI

1,6881626

answered Oct 27 '17 at 7:14

akgola

1,347518

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.

edited Oct 27 '17 at 7:35

ABHISHEK TRIPATHI

1,6881626

answered Oct 27 '17 at 7:14

akgola

1,347518

edited Oct 27 '17 at 7:35

ABHISHEK TRIPATHI

1,6881626

edited Oct 27 '17 at 7:35

ABHISHEK TRIPATHI

1,6881626

edited Oct 27 '17 at 7:35

ABHISHEK TRIPATHI

1,6881626

answered Oct 27 '17 at 7:14

akgola

1,347518

answered Oct 27 '17 at 7:14

akgola

1,347518

answered Oct 27 '17 at 7:14

akgola

1,347518

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
Oct 27 '17 at 7:57

add a comment |

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
Oct 27 '17 at 7:57

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
Oct 27 '17 at 7:57

add a comment |

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.

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

Make your layout changes here.

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="MagentoFrameworkViewElementTemplate"

                name="layered.nav.trigger"

                as="layeredNavTrigger"

                template="Magento_Catalog::category/layered-nav-trigger.phtml"

                before="-"/>

        </referenceBlock>



        <referenceContainer name="footer-container">

            <block class="MagentoFrameworkViewElementTemplate" name="category.sticky.banner" template="Magento_Catalog::sticky-banner.phtml" before="footer.social">

                <block class="MagentoCmsBlockBlock" 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.

answered Oct 27 '17 at 7:49

Ben Crook

8,8252376

this will reflect for every page

– Ganesh
Oct 27 '17 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
Oct 27 '17 at 8:05

add a comment |

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.

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

Make your layout changes here.

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="MagentoFrameworkViewElementTemplate"

                name="layered.nav.trigger"

                as="layeredNavTrigger"

                template="Magento_Catalog::category/layered-nav-trigger.phtml"

                before="-"/>

        </referenceBlock>



        <referenceContainer name="footer-container">

            <block class="MagentoFrameworkViewElementTemplate" name="category.sticky.banner" template="Magento_Catalog::sticky-banner.phtml" before="footer.social">

                <block class="MagentoCmsBlockBlock" 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.

answered Oct 27 '17 at 7:49

Ben Crook

8,8252376

this will reflect for every page

– Ganesh
Oct 27 '17 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
Oct 27 '17 at 8:05

add a comment |

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.

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

Make your layout changes here.

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="MagentoFrameworkViewElementTemplate"

                name="layered.nav.trigger"

                as="layeredNavTrigger"

                template="Magento_Catalog::category/layered-nav-trigger.phtml"

                before="-"/>

        </referenceBlock>



        <referenceContainer name="footer-container">

            <block class="MagentoFrameworkViewElementTemplate" name="category.sticky.banner" template="Magento_Catalog::sticky-banner.phtml" before="footer.social">

                <block class="MagentoCmsBlockBlock" 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.

answered Oct 27 '17 at 7:49

Ben Crook

8,8252376

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.

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

Make your layout changes here.

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="MagentoFrameworkViewElementTemplate"

                name="layered.nav.trigger"

                as="layeredNavTrigger"

                template="Magento_Catalog::category/layered-nav-trigger.phtml"

                before="-"/>

        </referenceBlock>



        <referenceContainer name="footer-container">

            <block class="MagentoFrameworkViewElementTemplate" name="category.sticky.banner" template="Magento_Catalog::sticky-banner.phtml" before="footer.social">

                <block class="MagentoCmsBlockBlock" 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.

answered Oct 27 '17 at 7:49

Ben Crook

8,8252376

answered Oct 27 '17 at 7:49

Ben Crook

8,8252376

answered Oct 27 '17 at 7:49

Ben Crook

8,8252376

answered Oct 27 '17 at 7:49

Ben Crook

8,8252376

this will reflect for every page

– Ganesh
Oct 27 '17 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
Oct 27 '17 at 8:05

add a comment |

this will reflect for every page

– Ganesh
Oct 27 '17 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
Oct 27 '17 at 8:05

this will reflect for every page

– Ganesh
Oct 27 '17 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
Oct 27 '17 at 8:05

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Magento Stack Exchange!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

Post as a guest

Name

Required, but never shown

Sign up or log in

Post as a guest

Name

Required, but never shown

Sign up or log in

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Orsdxy