Charger le tutoriel au format PDF 
Comme dans tous les tutoriels du Site nous partons de la version standard de Ja_Purity_II.
Objectif :
- supprimer le logo (à gauche)
- mettre une image qui fasse la largeur du template (nous prendrons une valeur de 980px par 150px)
- supprimer le header-mask
1- Administration du template
Il va falloir commencer par déterminer une largeur fixe, sinon l'image aura tendance à se déformer (s'étirer en largeur).
Ici, nous prendrons une valeur de 980px, mais bien sûr vous pouvez déterminer une autre valeur.
2- Suppression du logo
Il faut éditer le fichier header.php
Chemin : templates > ja_purity_ii > layouts > blocks > header.php
Nous allons supprimer les lignes suivantes :
<?php
$siteName = $this->sitename();
if ($this->getParam('logoType')=='image'): ?>
<h1 class="logo">
<a href="/index.php" title="<?php echo $siteName; ?>"><span><?php echo $siteName; ?></span></a>
</h1>
<?php else:
$logoText = (trim($this->getParam('logoType-text-logoText'))=='') ? $config->sitename : $this->getParam('logoType-text-logoText');
$sloganText = (trim($this->getParam('logoType-text-sloganText'))=='') ? JText::_('SITE SLOGAN') : $this->getParam('logoType-text-sloganText');?>
<div class="logo-text">
<h1><a href="/index.php" title="<?php echo $siteName; ?>"><span><?php echo $logoText; ?></span></a></h1>
<p class="site-slogan"><?php echo $sloganText;?></p>
</div>
<?php endif; ?>
Voila le résultat :
3- Suppression du header-Mask
Toujours dans header.php, nous allons supprimer ceci :
<div class="ja-headermask"> </div>
Voila le résultat :
4- Ajout de l'image.
Il suffit de créer une image de de 980px par 150px (ou les valeurs de votre choix).
Puis de les envoyer par FTP dans le dossier :
Chemin : templates > ja_purity_ii > images > header
Résultat :
On peut constater que l'image est rognée en bas.
En effet, notre image a une hauteur de 150px, or par défaut le header mesure 80px de haut.
Nous allons donc modifier le fichier template.css
Chemin : template > ja_purity_ii > css > template.css
Nous trouvons :
#ja-header .main {
background-color: #333;
background-position: top right;
background-repeat: no-repeat;
height: 80px;
}
Nous allons modifier comme suit :
#ja-header .main {
background-color: #333;
background-position: top right;
background-repeat: no-repeat;
height: 150px;
}
Résultat :
5- Options
- Suppression des icônes d'adaptation de taille écran et police
dans header.php, nous allons supprimer ceci :
<?php $this->loadBlock('usertools/screen') ?>
<?php $this->loadBlock('usertools/font') ?>
Résultat :
- Suppression du module recherche :
Le plus simple est de le désactiver dans l'administration de Joomla
Maintenant, on peut également supprimer l'appel de ce module dans header.php, ou bien l'afficher dans une autre zône du template.
Pour ce faire il faudra couper le code suivant, pour le coller à l'endroit voulu :
<div id="ja-search">
<jdoc:include type="modules" name="search" />
</div>
<?php endif; ?>Résultat :
