cancel
Showing results for 
Search instead for 
Did you mean: 

New page layout is blank

   Did you know you can see the translated content as per your choice?

Translation is in progress. Please check again after few minutes.

New page layout is blank

I'm trying to create a new page layout. The layout will be identical to the 1 column layout with the exception of the max0wdith and margins applied to the "maincontent" element. In other words, I want a page layout that is full-width.

 

I've added a new file layouts.xml to \app\design\frontend\my_company\my_theme\Magento_Theme;

 

<?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="full-width">
        <label translate="true">Full Width</label>
    </layout>
</page_layouts>

I've copied the definition for the 1 column layout and not changed anything yet. There's a load of conflicting information on where this file should reside. I've tried all of the following locations without success.

 

\app\design\frontend\my_company\my_theme\Magento_Theme\full-width.xml

\app\design\frontend\my_company\my_theme\Magento_Theme\layout\full-width.xml

\app\design\frontend\my_company\my_theme\Magento_Theme\page_layout\full-width.xml

\app\design\frontend\my_company\my_theme\Magento_Theme\page_layouts\full-width.xml

\app\design\frontend\my_company\my_theme\view\frontend\full-width.xml

\app\design\frontend\my_company\my_theme\view\frontend\page_layout\full-width.xml

\app\design\frontend\my_company\my_theme\view\frontend\page_layouts\full-width.xml

 

I can see my new layout in the Layout dropdown in Content>Pages>Design. I've selected the new layout and executed the following on the server;

 

chown -R magento:www-data /var/www/html/magento/

rm -R /var/www/html/magento/pub/static/frontend/my_company\my_theme/

rm -R /var/www/html/magento/var/view_preprocessed/css/my_company\my_theme/

 

When I attempt to navigate to the pages (my home page) that I specified the new layout for, all I get is a blank page. Looking at the page source I see;

 

<!doctype html>
<html lang="en-GB">
    <head >
        <script>
    var require = {
        "baseUrl": "http://www.myurl.com/pub/static/frontend/my_company/my_theme/en_GB"
    };
</script>
        <meta charset="utf-8"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="description" content=""/>
<meta name="keywords" content=""/>
<meta name="robots" content="INDEX,FOLLOW"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title></title>
<link  rel="stylesheet/less" type="text/css"  media="all" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/mage/calendar.css" />
<link  rel="stylesheet/less" type="text/css"  media="all" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/css/styles-m.css" />
<link  rel="stylesheet/less" type="text/css"  media="all" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/Magestore_Sociallogin/css/sociallogin.css" />
<link  rel="stylesheet/less" type="text/css"  media="all" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/Magestore_Sociallogin/css/mobilesociallogin.css" />
<link  rel="stylesheet/less" type="text/css"  media="all" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/Ves_ImageSlider/css/owl.carousel.min.css" />
<link  rel="stylesheet/less" type="text/css"  media="all" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/Ves_ImageSlider/css/animate.css" />
<link  rel="stylesheet/less" type="text/css"  media="screen and (min-width: 768px)" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/css/styles-l.css" />
<link  rel="stylesheet/less" type="text/css"  media="print" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/css/print.css" />
<link  rel="icon" type="image/x-icon" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/Magento_Theme/favicon.ico" />
<link  rel="shortcut icon" type="image/x-icon" href="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/Magento_Theme/favicon.ico" />
<script src="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/less/config.less.js"></script>
<script src="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/less/less.min.js"></script>
<script  type="text/javascript"  src="http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/requirejs/require.js"></script>
            </head>
    <body data-container="body" data-mage-init='{"loaderAjax": {}, "loader": { "icon": "http://www.nusa.world/pub/static/frontend/my_company/my_theme/en_GB/images/loader-2.gif"}}' class="cms-index-index page-layout-full-width">
            </body>
</html>

I've no idea what to try next. Does anyone know the correct location of the new page layout file?