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 ?
Des ressources
Quelques sites proposant des polices de caractères :
Quelques idées pour mettre du texte sur une image :
https://blogs.articulate.com/les-essentiels-du-elearning/7-facons-de-mettre-texte-photo/
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 !
