410 GONE

Besoin d'un conseil e-Commerce / Magento? SEO ? les deux? Contactez moi!

Comment ajouter un block et un template sur la home?

Envie de rajouter un block sur la home Magento ? Suivez ce tutoriel magento et vous verrez l'ensemble du code concernant les zones de type block, templates, layout et modules. Eh oui un affichage sous magento ne se passe pas comme un simple hello world dans n'importe qu'elle autre standard de programmation ... Nous allons aujourd'hui établir un block sur la home de magento. Imaginons que votre affichage soit intemporelle et surtout global. Comme une landing page en javascript par exemple à l'aide d'une lightbox. (Nous ne verrons pas cette partie lightbox ici). Comme toujours pour établir ce tutoriel j'ai analysé le code source de magento. Je vous ai préparé un ensemble de code rempli de truc, tata, plop plopiplop j'en passe et des meilleurs! Pourquoi ? Comme toujours, pour vous permettre de réellement faire un lien entre les différents points du code. Plusieurs étapes ici:
  1. Affichage des chemins des blocks et templates
  2. Création du module support
  3. Modification des layouts de base

Affichage des indications d’emplacement des blocks et templates hints.

Tout d'abord affichons les templates hints et les blocks hints sur le frontend. Pour ce faire direction le back office: System-> configuration -> advanced ->developper  ->Puis changer le scope à (main website), et enfin passer dans Debug à yes:
  • Template Path Hints
  • Add Block Names to Hints
Une petite sauvegarde et purge des caches et le tour est joué ! (voir capture d'écran ci-dessus)

Créons le Module support du block

Nous allons créer un module qui va nous servir à utiliser un block au sens MVC du terme. Pour ce faire, il faut d'abord activer le module: Dans le fichier à créer: app/etc/modules/Valibus_Plopiplop.xml
<?xml version="1.0" ?>
<config>
	<modules>
		<Valibus_Plopiplop>
			<active>True</active>
			<codePool>local</codePool>
		</Valibus_Plopiplop>
	</modules>
</config>
Créons ensuite le fichier block dans app/code/local/Valibus/Plopiplop/Block/Flip.php Comme vous le voyez on se contente d'étendre mage_core_block_template et de mettre en place une méthode d'affichage dans le cadre de tutoriel.
<?php
class Valibus_Plopiplop_Block_Flip extends Mage_Core_Block_Template {
	public function affichageBlockHome(){
		return "Le block sur la home s'affiche";
	}
}
Plaçons ensuite app/code/local/Valibus/Plopiplop/etc/config.xml pour déclarer notre block et la version du module. Comme vous le constatez nous n'avons pas besoin dans ce cas précis de déclarer de layout propre à ce module.
<config>
	<modules>
		<Valibus_Plopiplop>
			<version>0.0.1</version>
		</Valibus_Plopiplop>
	</modules>
	<global>
		<blocks>
			<plopiplop>
				<class>Valibus_Plopiplop_Block</class>
			</plopiplop>
		</blocks>
	</global>
</config>
Notre module créé, nous n'avons plus qu'à créer son template app/design/frontend/base/default/template/tata/truc.phtml Oui je sais pour l'instant tout ça est un peu décousu mais je vous retranscrit ca pelle melle aussi ... (cité de la peur quand tu nous tiens)
<?php
	echo $this->affichageBlockHome();
?>

Modification des layouts et template de base

C'est en principe ici que tout s'articule pour votre compréhensions. (Ou alors que vous êtes perdu ...) Bref comme vous avez pu le remarquer il y a en général selon les pages 2 templates qui selon les cas englobent les autres, j'ai nommé:
  • frontend/base/default/template/page/2columns-right.phtml
  • frontend/base/default/template/page/3columns.phtml
Nous allons donc dans chacun d'entre eux, ajouter une ligne en dessous de l'appel de global notice
<div class="wrapper">
    <?php echo $this->getChildHtml('global_notices') ?>
    <?php echo $this->getChildHtml('plop') ?>
Et le meilleur pour la fin : éditons le fichier app/design/frontend/base/default/layout/page.xml et après la ligne (environ 67) sur les global_notices, rajoutons ceci qui fait tout s'articuler:
<block type="page/html_notices" name="global_notices" as="global_notices" template="page/html/notices.phtml" />
<block type="plopiplop/flip" name="plop" as="plop" template="tata/truc.phtml" />
La ligne qui fait donc le lien entre le nom de notre block flip l'appel référence plop et le template truc. Elle est pas belle la vie? Allé demain je vous fait la même pour l'affcihage sur une page produit en plus propre, parce que là oui, c'est un peu bourrin quand même ! Mais faut pas le dire...Votre rendu devrait donc ressembler à un patchwork multicolor, mais au moins vous arriverez à savoir ce qui est quoi et qui va où !