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?