Rajouter des blocs sous Magento est assez simple… Si on sait où chercher.

Ces blocs vont permettre d’afficher des publicités, ou des promotions. Donc notre exemple, on veut afficher le produit en promotion du mois. Le principe est de créer un catégorie et de lier le produit voulu à cette catégorie.

1. Rajouter un bloc statique simple dans la sidebar de gauche
2. Faire en sorte que cela soit un bloc « dynamique »
3. Supprimer les options de tri dans l’affichage du produit
4. Rajouter des blocs dans la sidebar à partir de fichier .phtml sous Magento
5. Inclure le contenu d’un bloc statique dans un fichier .phtml sans toucher au XML
6. (extra facultatif) : Listing des blocs statiques sous Magento [Article à part]
7. Ajouter un bloc statique dans une page statique

Etape 1 : Rajouter un bloc statique simple dans la sidebar de gauche

Commençons par créer un bloc statique simple

• Admin > CMS > Blocs statiques > Ajouter un nouveau bloc
• Remplissez les champs. Ex : Promotion du mois / promotion_du_mois / Activé / Voici le contenu du block « Promotion du mois ». Enregistrez.

a) Ajouter le bloc dans la sidebar dans TOUTES les pages du site ayant la sidebar

Ouvrez (ou créer) le fichier :

app/design/frontend/{/votre_theme/layout/local.xml

<?xml version="1.0"?>
<layout version="0.1.0">
	<default></default>
</layout>

C’est votre fichier de layout personnalisé qui surchage tous les autres layout de votre thème.

• Rajoutez dans <default></default> ceci :

<reference name="left">
	<block type="cms/block" name="cms_promotion_du_mois" before="-">
		<action method="setBlockId"><block_id>promotion_du_mois</block_id></action>
	</block>
</reference>

On a rajoute le bloc à gauche « left » (« content » pour le milieu, header, footer, right, selon les cas) qui est de type cms/block.
On le note en préfixant par « cms_ » (facultatif, c’est plus une notation pour se retrouver), et on le place tout en haut, before="-" (after="-" pour tout en bas).

b) Ajouter le bloc uniquement pour la page d’accueil (ou une page en particulier)

Nous reprenons le même code que précédemment :

<reference name="left">
	<block type="cms/block" name="cms_promotion_du_mois" before="-">
		<action method="setBlockId"><block_id>promotion_du_mois</block_id></action>
	</block>
</reference>

Que nous ajoutons cette fois-ci dans :

• Admin > CMS > Gestions des pages > Home (votre page à modifier) > Design Personnalisé > XML de mise à jour d’agencement

Etape 2 : Faire en sorte que cela soit un bloc « dynamique »

Pour lier le bloc à la catégorie « Promotion du mois », il faut savoir l’identifiant de la catégorie :

• Admin > Catalogue > Gérer les catégories > Choisissez votre catégorie, et notez l’ID en haut de la page (ici par exemple : ID = 50)

Liez votre produit à votre catégorie.

Modifier votre bloc statique :

• Admin > CMS > Blocs statiques > Choisissez votre bloc
• Dans le contenu, mettez :

{{block type="catalog/product_list" category_id="50" template="catalog/product/list.phtml"}}

Votre produit est affiché à gauche dans la sidebar

Etape 3 : Supprimer les options de tri dans l’affichage du produit

Le produit étant seul, les options d’affichage et de tri (9 par page, etc) sont inutiles. Cela se joue dans le fichier : app/design/frontend/{interface}/{theme}/template/catalog/product/list.phtml.

Cependant, si nous modifions ce fichier, tous les affichages des produits perdront eux aussi leur système de navigation.

• Faire une copie de list.phtml en list_accueil.phtml.
• Modifiez le bloc statique :

{{block type="catalog/product_list" category_id="50" template="catalog/product/list_accueil.phtml"}}

• Ouvrez le fichier list_accueil.phtml
• Supprimer en haut et en bas du fichier :

<?php echo $this->getToolbarHtml() ?>

Votre produit en promotion du mois est affiché simplement dans la sidebar de gauche.

Pour aller plus loin : Normalement, il faut créer notre propre module qui hérite de catalog/product_list. Ainsi nous pouvons maitriser la sélection (limiter les résultats, les trier, les rendre aléatoire, les mettre en cache, etc.). Cependant, nous nous arrêtons là par simplicité.

Etape 4 : Rajouter des blocs statiques en formatant l’affichage sous Magento

Les blocs statiques sont ajoutés tel quel dans le code source de la page. Or si vous activez le débugger :

• Admin > Système > Configuration
• Dans la liste en haut à gauche de vos vues (Portée de la configuration courante :), ne prennez pas la configuration par défaut, mais celle juste en dessous, de votre magasin. Votre page se recharge.
• Onglet Avancé > Développeur
• Mettez « Astuce chemin des gabarits » et « Ajouter les noms des blocs aux astuces » à « Oui ».
• Sauvegardez. Rafraîchissez votre front-office (Ctrl + F5 sous Firefox)

Tous les blocs « template » sont entourés de rouge avec le nom du fichier .phtml correspondant. Or notre solution ici n’est pas entouré d’un bloc.

On reprend donc l’étape 1. L’insertion dans le fichier layout/cms.xml dans <default> de :

<reference name="left">
	<block type="cms/block" name="cms_promotion_du_mois" before="-">
		<action method="setBlockId"><block_id>promotion_du_mois</block_id></action>
	</block>
</reference>

On le modifie pour que cela donne ceci :

<reference name="left">
	 <block type="core/template" name="block_menu_sidebar_left" before="-" template="sidebar/promo.phtml">
		 <block type="cms/block" name="promotion_du_mois" before="-">
		 	<action method="setBlockId"><block_id>promotion_du_mois</block_id></action>
		 </block>
	 </block>
</reference>

• On crée le dossier « sidebar » dans app/design/frontend/votre_interface/votre_theme/template
• On crée à l’intérieur de ce dossier le fichier promo.phtml, avec à l’intérieur

<div id="promotion_du_mois">
	<?php echo $this->getChildHtml() ?>
</div>

Vous pouvez personnaliser votre fichier .phtml pour mettre en avant un titre, la police, etc. grâce à votre <div>, contrairement à l’étape 1 qui ne permettait que d’afficher le contenu du bloc statique.

Etape 5 : Inclure le contenu d’un bloc statique dans un fichier .phtml sans toucher au XML

Quand on veut rendre administrable un paragraphe texte, on crée un bloc statique avec juste la ligne de texte en question. Pour l’afficher, on n’a pas besoin de créer un bloc dans les fichiers de layout (*.xml) et le positionner, vu que le bloc dans lequel on veut inclure notre texte est déjà défini (et positionné).

Ajoutez donc ceci dans le fichier *.phtml de votre choix (checkout/cart/sidebar.phtml par exemple)

echo $this->getLayout()->createBlock('cms/block&')->setBlockId('id_bloc_statique&')->toHtml() 

N’oubliez pas de changer l’identifiant par celui du bloc créé précédemment.

Cette méthode va plus vite, mais est moins joli que l’ajout depuis les layout.

Etape 6 (extra facultatif) : Listing des blocs statiques sous Magento

• [Article à part]

Etape 7 : Ajouter un bloc statique dans une page statique

Il est possible d’ajouter un bloc statique dans une statique en rajoutant des instructions directement dans le contenu de la page.

{{block type="cms/block" block_id="home-seo"}}

A noter qu’il est possible d’insérer ce code dans un autre bloc statique ou depuis une description d’un produit par exemple.