AccueilRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

-35%
Le deal à ne pas rater :
[Ventre flash] Xbox One S All Digital + 3 jeux + 1 mois au Xbox Live ...
149.99 € 229.99 €
Voir le deal

    Images en haut et en bas des catégories / de la PA

    Capouccino
    Capouccino
    FémininAge : 22Messages : 204

    le Mer 6 Nov 2013 - 16:19

    Rappel du premier message :


    Difficulté: ●●○○○
    Templates: index_box | index_body
    Images en haut et en bas des catégories / de la PA
    Bonjour, voici donc un tuto qui va nous permettre d'ajouter des images aux en-têtes et aux pieds de catégories ainsi que de la page d'accueil (abrégée PA pour ce tuto)

       I/Des images pour les catégories

    Voici un schéma illustrant le rendu final de cette partie:
    Spoiler:
    Images en haut et en bas des catégories / de la PA - Page 2 41367800schmatuto

          A/L'en-tête des catégories

    Tout d'abord, il nous faudra aller dans Templates > index_box et trouver ceci:
    Code:
    <!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
     <tr>
     <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
     <th nowrap="nowrap" width="50">{L_TOPICS}</th>
     <th nowrap="nowrap" width="50">{L_POSTS}</th>
     <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
     </tr>
     <!-- END tablehead -->
    Maintenant, deux chois s'offrent à nous :
    1. soit nous remplaçons l'intégralité du code ci-dessus par celui-là:
    Code:
    <!-- BEGIN tablehead -->
    <div style="text-align:center; background-position:bottom center; background-image:url('URL DE L'IMAGE');height: Xpx; width:Xpx"><span class="secondarytitle">{catrow.tablehead.L_FORUM}</span></div>
    <table class="forumline" width="Xpx" border="0" cellspacing="1" cellpadding="0">
     <!-- END tablehead -->
    Le height: Xpx indique la hauteur que ferra votre image ; le width:Xpx est la taille des catégories de votre forum (on le retrouve d'ailleurs un peu plus bas dans le code)

    2. soit nous remplaçons le premier code par celui-ci:
    Code:
    <!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
     <tr>
    <td><div class="secondarytitle" style="background-image:url('URL DE L'IMAGE'); background-position:center center">{catrow.tablehead.L_FORUM}</div>
     </tr>
     <!-- END tablehead -->
    Concernant cette deuxième solution, je ne l'ai pas testée.

          B/Le pied des catégories

    Maintenant, cherchons cela:
    Code:
    <!-- BEGIN tablefoot -->
    </table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot -->
    Et ajoutons y ce morceau de code avant img src :
    Code:
    <img src="URL DE L'IMAGE"/>
     &nbsp; II/Des images pour la page d'accueil

    Le rendu de cette partie est le même que pour les catégories sauf qu'il s'applique à la PA.

    D'abord, allons dans Templates > index_body et cherchons le morceau de code suivant:
    Code:
    <!-- BEGIN message_admin_index -->
    <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
       <!-- BEGIN message_admin_titre -->
       <tr>
          <td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
       </tr>
       <!-- END message_admin_titre -->
       <!-- BEGIN message_admin_txt -->
       <tr>
          <td class="row1" rowspan="3" align="center" valign="middle">
          <div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
          </td>
       </tr>
       <!-- END message_admin_txt -->
    </table>
    <!-- END message_admin_index -->
    Après le " BEGIN message_admin_index " , placez une balise d'image:
    Code:
    <img src="URL DE L'IMAGE"></img>
    Et faites de même avant le " END message_admin_index "


    Voilà ^^


    PS : les titres de catégorie risquerons de ne pas être bien placer au milieu de l'image de background, je ne sais pas comment les replacer...
    PS2 : Si en plus des images de background de vos catégories vous voulez mettre des images en guise de titre de catégorie, je vous conseil de lire ce tuto rédigé par notre bon vieux capitaine =)


    Il faut parfois beaucoup de temps pour écrire un tuto mais dire merci ne prend que 2 secondes :3


    Si vous avez des problèmes avec ce LS, venez poster ici.



    "Espérer l'inespérable c'est croire en l'impossible."
    xL2auurie
    xL2auurie
    FémininAge : 25Messages : 23

    le Dim 19 Jan 2014 - 23:07

    Merci du partage ! Ca fait des mois que je cherche l'astuce
    Malice1329
    Malice1329
    FémininAge : 31Messages : 80

    le Jeu 23 Jan 2014 - 19:05

    merci énormément je cherchais justement un tuto de ce genre



    Images en haut et en bas des catégories / de la PA - Page 2 Henry
    Kruzoé
    Kruzoé
    FémininAge : 25Messages : 30

    le Jeu 23 Jan 2014 - 20:10

    Merci :)
    Geen
    Geen
    FémininAge : 20Messages : 33

    le Sam 1 Fév 2014 - 17:48

    Thanks ♥
    #FifuKing.
    #FifuKing.
    MasculinAge : 23Messages : 37

    le Sam 1 Fév 2014 - 18:38

    Merci à toi (8
    Mowwie
    Mowwie
    FémininAge : 30Messages : 28

    le Sam 1 Fév 2014 - 22:59

    Merci
    Ukrysis
    Ukrysis
    FémininAge : 23Messages : 64

    le Sam 8 Fév 2014 - 22:04

    Merci !
    SNMitsuki
    SNMitsuki
    FémininAge : 22Messages : 63

    le Dim 9 Fév 2014 - 12:19

    Il est supr ce tuto, merci ! :3



    Images en haut et en bas des catégories / de la PA - Page 2 250032Sanstitre1
    Lakxi
    Lakxi
    FémininAge : 27Messages : 40

    le Dim 9 Fév 2014 - 13:11

    parfait ! je le cherchais justement. merci beaucoup :)
    Eldiir
    Eldiir
    FémininAge : 34Messages : 33

    le Dim 16 Fév 2014 - 4:58

    Merci à toi!
    Elyzabeth
    Elyzabeth
    FémininAge : 28Messages : 40

    le Dim 16 Fév 2014 - 8:41

    Merci ♥
    Dezaia
    Dezaia
    FémininAge : 25Messages : 40

    le Lun 17 Fév 2014 - 20:37

    Merci !



    Images en haut et en bas des catégories / de la PA - Page 2 69802510
    Fallaha
    Fallaha
    FémininMessages : 80

    le Ven 21 Fév 2014 - 4:07

    merci Very Happy
    hoterion
    hoterion
    FémininAge : 28Messages : 75

    le Sam 1 Mar 2014 - 0:35

    Super merci ^^



    Images en haut et en bas des catégories / de la PA - Page 2 Sing10
    Rowana
    Rowana
    FémininAge : 18Messages : 22

    le Sam 1 Mar 2014 - 10:37

    Merci!
    Rebel'z
    Rebel'z
    FémininAge : 34Messages : 18

    le Sam 1 Mar 2014 - 23:02

    Merci
    Leetchi
    Leetchi
    FémininAge : 24Messages : 17

    le Lun 3 Mar 2014 - 16:51

    Merci !
    shala
    shala
    FémininAge : 28Messages : 213

    le Mer 5 Mar 2014 - 21:31

    merci



    MsCrazy.E
    MsCrazy.E
    FémininAge : 23Messages : 183

    le Jeu 6 Mar 2014 - 10:42

    Merci :)



    Images en haut et en bas des catégories / de la PA - Page 2 Nu_a_b10
    avatar
    Corinette
    FémininAge : 23Messages : 7

    le Ven 7 Mar 2014 - 21:57

    merci :)
    Dastan
    Dastan
    MasculinAge : 36Messages : 111

    le Dim 9 Mar 2014 - 14:17

    oh merci beaucoup !
    C. Hook
    C. Hook
    FémininAge : 22Messages : 45

    le Lun 10 Mar 2014 - 2:18

    merci :3
    Aile
    Aile
    FémininAge : 32Messages : 134

    le Lun 10 Mar 2014 - 13:25

    Je vais essayer sur mon forum test. Je suis curieuse de voir le résultat. Un grand merci à toi.



    Images en haut et en bas des catégories / de la PA - Page 2 799284Sanstitre1
    Opaline
    Opaline
    FémininAge : 20Messages : 86

    le Mar 11 Mar 2014 - 16:18

    Merci !



    Images en haut et en bas des catégories / de la PA - Page 2 140502022634448028
    Gaki
    Gaki
    FémininAge : 24Messages : 21

    le Jeu 13 Mar 2014 - 18:30

    Merci !
    Contenu sponsorisé


      La date/heure actuelle est Sam 6 Juin 2020 - 12:34