1 Templates + CSS : Ajouter un header en phpbb2 23/2/2009, 21:22
Ce tutoriel a été publié par ze_chaofan sur SOS-Forum. Afin que les tutoriels de SOS-Forum restent en libre accès, ainsi que par respect du travail accompli, tout tutoriel copié ou s'en inspirant publié ailleurs qu'ici, devra en citer le ou les auteurs ainsi que la provenance via un lien vers ce sujet sur le SOS-Forum. |
Hello...
J'ai vu cette question sur le forum de support officiel, et en cherchant un peu, j'ai trouvé que la solutin était assez simple en fait.
Avant tout, petit rappel, pour modifier les templates votre forum doit être en phpbb2, et vous devez en être le fondateur.
Voici ce que peut donner un header bleu :
Alors commençons par les templates. Une toute petite modifications de rien du tout, mais essentielle. Pour ceci, ouvrez le template "overall_header_new", et cherchez :
Puis remplacez par :<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<!-- BEGIN switch_logo_left -->
Validez et confirmez.<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr class="headerbar">
<!-- BEGIN switch_logo_left -->
Ensuite, on va personnaliser ce header. Rendez-vous dans votre CSS, et collez ceci en complétant :
.headerbar {
background-attachment: fixed;
background-color: #color;
background-image: url("adresse_url_de_l'image_de_fond");
background-repeat: repeat;
background-position: top left;
}
En noir :
- Pour que l'image ne défile pas lorsque vous descendez, inscrivez fixed
- Pour que l'image défile lorsque vous descendez, inscrivez scroll
En marron :
- Modifiez #color par la couleur de fond que vous souhaitez attribuer à la zone
En vert :
- Pour que l'image ne se répète pas, inscrivez no-repeat
- Pour que l'image se répète en mosaïque, inscrivez repeat
- Pour que l'image se répète horizontalement, inscrivez repeat-x
- Pour que l'image se répète verticalement, inscrivez repeat-y
En orange :
- Pour aligner le fond en haut, inscrivez top
- Pour aligner le fond en bas, inscrivez bottom
- Pour aligner le fond au centre, inscrivez center
En rouge :
- Pour aligner le fond à gauche, inscrivez left
- Pour aligner le fond à droite, inscrivez right
- Pour aligner le fond au centre, inscrivez center
Validez, et c'est bon !