Create category custom layout in Magento 2

Today we discuss to create a category custom layout in Magento2

Create layout.xml fine in your theme

app/design/frontend/ABC/XYZ/Magento_Theme/layouts.xml

<page_layouts xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/PageLayout/etc/layouts.xsd">
    <layout id="customlayout">
        <label translate="true">Custom Layout Page</label>
    </layout>   
</page_layouts>

Layout id = customlayout

Create customlayout.xml file, Layout id name file name will same.

app/design/frontend/ABC/XYZ/Magento_Theme/page_layout/customlayout.xml

<?xml version="1.0"?>

<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_layout.xsd">
    <update handle="empty"/>

    <referenceContainer name="page.wrapper">
        
        <container name="header.container" as="header_container" label="Page Header Container" htmlTag="header" htmlClass="page-header" before="main.content"/>

        <!--  we added code for CMS blockn    -->
        <container name="customheader.container" as="customheader_container" label="slider Container" htmlTag="div" htmlClass="slider-header" after="header_container">
            <block class="Magento\Cms\Block\Block" name="newstop">
			    <arguments>
			        <argument name="block_id" xsi:type="string">newstop</argument>
			    </arguments>
			</block>
        </container>    
         <!--  newstop is a CMS block identifier    -->

        <container name="page.top" as="page_top" label="After Page Header" after="header.container"/>
        <container name="footer-container" as="footer" before="before.body.end" label="Page Footer Container" htmlTag="footer" htmlClass="page-footer"/>
     
        <referenceBlock name="breadcrumbs" remove="true"/>
        <referenceBlock name="page.main.title" remove="true" />
    </referenceContainer>
        
</layout>

Like us on Facebook and Linkedin for more updates.

Product price in Magento 2