Accueil
Magento 2
Thème
Surcharger le layout de la page d'accueil

Surcharger le layout de la page d'accueil

Pré-requis

Avoir une connexion au serveur par SSH ou par un Terminal
Avoir téléchargé les fichiers Magento 2 nécessaires à l’installation
Avoir créé un thème personnalisé

Objectif

Surcharger le layout de la page d'accueil dans un thème personnalisé

Tutoriel

Création de l'arborescence

Accéder au dossier /app/design/frontend/nom_du_vendor/nom_du_theme et créer les dossiers Magento_Theme/page_layout et Magento_Theme/templates.

Création des fichiers

Au sein du dossier Magento_Theme, créer le fichier suivant layouts.xml et intégrer le code XML suivant :

<?xml version="1.0" encoding="UTF-8"?>
<!--
/**
 * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page_layouts xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/PageLayout/etc/layouts.xsd">
    <layout id="surcharge_home">
        <label translate="true">Surcharge - Home</label>
    </layout>
</page_layouts>

Ensuite, créer le fichier surcharge_home.xml dans le dossier page_layout et intégrer le contenu suivant :

<?xml version="1.0"?>
<!--
/**
 * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<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 name="main">
            <block class="Magento\Framework\View\Element\Template" name="customtext" template="Magento_Theme::home_content.phtml" after="-" />
        </referenceContainer>
    </referenceContainer>
</layout>

Création du fichier de template

Pour terminer, il est nécessaire de créer le fichier home_content.phtml dans le dossier templates

Le contenu du fichier home_content.phtml sera intégré après le contenu HTML de la page d'accueil.

Pour afficher un bloc CMS, vous devez utiliser la fonction PHP suivante :

<?php
    echo $this  ->getLayout()
                ->createBlock('Magento\Cms\Block\Block')
                ->setBlockId('cms_homepage')
                ->toHtml();
?>

Activation du layout dans le backoffice

Ouvrir, dans le backoffice, la page Home et sélectionner Surcharge - Home dans la partie layout.

Enregistrer et relancer la page d'accueil de la boutique.

Section title