Bandeau
Escal V3
Site de démonstration

Site de démonstration du jeu de squelettes ESCAL fonctionnant sous SPIP3 et mis à la disposition des Etablissements SColaires de l’Académie de Lyon.

Le bandeau
Article mis en ligne le 29 décembre 2016
dernière modification le 19 février 2017

par Jean Christophe Villeneuve
logo imprimer
Enregistrer au format PDF

Pourquoi commencer par le bandeau ? Parce que c’est le premier élément que verra un visiteur. Alors autant s’appliquer pour qu’il reflète au mieux l’identité de votre site.

Pour avoir un joli bandeau correspondant exactement à vos désirs, le plus simple est de fabriquer une image avec les éléments que vous désirez : photo, texte, logo, ... et d’utiliser l’option 3 proposée par Escal pour le mettre en place.

 Préparer son image

Taille de l’image

Cette image de bandeau doit

  • avoir une largeur au moins égale à celle de votre site.
  • avoir une hauteur limitée pour ne pas "envahir" l’écran
  • avoir une résolution adaptée au web

Cette image s’adaptera automatiquement à la largeur de votre site.

Nous conseillons une image d’environ

  • 2000px de largeur
  • 150 à 200px de hauteur
  • 72 ppp (ou dpi) de résolution

Un outil parmi d’autres

Pas besoin d’un logiciel puissant pour préparer votre image.

PhotoFiltre7 : logiciel gratuit et souvent présent sur les réseaux d’établissement.

Un peu d’aide ?

Un tutoriel vidéo pour réaliser un bandeau avec PhotoFiltre7

Des ressources

Quelques liens vers des ressources de logos et d’images libres sur le site de la DANE

Quelques sites proposant des polices de caractères :

 Mettre en place le bandeau

Transférer l’image sur le serveur

Pour cela, il vous faudra un logiciel de transfert comme Filezilla ou WinSCP.
Les détails de paramétrage de ces logiciels se trouvent dans cet article.

Votre image de bandeau doit être téléversée dans un dossier /squelettes/images/bandeau.

Le dossier /squelettes doit se trouver à la racine du site, au même niveau que /config, /IMG, /ecrire, ... , doit contenir un sous-dossier /images contenant lui-même un sous-sous-dossier /bandeau dans lequel on peut placer plusieurs images de bandeau pour en changer facilement ensuite ou pour faire des tests. Ces dossiers et sous-dossiers sont à créer s’ils n’existent pas.

NB : Pour créer un dossier, on se place dans le dossier parent et on fait un clic droit.

Configurer l’option dans Escal

Par défaut, Escal affiche son logo, le titre du site et, s’ils existent, le descriptif et le slogan du site. Ce qui est assez rudimentaire. On va donc remplacer tout cela par votre super bandeau qui déchire. La procédure est très simple :

  • se rendre dans l’espace privé du site
  • cliquer sur "Squelettes → Escal"
  • cliquer ensuite sur "Généralités → Bandeau"
  • cocher "Option3" dans le premier bloc de configuration
  • choisissez enfin l’image de bandeau dans le menu déroulant du deuxième bloc de configuration
  • cocher "Non" pour le titre, le slogan et le descriptif du site
  • et bien sûr, n’oubliez pas de valider vos choix en bas de la page de configuration

Il n’y a plus qu’à vous rendre sur la partie publique de votre site et de recalculer la page pour voir apparaître votre magnifique bandeau.

 Aller plus loin

Un bandeau différent pour une rubrique ? Un bandeau différent selon la langue ? → Tous les détails dans cet article

Un bandeau avec des images qui changent toutes les 10 secondes ? → Le plugin Nivoslider est fait pour vous et je vous explique tout !


Forum
Répondre à cet article


Plan du site Contact Mentions légales Espace rédacteurs squelette

RSS Valid XHTML 1.0 Strict

2009-2017 © Escal V3 - Tous droits réservés
Site réalisé sous SPIP
avec le squelette ESCAL-V3
Version : 3.87.27