Découvrir le conceptSans inscriptionMettez les créditsCommandes ouvertes
Le deal à ne pas rater :
Cartes Pokémon 151 : où trouver le coffret Collection Alakazam-ex ?
Voir le deal

KoalaVolant
KoalaVolant
Mar 20 Déc 2022 - 10:31
Version du forum : PHPBB2

Ceci est un code appartenant à un thème complet. Vous pouvez
Voir le thème complet "Gang Technology"
Si vous utilisez d'autres codes de ce thème, vous n'avez pas besoin de recopier-coller la partie "couleurs".




Particularités du code :
- Crédits : KoalaVolant
- Il y a deux versions de ce panneau d'affichage : un avec une sorte de système de points par groupe, et une autre sans ça. Les deux ont une structure différentes.
- Celui ci c'est celui avec le système de points.

Couleurs & Polices d'écriture


  1. Pour rappel, ce code appartient à un thème complet. Si vous utilisez déjà d'autres codes de ce thème, vous pouvez esquiver cette partie. Elle concerne les couleurs, et les polices d'écriture.

    Sinon : les couleurs sont à placer où vous voulez, mais quand vous les modifierez, elles se modifieront partout où les "variables" sont utilisées.

    Ce code utilise un système de “variables” rangé dans un “:root”.
    Si vous trouvez :root { } dans votre CSS déjà actuel, coller ce qu’il y a à l’intérieur du :root suivant, dans celui que vous possédez déjà.
    Attention, il peut y avoir des conflits de variable. Il ne peut pas y avoir deux mêmes variables. (genre, pas deux fois de --color1). Si c’est le cas, il suffit de renommer “--fond” par exemple en “--main-color-banane” (ce que vous voulez), partout dans le code.
    Pour rechercher et remplacer dans tout un code : https://convertir.github.io/outils/remplacer-texte-en-ligne.html

    Note : Si vous utilisez plusieurs codes de Pisrale n'appartenant pas à ce thème, il y a des chances qu’il y ait des conflits. Si vous voulez qu’on modifie les codes pour vous, suivez un de ces boutons

    Personnaliser mon code
    Signaler un souci

  2. Pour copier coller le ":root" il faut aller dans le Panneau d'administration > Affichage > Couleurs et CSS > Feuille de style CSS et copier coller ça :

    Code:
    :root{
        --fond-deg:linear-gradient(90deg, var(--dark) 32.29%, var(--light) 89.86%);
        --fond-img:url('https://www.zupimages.net/up/22/45/f0t6.png');
        --fond-img2:url('https://www.zupimages.net/up/22/45/f0t6.png');
        --fond-bodyline:#4d4d4d;
        --dark:#531b37;
        --light:#88263C;
        
        --black:#FDE8ED;
        --white:#dedede;
      --whitef:#363636;
        
        --text-shadow:0px 0px 0px #757575;
        --font-text:'Inter', sans-serif;
        --font-title:'GothamPro', sans-serif;
      
      --groupe1:#d7ba83;
    --groupe2:#ff85a7;
    --groupe3:#88c6ff;
    --groupe4:#6ed373;
    }

  3. Attention, les polices d'écriture utilisées sur ce thème sont "Inter" et "Gotham Pro" dans ce but, donc, il vous faudra les installer. Pour ça, connectez vous au compte fondateur, allez dans le Panneau d'administration > Affichage > Templates > Haut du forum (overall-header) et avant le "< /head>" (sans espace), copiez coller ça :
    Code:
      <!-- FONTS DU FORUM -->
      <link href="https://cdn.statically.io/gist/mfd/f3d96ec7f0e8f034cc22ea73b3797b59/raw/fad2f254369fb54250260077a4c87391a6280c52/gotham.css" rel="stylesheet">
        <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&display=swap" rel="stylesheet">

  4. Vous pouvez bien sûr changer les fonts par autre chose, en allant vous servir sur Google Fonts Very Happy



Page HTML & CSS

  1. Les couleurs avec le root et les fonts sont intégrés directement dans la page HTML et seront à modifier ici aussi en plus du CSS de base du forum

  2. Le panneau d'affichage est un peu spécial, il est modifiable via les pages HTML. Pour ça il faut aller dans le Panneau d'administration > Modules > Gestion des pages HTML

  3. Créez une nouvelle page HTML, en "mode avancé".

  4. Dans Contenu de la page, copiez coller ça :

    Code:
    <style>
    /* COLORS */
    @import url('https://cdn.statically.io/gist/mfd/f3d96ec7f0e8f034cc22ea73b3797b59/raw/fad2f254369fb54250260077a4c87391a6280c52/gotham.css');

    :root{
        --fond-deg:linear-gradient(90deg, #210513 32.29%, #3A0511 89.86%);
        --fond-img:url('https://www.zupimages.net/up/22/45/f0t6.png');
        --fond-img2:url('https://www.zupimages.net/up/22/45/f0t6.png');
        --fond-bodyline:#8E7B8E;
        --dark:#210513;
        --light:#3A0511;
        
        --black:#BFBFBF;
        --white:#dedede;
      --whitef:#363636;
        
        --text-shadow:0px 0px 0px #757575;
        --font-text:'Inter', sans-serif;
        --font-title:'GothamPro', sans-serif;
      
      --groupe1:#ff85a7;
    --groupe2:#ad8334;
    --groupe3:#3473ad;
    --groupe4:#127a17;
      
      --gang1:linear-gradient(0deg, rgba(217,237,255,0.3) 0%, #4A5C73 100%);
      --gang2:linear-gradient(0deg, rgba(243,217,255,0.3) 0%, #5C4367 100%);
      --gang3:linear-gradient(0deg, rgba(255,229,217,0.3) 0%, #6C5746 100%);
      --gang4:linear-gradient(0deg, rgba(255,217,217,0.3) 0%, #6A4646 100%);
    }

    /* BODY ET CHOSES DE BASE */
    a, a:hover{ text-decoration:none !important; }
    *{ box-sizing:border-box; }
    img{ object-fit:cover; }

      /* PANNEAU GENERAL */

    .panneaubyl{ width:100%; display:flex; flex-wrap:wrap; font-family:var(--font-text); }
     
      /* MESSAGE */
      
      .panneaumessage{ margin-bottom:5px;width:100%; background:var(--fond-deg); color:var(--white); text-shadow:var(--text-shadow); padding:5px; letter-spacing:1px; text-align:center; font-size:11px; }
     
      /* GANGS */
      
      .panneaugangs{ display:flex; width:33%; justify-content:space-between; flex-wrap:wrap; }
      .panneaugangs .gangg{ background:var(--gang1); width:24%; height:95px; padding:10px 0; color:var(--white);
      font-family:var(--font-title); font-weight:100; }
      .panneaugangs .gang1{ background:var(--gang1); }
      .panneaugangs .gang2{ background:var(--gang2); }
      .panneaugangs .gang3{ background:var(--gang3); }
      .panneaugangs .gang4{ background:var(--gang4); }
      
      .panneaugangs .gangg .titre{ display:block; text-align:center; font-size:14px; margin-bottom:20px; }
      .panneaugangs .gangg .points{ text-align:center; display:block; }
      .panneaugangs .gangg .points strong{ display:block; font-size:18px; }
      
      .panneaugangs a{ display:block; width:100%; background:var(--fond-deg); padding:5px; text-align:center;
      font-family:var(--font-text); font-weight:100; font-size:12px; color:var(--white); text-shadow:var(--text-shadow);
      margin-top:2px; letter-spacing:1px; transition:500ms; }
      .panneaugangs a:hover{ letter-spacing:2px; transition:500ms; }
      
      /* A DETROIT */
      
      .panneauevent{ width:25%; margin:0 5px; }
      .panneauevent a{ color:var(--groupe1); }
      .panneaubyl .panneautitre{ background:var(--fond-img2); color:var(--white); font-family:var(--font-title); font-weight:200; background-position:center; background-size:100%;
      font-size:12px; padding:4px; text-shadow:var(--text-shadow); letter-spacing:1px; }
      .panneauevent span{ display:block; background:var(--whitef); color:var(--black); font-size:11px; line-height:15px; padding:5px; height:98px; overflow:auto; }
      
      /* VOTE */
      .panneauvote{ width:10%; display:flex; justify-content:center; flex-wrap:wrap; align-items:center; margin-right:5px;}
      .panneauvote img{ width:30px; height:30px; filter: grayscale(0%); transition:500ms; margin:5px; }
      .panneauvote img:hover{ filter: grayscale(100%); transition:500ms; }
      .panneauvote .panneauvotemess{ width:100%; font-size:11px; font-family:var(--font-title); text-align:center;  }
      .panneauvote .panneauvotemess a{ color:var(--groupe1) !important; text-align:center; }
      .panneauvote .panneauvotemess a:hover{ color:var(--black) !important; }
      
      
      /* PREDEFS */
      
      .panneaupredef{ width:30%; border:1px solid var(--light); }
      .panneaupredef span{ display:flex; justify-content:center; flex-wrap:wrap; padding:5px;}
      .panneaupredef span img{ width:40px; height:40px; margin:2px; opacity:0.5; transition:500ms; }
      .panneaupredef span img:hover{ opacity:1; transition:500ms; }
      
        /* LIENS */
      
      .panneaulinks{ width:100%; display:flex; justify-content:space-between; margin-top:5px;}
      .panneaulinks a{ margin:2px; display:block; background:var(--light); color:var(--white); transition:300ms; padding:5px; text-align:center;
      font-size:12px; letter-spacing:1px; font-family:var(--font-title); font-weight:200; display:flex; align-items:center; justify-content:center; }
      .panneaulinks a:hover{ background:var(--dark); transition:300ms; }
    </style>   <meta charset="UTF-8" />    <div class="panneaubyl">
                         
       <!--          MESSAGE DE DEBUT          -->          
       <div class="panneaumessage">
                  Blabla sur votre forum        
       </div>
                         
       <!--   GUERRE DES GANGS   -->  
       <div class="panneaugangs">
                      
          <div class="gangg gang1">
              <span class="titre">Groupe 1</span><span class="points"><strong>0</strong> points</span>
          </div>
                      
          <div class="gangg gang2">
              <span class="titre">Groupe 2</span><span class="points"><strong>0</strong> points</span>
          </div>
                      
          <div class="gangg gang3">
              <span class="titre">Groupe 3</span><span class="points"><strong>0</strong> points</span>
          </div>
                      
          <div class="gangg gang4">
              <span class="titre">Groupe 4</span><span class="points"><strong>0</strong> points</span>
          </div>
                     <a href="#" target="_blank">Participer à la <strong>guerre des gangs</strong></a>
       </div>
         
       <!--          EVENT DU MOMENT          -->          
       <div class="panneauevent">
                              
          <div class="panneautitre">
                     Les events    
          </div>
                      <span><br /> Bleh bleh bleh</span>          
       </div>
                         
       <!--          FIN EVENT          -->          
       <!--          VOTES          -->          
       <div class="panneauvote">
                      <a target="_blank" href="http://www.root-top.com/topsite/obsession27/in.php?ID=26891"><img src="https://www.zupimages.net/up/22/46/whq1.png" /></a>    <a target="_blank" href="http://www.root-top.com/topsite/pubrpgdesign/in.php?ID=3029"><img src="https://www.zupimages.net/up/22/46/whq1.png" /></a>    <a target="_blank" href="http://www.root-top.com/topsite/bazzart/in.php?ID=2902"><img src="https://www.zupimages.net/up/22/46/whq1.png" /></a> <span class="panneauvotemess"><a target="_blank" href="https://becomeyourlife.forumactif.com/t233-tops-sites-toutes-les-deux-heures#624">Votez (toutes les 2h)</a></span>          
       </div>
                         
       <!--          FIN VOTES          -->          
       <!--          PREDEFINIS          -->          
       <div class="panneaupredef">
                              
          <div class="panneautitre">
                     Mais <strong>où</strong> êtes vous ?        
          </div>
                      <span>         <a target="_blank" href="#"><img src="https://i.pinimg.com/originals/30/ce/09/30ce097d101abf0a7970d0e7c87d3b44.jpg" /></a>  
                                  <a target="_blank" href=""><img src="https://www.zupimages.net/up/22/45/930a.png" /></a>    
                                  <a target="_blank" href=""><img src="https://www.zupimages.net/up/22/45/930a.png" /></a>    
                                  <a target="_blank" href=""><img src="https://www.zupimages.net/up/22/45/930a.png" /></a>    
                                  <a target="_blank" href=""><img src="https://www.zupimages.net/up/22/45/930a.png" /></a>    
                                  <a target="_blank" href=""><img src="https://www.zupimages.net/up/22/45/930a.png" /></a>  
                                  <a target="_blank" href=""><img src="https://www.zupimages.net/up/22/45/930a.png" /></a>  
                                  <a target="_blank" href=""><img src="https://www.zupimages.net/up/22/45/930a.png" /></a>    
                                  <a target="_blank" href=""><img src="https://www.zupimages.net/up/22/45/930a.png" /></a>    
                                  <a target="_blank" href=""><img src="https://www.zupimages.net/up/22/45/930a.png" /></a>    </span>          
       </div>
                         
       <!--          FIN PREDEFINIS          -->            
       <!--          LIENS          -->          
       <div class="panneaulinks">
          <a target="_blank" href="https://becomeyourlife.forumactif.com/t221-guide-du-debutant">Guide du débutant</a>    
              <a target="_blank" href="https://becomeyourlife.forumactif.com/t199-reglement">Règlement</a>    
              <a target="_blank" href="https://becomeyourlife.forumactif.com/t201-contexte">Contexte</a>    
              <a target="_blank" href="https://becomeyourlife.forumactif.com/t202-groupes">Groupes</a>    
              <a target="_blank" href="https://becomeyourlife.forumactif.com/f1-annexes">Annexes</a>    
              <a target="_blank" href="https://becomeyourlife.forumactif.com/f40-listings">Bottins</a>    
              <a target="_blank" href="https://becomeyourlife.forumactif.com/t235-invites-fonctionnement">Invités</a>    
              <a target="_blank" href="https://becomeyourlife.forumactif.com/f12-partenariats">Partenariats</a>          
       </div>
                         
       <!--          FIN DES LIENS          -->
    </div>
    <!--          FIN PANNEAU D'AFFICHAGE          -->



HTML

  1. Gardez dans un coin le lien de la page HTML que vous avez crée plus haut.

  2. Avec le compte fondateur, il faut aller dans Panneau d'administration > Affichage > Templates > overall_header
    Appuyez sur la roue crantée pour le modifier

  3. Repérez
    Code:
             <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
                <tr>
                   <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
                </tr>
             </table>

  4. Juste avant ce code donc juste avant le début du "table", copier coller ce code en remplissant le "LIENDUPANNEAU" par votre lien.

    Code:
       <div>
    <iframe scrolling="no" frameborder="0" marginheight="0" style="width: 100%; height: 200px;" src="LIENDELAPAGE"></iframe>
                </div>

  5. Validez une fois que c'est bon (il faut confirmer la modification une fois de retour dans la page des templates

  6. Si vous avez des soucis n'hésitez pas à le signaler.
    Signaler un souci



Dernière édition par KoalaVolant le Jeu 29 Déc 2022 - 10:08, édité 1 fois
KoalaVolant
KoalaVolant
Mer 28 Déc 2022 - 14:46
jkhkjgjkg
KoalaVolant
KoalaVolant
Jeu 29 Déc 2022 - 10:10
Version du forum : PHPBB2

Ceci est un code appartenant à un thème complet. Vous pouvez
Voir le thème complet "Gang Technology"
Si vous utilisez d'autres codes de ce thème, vous n'avez pas besoin de recopier-coller la partie "couleurs".




Particularités du code :
- Crédits : KoalaVolant
- Il y a deux versions de ce panneau d'affichage : un avec une sorte de système de points par groupe, et une autre sans ça. Les deux ont une structure différentes.

Couleurs & Polices d'écriture


  1. Pour rappel, ce code appartient à un thème complet. Si vous utilisez déjà d'autres codes de ce thème, vous pouvez esquiver cette partie. Elle concerne les couleurs, et les polices d'écriture.

    Sinon : les couleurs sont à placer où vous voulez, mais quand vous les modifierez, elles se modifieront partout où les "variables" sont utilisées.

    Ce code utilise un système de “variables” rangé dans un “:root”.
    Si vous trouvez :root { } dans votre CSS déjà actuel, coller ce qu’il y a à l’intérieur du :root suivant, dans celui que vous possédez déjà.
    Attention, il peut y avoir des conflits de variable. Il ne peut pas y avoir deux mêmes variables. (genre, pas deux fois de --color1). Si c’est le cas, il suffit de renommer “--fond” par exemple en “--main-color-banane” (ce que vous voulez), partout dans le code.
    Pour rechercher et remplacer dans tout un code : https://convertir.github.io/outils/remplacer-texte-en-ligne.html

    Note : Si vous utilisez plusieurs codes de Pisrale n'appartenant pas à ce thème, il y a des chances qu’il y ait des conflits. Si vous voulez qu’on modifie les codes pour vous, suivez un de ces boutons

    Personnaliser mon code
    Signaler un souci

  2. Pour copier coller le ":root" il faut aller dans le Panneau d'administration > Affichage > Couleurs et CSS > Feuille de style CSS et copier coller ça :

    Code:
    :root{
        --fond-deg:linear-gradient(90deg, var(--dark) 32.29%, var(--light) 89.86%);
        --fond-img:url('https://www.zupimages.net/up/22/45/f0t6.png');
        --fond-img2:url('https://www.zupimages.net/up/22/45/f0t6.png');
        --fond-bodyline:#4d4d4d;
        --dark:#531b37;
        --light:#88263C;
        
        --black:#FDE8ED;
        --white:#dedede;
      --whitef:#363636;
        
        --text-shadow:0px 0px 0px #757575;
        --font-text:'Inter', sans-serif;
        --font-title:'GothamPro', sans-serif;
      
      --groupe1:#d7ba83;
    --groupe2:#ff85a7;
    --groupe3:#88c6ff;
    --groupe4:#6ed373;
    }

  3. Attention, les polices d'écriture utilisées sur ce thème sont "Inter" et "Gotham Pro" dans ce but, donc, il vous faudra les installer. Pour ça, connectez vous au compte fondateur, allez dans le Panneau d'administration > Affichage > Templates > Haut du forum (overall-header) et avant le "< /head>" (sans espace), copiez coller ça :
    Code:
      <!-- FONTS DU FORUM -->
      <link href="https://cdn.statically.io/gist/mfd/f3d96ec7f0e8f034cc22ea73b3797b59/raw/fad2f254369fb54250260077a4c87391a6280c52/gotham.css" rel="stylesheet">
        <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&display=swap" rel="stylesheet">

  4. Vous pouvez bien sûr changer les fonts par autre chose, en allant vous servir sur Google Fonts Very Happy



Page HTML & CSS

  1. Les couleurs avec le root et les fonts sont intégrés directement dans la page HTML et seront à modifier ici aussi en plus du CSS de base du forum

  2. Le panneau d'affichage est un peu spécial, il est modifiable via les pages HTML. Pour ça il faut aller dans le Panneau d'administration > Modules > Gestion des pages HTML

  3. Créez une nouvelle page HTML, en "mode avancé".

  4. Dans Contenu de la page, copiez coller ça :

    Code:
    <style>
    /* COLORS */
    @import url('https://cdn.statically.io/gist/mfd/f3d96ec7f0e8f034cc22ea73b3797b59/raw/fad2f254369fb54250260077a4c87391a6280c52/gotham.css');

    :root{
        --fond-deg:linear-gradient(90deg, #BBBBB6 32.29%, #647076 89.86%);
        --fond-img:url('https://i.imgur.com/eF2fshb.jpg');
        --fond-img2:url('https://i.imgur.com/ezn1MYo.jpg');
        --fond-bodyline:#fff;
        --dark:#647076;
        --light:#BBBBB6;
        
        --black:#222;
        --white:#fff;
        
        --text-shadow:2px 1px 2px #757575;
        --font-text:'Inter', sans-serif;
        --font-title:'GothamPro', sans-serif;
      
      --groupe1:#b94c6a;
    --groupe2:#ad8334;
    --groupe3:#3473ad;
    --groupe4:#127a17;
    }

    /* BODY ET CHOSES DE BASE */
    a, a:hover{ text-decoration:none !important; }
    *{ box-sizing:border-box; }
    img{ object-fit:cover; }

      /* PANNEAU GENERAL */

    .panneaubyl{ width:100%; display:flex; flex-wrap:wrap; font-family:var(--font-text); }
     
      /* MESSAGE */
      
      .panneaumessage{ margin-bottom:5px;width:100%; background:var(--fond-deg); color:var(--white); text-shadow:var(--text-shadow); padding:5px; letter-spacing:1px; text-align:center; font-size:11px; }
      
      /* LIENS */
      
      .panneaulinks{ width:28%; display:flex; flex-wrap:wrap; }
      .panneaulinks a{ width:48%; margin:2px; display:block; background:var(--light); color:var(--white); transition:300ms; padding:2px; text-align:center;
      font-size:12px; letter-spacing:1px; font-family:var(--font-title); font-weight:200; display:flex; align-items:center; justify-content:center; }
      .panneaulinks a:hover{ background:var(--dark); transition:300ms; }
      
      /* A DETROIT */
      
      .panneauevent{ width:30%; margin:0 5px; }
      .panneaubyl .panneautitre{ background:var(--fond-img2); color:var(--white); font-family:var(--font-title); font-weight:200; background-position:center; background-size:100%;
      font-size:12px; padding:4px; text-shadow:var(--text-shadow); letter-spacing:1px; }
      .panneauevent span{ display:block; background:var(--white); color:var(--black); font-size:11px; line-height:15px; padding:5px; height:98px; overflow:auto; }
      
      /* VOTE */
      .panneauvote{ width:10%; display:flex; justify-content:center; flex-wrap:wrap; align-items:center; margin-right:5px;}
      .panneauvote img{ width:30px; height:30px; filter: grayscale(0%); transition:500ms; margin:5px; }
      .panneauvote img:hover{ filter: grayscale(100%); transition:500ms; }
      .panneauvote .panneauvotemess{ width:100%; font-size:11px; font-family:var(--font-title); text-align:center;  }
      .panneauvote .panneauvotemess a{ color:var(--dark) !important; text-align:center; }
      .panneauvote .panneauvotemess a:hover{ color:var(--black) !important; }
      
      
      /* PREDEFS */
      
      .panneaupredef{ width:30%; border:1px solid var(--light); }
      .panneaupredef span{ display:flex; justify-content:center; flex-wrap:wrap; padding:5px;}
      .panneaupredef span img{ width:40px; height:40px; margin:2px; opacity:0.5; transition:500ms; }
      .panneaupredef span img:hover{ opacity:1; transition:500ms; }
    </style>   <meta charset="UTF-8" />    <div class="panneaubyl">
                     
       <!--        MESSAGE DE DEBUT        -->        
       <div class="panneaumessage">
                Blabla sur votre forum de façon courte  
       </div>
                     
       <!--        LIENS        -->        
       <div class="panneaulinks">
                    <a target="_blank" href="https://becomeyourlife.forumactif.com/t221-guide-du-debutant">Guide du débutant</a>    <a target="_blank" href="https://becomeyourlife.forumactif.com/t199-reglement">Règlement</a>    <a target="_blank" href="https://becomeyourlife.forumactif.com/t201-contexte">Contexte</a>    <a target="_blank" href="https://becomeyourlife.forumactif.com/t202-groupes">Groupes</a>    <a target="_blank" href="https://becomeyourlife.forumactif.com/f1-annexes">Annexes</a>    <a target="_blank" href="https://becomeyourlife.forumactif.com/f40-listings">Bottins</a>    <a target="_blank" href="https://becomeyourlife.forumactif.com/t235-invites-fonctionnement">Invités</a>    <a target="_blank" href="https://becomeyourlife.forumactif.com/f12-partenariats">Partenariats</a>        
       </div>
                     
       <!--        FIN DES LIENS        -->        
       <!--        EVENT DU MOMENT        -->        
       <div class="panneauevent">
                          
          <div class="panneautitre">
                  Les events
          </div>
                    <span><br /> Vlebleblelbeh</span>        
       </div>
                     
       <!--        FIN EVENT        -->        
       <!--        VOTES        -->        
       <div class="panneauvote">
                    <a target="_blank" href="http://www.root-top.com/topsite/obsession27/in.php?ID=26891"><img src="https://i.servimg.com/u/f30/19/45/51/53/catene10.png" /></a>    <a target="_blank" href="http://www.root-top.com/topsite/pubrpgdesign/in.php?ID=3029"><img src="https://i.servimg.com/u/f30/19/45/51/53/catene10.png" /></a>    <a target="_blank" href="http://www.root-top.com/topsite/bazzart/in.php?ID=2902"><img src="https://i.servimg.com/u/f30/19/45/51/53/catene10.png" /></a> <span class="panneauvotemess"><a target="_blank" href="#">Votez (toutes les 2h)</a></span>        
       </div>
                     
       <!--        FIN VOTES        -->        
       <!--        PREDEFINIS        -->        
       <div class="panneaupredef">
                          
          <div class="panneautitre">
                   Mais <strong>où</strong> êtes vous ?      
          </div>
                    <span>         <a target="_blank" href="#"><img src="https://i.pinimg.com/originals/30/ce/09/30ce097d101abf0a7970d0e7c87d3b44.jpg" /></a>                            <a target="_blank" href=""><img src="https://i.servimg.com/u/f30/19/45/51/53/images10.png" /></a>       <a target="_blank" href=""><img src="https://i.servimg.com/u/f30/19/45/51/53/images10.png" /></a>          <a target="_blank" href=""><img src="https://i.servimg.com/u/f30/19/45/51/53/images10.png" /></a>       <a target="_blank" href=""><img src="https://i.servimg.com/u/f30/19/45/51/53/images10.png" /></a>          <a target="_blank" href=""><img src="https://i.servimg.com/u/f30/19/45/51/53/images10.png" /></a>       <a target="_blank" href=""><img src="https://i.servimg.com/u/f30/19/45/51/53/images10.png" /></a>          <a target="_blank" href=""><img src="https://i.servimg.com/u/f30/19/45/51/53/images10.png" /></a>        <a target="_blank" href=""><img src="https://i.servimg.com/u/f30/19/45/51/53/images10.png" /></a>          <a target="_blank" href=""><img src="https://i.servimg.com/u/f30/19/45/51/53/images10.png" /></a>    </span>        
       </div>
                     
       <!--        FIN PREDEFINIS        -->
    </div>
    <!--        FIN PANNEAU D'AFFICHAGE        -->



HTML

  1. Gardez dans un coin le lien de la page HTML que vous avez crée plus haut.

  2. Avec le compte fondateur, il faut aller dans Panneau d'administration > Affichage > Templates > overall_header
    Appuyez sur la roue crantée pour le modifier

  3. Repérez
    Code:
             <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
                <tr>
                   <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
                </tr>
             </table>

  4. Juste avant ce code donc juste avant le début du "table", copier coller ce code en remplissant le "LIENDUPANNEAU" par votre lien.

    Code:
       <div>
    <iframe scrolling="no" frameborder="0" marginheight="0" style="width: 100%; height: 200px;" src="LIENDELAPAGE"></iframe>
                </div>

  5. Validez une fois que c'est bon (il faut confirmer la modification une fois de retour dans la page des templates

  6. Si vous avez des soucis n'hésitez pas à le signaler.
    Signaler un souci

Contenu sponsorisé
Revenir en haut

Nos amis proches

Panneau d'affichage Parto512 Logo WyvArtem