Le blog de Nukleo

Créer simplement un template de page dans CodeIgniter

29 décembre 2010 dans Développement |

Voici une manière simple et efficace de créer un (ou plusieurs) template(s) de page pour un site sous CodeIgniter, sans librairie ni plugin.

Préambule

Nous partirons du principe que nous voulons isoler le (ou les) template(s) du reste des views. Nous partirons également du principe que nous voulons isoler le header et le footer du template pour plus de flexibilité, et notamment pouvoir créer plusieurs templates dont le corps principal est différent (avec ou sans sidebar par exemple).

Le template HTML

Dans le répertoire /application/views créez un dossier nommé « templates« . C’est dans celui-ci que nous placerons les fichiers de notre template. Il y aura 3 fichiers : « template.php », « header.php » et « footer.php ».

template.php

Le fichier le plus simple dont le contenu peut se résumer à ceci :

<?php
$this->load->view("templates/header"); 
$this->load->view($contents);
$this->load->view("templates/footer"); 
?>

Vous remarquerez 3 choses :

  • « templates/ » correspond au dossier que nous avons créé dans le répertoire « application/views ».
  • Nous omettons l’extension des fichiers « header.php » et « footer.php », car c’est CodeIgniter qui l’ajoutera.
  • $contents est une variable (dont le nom importe peu) qui sera définie dans le controlleur et correspondra à la view qui remplira le corps de la page.

header.php

Ce fichier contiendra la partie haute du site — traditionnellement nommée « header » — avec notamment l’en-tête de la page (déclarations html, section head) et la navigation du site (ce qui est à peu près la norme actuelle). Voici un exemple de ce que pourrait contenir ce fichier :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
	<title><?php echo $title; ?></title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta name="description" content="<?php echo $description; ?>" />
	<meta name="keywords" content="<?php echo $keywords; ?>" />
	<link href="/css/styles.css" rel="stylesheet" type="text/css" media="screen" />
</head>

<body>
<div class="wrap">
	<div id="header">
 		<a href="/"><img src="/css/img/logo.png" alt="logo" /></a>
		<ul id="navigation">
 			<li><?php echo anchor(base_url(), 'Accueil'); ?></li>
			<li><?php echo anchor('services', 'Services'); ?></li>
			<li><?php echo anchor('about', 'A propos'); ?></li>
			<li><?php echo anchor('contact', 'Contact'); ?></li>
		</ul>
	</div><!-- end header -->

Là encore rien de compliqué, la seule subtilité tenant dans les variables $title, $description et $keywords qui permettrons simplement de définir ces données dans le controlleur…

footer.php

Ce fichier contiendra, vous l’aurez deviné, le pied de page ainsi que les balises de fermeture de page. Voici un exemple de contenu :

	<div id="footer">
		<p>Informations de copyright</p>
	</div>
</div><!-- end wrap -->

</body>
</html>

Le controlleur

Récoltons les fruits de notre (dur) labeur ! Dans notre controlleur au lieu d’appeler directement une view, nous chargerons celle-ci dans une variable que nous transmettrons à notre template (qui est lui-même une view). par exemple :

function about()
{
	// définition des données variables du template
	$data['title'] = 'Le titre de la page';
	$data['description'] = 'La description de la page pour les moteurs de recherche';
	$data['keywords'] = 'les, mots, clés, de, la, page';
	
	// on charge la view qui contient le corps de la page
	$data['contents'] = 'page_contenu_view';

	// on charge la page dans le template
	$this->load->view('template', $data);
}

Conclusion

Et voilà, vous pouvez maintenant créer très rapidement un ou plusieurs templates de pages !

Mots-clés : ,

Vous avez aimé l'article ? Partagez-le : 

Les commentaires sont fermés.