Insérer une bannière en pied de page

[w8ddle]

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : depuis toujours
Lien du forum : http://uffc.forumactif.org/

Description du problème

Bonjour,
je souhaiterais mettre une bannière "image" en bas de chaque page de mon forum mais je ne sais pas comment faire. J'ai vu plusieurs tutos où il faut que je change le template mais cela ne fonctionne pas.
Quel template dois-je prendre ?
Où dois-je mettre le lien de cette bannière ?

Merci de votre réponse

[MlleAlys]

Bonjour,
vous pouvez également utiliser un code javascript :

• dans Modules > javascript
  
• vérifiez que la gestion des codes javascript est bien activée
  
• créez un nouveau code javascript
  
• donnez lui un titre ("bannière pied de page" par exempl )
  
• cochez "sur toutes les pages" pour que l'image s'affiche sur toutes les pages du forum
  
• dans la zone de saisie collez le code suivant :
  

  Code:

  $(function()  {
  $("#page-footer,#gfooter,#pun-foot").eq(0).append('<img id="banniere-bas" src="URL DE L'IMAGE" />');
});

  Le code cherche l'élément d'identifiant page-footer, ou gfooter, ou punfoot (en fonction de la version du forum, en phpbb2 c'est page-footer qui est trouvé), et ajoute à cet élément ce qu'il y a dans la dernière parenthèse, ici une image ^^
  
• remplacez URL DE L'IMAGE par l'url de l'image souhaitée
  
• enregistrez.

Si vous souhaitez modifier la mise en forme de l'image ajoutée, vous pourrez le faire via votre feuille de style css via l'identifiant #banniere-bas qui a été appliqué à l'image ^^

[w8ddle]

Merci Alys, ça fonctionne, j'ai bien l'image, par contre pour la seconde partie je ne sais où trouver la feuille de style CSS.

[MlleAlys]

La feuille de style se trouve dans la partie affichage > couleurs > onglet "feuille de style css"
Vous pouvez par exemple y ajouter le code suivant :

Code:

#banniere-bas {
  display: block;
  margin: auto;
  width: 800px;
}

où
display: block; permet de forcer l'image sur une nouvelle ligne et de centrer l'image grâce au code suivant :
margin: auto; permet de centrer l'image
width: 800px; permet de régler la largeur de l'image

[w8ddle]

Merci.
Mais j'ai 2 petits soucis:
- mon image parait "trouble"
- c'est une image en .PNG et le contour est blanc

[MlleAlys]

L'image est trouble parce qu'elle fait normalement 797px de large et vous l'avez agrandie à 1100px. Si elle devait être plus grande, c'est peut être que lorsque vous l'avez hébergée sur servimg, l'option "redimensionner l'image" était sélectionnée, ce qui fait qu'elle a été diminuée. Sinon, il vous faudra refaire une image plus grande pour éviter qu'elle ne paraisse floue.

Le fond blanc, s'il n'est pas sur l'image avant que vous l'ayez hébergée, vient aussi certainement de l'hébergeur servimg, il pose parfois ce problème lors d'images un peu trop grandes en .png ...

Essayez donc d'héberger votre image sur un autre hébergeur, par exemple https://www.zupimages.net/ (ça peut être un autre bien sûr, c'est juste celui que j'avais sous la main à cet instant ^^)

[w8ddle]

Génial ça marche !!!!!

Une toute dernière chose, comment l'insérer entre le Panneau d'Admin et les CGU ?

[MlleAlys]

désolée, je ne vois pas de quel endroit vous parlez... vous voulez dire, au dessus des liens de bas de page plutôt qu'en dessous ? Sinon, une capture pour montrer où peut être ?

[w8ddle]

à l'endroit du marquage jaune

[MlleAlys]

ok, remplacez votre code javascript par celui là :

Code:

$(function()  {
  $("#page-footer strong").eq(0).append('<img id="banniere-bas" src="URL DE L'IMAGE" />');
});

remplacez URL DE L'IMAGE par l'url de votre bannière

[w8ddle]

SUPER !!!! merci beaucoup, vraiment