Importer un template (Phtml) et bloc statique

Importer un Phtml que l’on rattache à un bloc statique est une bonne solution pour créer une page découpée en plusieurs parties, entièrement administrable dans le back-office. Dans ce tutoriel, nous allons voir comment créer une page statique et la découper en plusieurs blocs.

1. Créez un dossier mapage et un phtml nommé page-haut.phtml que vous placerez dans

   app\design\frontend\default\default\template\mapage\page-haut.phtml

2. Créez une nouvelle page statique admin => CMS => gestion des pages => ajoutez une nouvelle page
3. Dans la partie contenu, placez ce code pour importer le PHTML page-haut.phtml tutoriel import de PHTML

{{block  type="core/template" template="mapage/page-haut.phtml"}}

4. Créez un bloc statique. Pour cela, allez dans CMS => blocs statiques => ajouter un nouveau bloc
   Titre du bloc : haut
   Identifiant : haut
   Contenu : tapez le contenu du haut de votre page.
5. Revenir dans le phtml crée à l’étape 1 page-haut.phtml, il faut placer à l’intérieur un code qui le lie au bloc statique

   <?php echo $this-> getLayout()->createBlock('cms/block')->setBlockId('haut')->toHtml() ?>

A présent votre page est liée à un bloc statique. Dans ce tutoriel nous avons vu comment gérer le haut de la page.

contenu du bloc statique

Vous pouvez rajouter d’autres blocs statiques pour le milieu ou le bas de page et ainsi rendre tout administrable par le back-office, en rajoutant :

{{block  type="core/template" template="mapage/page-mileu.phtml"}}

{{block  type="core/template" template="mapage/page-bas.phtml"}}

Le contenu du texte n’est pas formaté, aucune mise en forme n’est possible si vous n’avez pas de wysiwyg installé. Vous pouvez tout de même mettre en forme le texte grâce au sélecteur CSS. Pour cela, dans le phtml entourez le code d’une div avec un id :

<?php  echo $this->getLayout()->createBlock('cms/block')->setBlockId('haut')->toHtml() ?>

Ensuite dans votre CSS
#haut-page{border:solid 1px; padding:10px;}
#haut-page h1 {font-size:18px;}

Bloc statique et CSS

Votre haut de page est entièrement administrable dans le back office, à vous de la mettre en forme avec le CSS et rajouter d’autres blocs.

Cette procédure permet de rendre une page administrable par le back office. Un client peut modifier le texte du haut de page, ou celui du bas sans avoir à rentrer dans le code de magento, ou encore dans la partie contenu d’une page CMS, qui peut devenir  incompréhensible pour un novice.