Purity2.fr

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 :

7
8
9
10
11
12
13
14
15
16
17
18
19
20

	<?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 :

5

	<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 :

978
979
980
981
982
983

#ja-header .main {
	background-color: #333;
	background-position: top right;
	background-repeat: no-repeat;
	height: 80px;
}

Nous allons modifier comme suit :

978
979
980
981
982
983

#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 :

22
23

	<?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 :

25
26
27
28
29

	<?php if($this->countModules('search')) : ?>
	<div id="ja-search">
		<jdoc:include type="modules" name="search" />
	</div>
	<?php endif; ?>

Résultat :