1

In Magento 2, is there any solution to creating a custom layout XML file for custom cms page?

I want to add XML code and CSS and Js only for my custom cms page.

I know about there is one field available at admin side. But, XML code is the little bit large. So, it's not a better way.

Can anyone guide me how to create it?

Thanks.

5

You can create a custom CMS page layout file by using this below way.

File name should be like this :

cms_page_view_id_<your-custom-cms-page-identifier>.xml

=> For eg : If your cms page identifier is customhome, then file name should be cms_page_view_id_customhome.xml

<?xml version="1.0"?>
<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <!-- Add your css and js file tag here-->   
    </head> 
    <body>
            <!-- Add your reference container, ref block etc. here -->
    </body>
</page>
  • It's not working. – Jayesh Oct 22 '18 at 19:12
  • Can you please tell me any error log generate or? – Rohan Hapani Oct 22 '18 at 19:15
  • No log file generated about error – Jayesh Oct 22 '18 at 19:20
  • It's my mistake. File name was not proper. It's working. Thanks. – Jayesh Oct 22 '18 at 19:21
1

app/design/frontend/Vendor/theme/Magento_Theme/page_layout/column-full.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="1column"/>
    <referenceContainer name="page.wrapper">
        <referenceContainer name="header.container" htmlClass="header" />
        <referenceContainer name="main.content" htmlClass="main-content" />
    </referenceContainer>
</layout>

app/design/frontend/Vendor/theme/Magento_Theme/layouts.xml

<?xml version="1.0"?>
<page_layouts xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/PageLayout/etc/layouts.xsd">
    <layout id="column-full">
        <label translate="true">Column Full</label>
    </layout>
</page_layouts>

Now you can use layout="column-full" in your XML file or you can select "Column Full" in CMS page > Layout Dropdown.

Hope it helps.

  • It's not working for me :( – Jayesh Oct 22 '18 at 19:04
  • I want to create in my custom module. not in theme – Jayesh Oct 22 '18 at 19:13
  • +1 for answer :) – Jayesh Oct 22 '18 at 19:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.