How to create custom layout page in Magento2 :- Here, I am going to learn that how to create custom layout page in magento2. We already know that Magento provide following layout as default :-
-Empty
-1 column
-2 columns with left bar
-2 columns with right bar
-3 columns
Sometime we need some customisation in our Magento design and want to change design of Home page or any specific page.There are some points which help you to create own layout page.
We considered that we already create module necessary files like(registartion.php,composer.json,module.xml etc.)
There are two files needed to create custom layout page
1 – Create Namespace/Module/view/frontend/layouts.xml this file registered custom layout
<?xml version="1.0" encoding="UTF-8"?> <page_layouts xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/PageLayout/etc/layouts.xsd"> <layout id="test"> <label translate="true">test layout</label> </layout> </page_layouts>
After creating above file you can check your test layout in admin panel.
2- Create Namespace/Module/view/frontend/page_layout/test.xml this file to manage design your layout page.
<?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"/> <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"/> </referenceContainer> </layout>
Now this is complete to use as custom layout.You can check this layout in admin panel configuration setting.

Thank’s for read this.If you have any query please comment below.
2 comments