Création d'un modèle de page d'accueil personnalisé dans Magento2

Comme tout ce que vous savez, magento2 a un modèle de mise en page comme 1 colonne, 2 colonnes à gauche, 2 colonnes à droite, 3 colonnes et je veux créer un modèle de mise en page de page d'accueil personnalisé dans Magento2 pour que je suive quelques tutoriels et crée des modules et des fichiers comme indiqué dans ces liens mais aucun d'entre eux ne fonctionne et je ne peux pas obtenir la mise en page "page d'accueil" dans la page cms -> onglet de conception.

Je suis ci-dessous tous les liens mais aucun ne fonctionne donc n'importe qui a la bonne solution s'il vous plaît partagez.

premier lien

deuxième lien

troisième lien

quatrième lien

Ablove toutes les solutions ne fonctionnent pas.

Tout d'abord, nous devons savoir comment créer un thème personnalisé Magento 2, nous pouvons en savoir plus ici: http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/themes/theme-create. html

Après avoir créé un nouveau thème personnalisé. Nous allons créer une nouvelle mise en page personnalisée pour notre page d'accueil. Par exemple, notre structure de dossiers:

Nous devons nous concentrer sur deux fichiers xml: layouts.xmlet page_layout/custom_home.xmlsous Magento_Themedossier

app / design / frontend / Boolfly / book / Magento_Theme / layouts.xml

<?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="custom_home">
        <label translate="true">Custom Home</label>
    </layout>

</page_layouts>

L'identifiant de mise en page custom_homeest le nom de la mise en page ci-dessous.

app / design / frontend / Boolfly / book / Magento_Theme / page_layout / custom_home.xml (j'ai fait une copie par 1column.xmldéfaut)

<?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>

Connectez-vous à Magento Admin, trouvez la page d'accueil de cms. Maintenant, notre page d'accueil de mise en page personnalisée est dans la liste des mises en page:

Si nous choisissons cette disposition, nous pouvons la voir en première page:

Remarque: assurez-vous que notre cache Magento a été effacé.

Il est facilement réalisable depuis Admin, je suppose que vous avez déjà créé un thème.

La plupart de ceux qui ont été confus après avoir créé un nouveau thème ont perdu l'apparence de la page d'accueil car les blocs d'accueil ne sont pas affectés à la page d'accueil pendant que nous créons un nouveau thème. Nous ne le faisons que manuellement.

veuillez suivre les instructions

connectez-vous à l'administrateur, puis accédez à

Conten -> Pages

trouver la page d'accueil, puis dans la colonne action , cliquez sur modifier puis

cliquez sur l'onglet Contenu puis placez la valeur ci-dessous dans la zone de texte

{{block class="Magento\Cms\Block\Block" block_id="home-page-block"}}

note: ici block_id est l'identifiant unique des blocs, vous pouvez trouver la liste des blocs et l'identifiant du bloc sous Content-> Blocks

enfin enregistrer la page

puis videz votre cache de magento et de votre navigateur, chargez la page d'accueil, vous pouvez voir la page d'accueil ressembler à la page d'accueil de luma.

si vous voulez trouver le contenu html de la page d'accueil, recherchez block home-page-block sous Content-> Blocks puis éditez le bloc, vous pouvez voir le contenu html de la page d'accueil .

prendre la référence de ce conetent html, après cela, vous pouvez développer votre propre html selon vos besoins, ajouter CSS à partir de votre fichier de mise en page de thème.

vous avez besoin d'éclaircissements juste mentionner dans le commentaire

Bonne chance.