AccueilDernières imagesRechercherS'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.

Le Deal du moment :
Cartes Pokémon 151 : où trouver le ...
Voir le deal

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

    Capouccino
    Capouccino
    FémininAge : 26Messages : 204

    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:

          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."
    Madras
    Madras
    FémininAge : 39Messages : 285

    Mar 4 Nov 2014 - 7:45

    Merci
    Neverose
    Neverose
    FémininAge : 32Messages : 93

    Mar 4 Nov 2014 - 12:23

    Je vais piquer ça hinhin, merci !



    Images en haut et en bas des catégories / de la PA - Page 5 E9SQItc
    Mangédéfruiélégumeuh
    Mangédéfruiélégumeuh
    MasculinAge : 27Messages : 83

    Dim 16 Nov 2014 - 15:39

    Merci :)
    Juniper
    Juniper
    FémininAge : 28Messages : 32

    Jeu 20 Nov 2014 - 3:27

    Merci ! :)



    Images en haut et en bas des catégories / de la PA - Page 5 928788KitSignatureTomoeflower
    Nalex
    Nalex
    FémininAge : 34Messages : 154

    Ven 21 Nov 2014 - 14:10

    J'ai déjà un code pour faire ça, mais je le trouve bizarre... du coup je suis curieuse!
    Merci d'avance ^^



    Images en haut et en bas des catégories / de la PA - Page 5 567962k6yx
    Clémentine
    Clémentine
    FémininAge : 31Messages : 223

    Mar 2 Déc 2014 - 18:47

    Merciiii ^^



    Images en haut et en bas des catégories / de la PA - Page 5 9w9t
    Vii'
    Vii'
    FémininAge : 26Messages : 16

    Lun 22 Déc 2014 - 20:22

    Merci!
    Eil'liathan Tyan'Lirulin
    Eil'liathan Tyan'Lirulin
    FémininAge : 33Messages : 315

    Dim 11 Jan 2015 - 14:52

    Précisément tout ce que je cherche ! Merci
    Dharma
    Dharma
    MasculinAge : 32Messages : 18

    Mer 21 Jan 2015 - 16:05

    Merci cheers
    Professeur Felyne
    Professeur Felyne
    MasculinAge : 38Messages : 85

    Sam 24 Jan 2015 - 17:29

    Merci ^^



    .
    GreenGage
    GreenGage
    FémininAge : 31Messages : 73

    Dim 8 Fév 2015 - 1:37

    Merci beaucoup ! Very Happy
    Monaka
    Monaka
    FémininAge : 31Messages : 137

    Lun 9 Fév 2015 - 21:49

    merci
    Miss Tigri
    Miss Tigri
    FémininAge : 30Messages : 89

    Ven 13 Fév 2015 - 19:03

    Merci ! :)
    Okana
    Okana
    FémininAge : 24Messages : 27

    Dim 15 Fév 2015 - 17:47

    merci
    Hashirama
    Hashirama
    MasculinAge : 26Messages : 63

    Mer 25 Fév 2015 - 22:06

    Merci !
    Kaimie
    Kaimie
    FémininAge : 25Messages : 68

    Mer 4 Mar 2015 - 0:38

    merci
    mikalus
    mikalus
    MasculinAge : 53Messages : 92

    Mer 4 Mar 2015 - 3:22

    ali gato



    Images en haut et en bas des catégories / de la PA - Page 5 766500banpub
    hirondelle
    hirondelle
    FémininAge : 34Messages : 134

    Mer 4 Mar 2015 - 12:48

    merci ☻
    Azuriel
    Azuriel
    FémininAge : 29Messages : 130

    Mer 4 Mar 2015 - 13:37

    Merci ^^
    ginl
    ginl
    FémininAge : 36Messages : 88

    Ven 6 Mar 2015 - 12:07

    thanks :o



    Images en haut et en bas des catégories / de la PA - Page 5 Mjsear10
    Images en haut et en bas des catégories / de la PA - Page 5 Galeri10
    Hayate kimitsu
    Hayate kimitsu
    MasculinAge : 31Messages : 30

    Dim 8 Mar 2015 - 19:26

    Merci x)
    Anonymous
    Invité

    Lun 9 Mar 2015 - 17:28

    Merci pour ce tutoriel ! :)
    .pinkrocks
    .pinkrocks
    FémininAge : 33Messages : 41

    Sam 14 Mar 2015 - 3:28

    Merci pour le partage! Very Happy
    Porn Lemon
    Porn Lemon
    FémininAge : 32Messages : 10

    Lun 16 Mar 2015 - 0:02



    merci Razz
    Bzzzz
    Bzzzz
    FémininAge : 39Messages : 88

    Dim 29 Mar 2015 - 15:23

    Merci
    Contenu sponsorisé


      La date/heure actuelle est Sam 11 Mai 2024 - 5:12