phpBB-fr.com

[Help-me]

Bonjour,

Je commence l'adaptation du thème actuel d'un forum en version 2 vers prosilver.
Quand je regarde les Overal_header de chaque version je suis paumé.

Voilà la partie concerné que j'aimerais mettre en "bannière" pour prosilver

Code: Tout sélectionner

<table width="871" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="234" height="126"><a href="http://www.insecte.org" onmouseover="image3.src='templates/lmdi/images/hd/top_leftleftover.jpg';"
onmouseout="image3.src='templates/lmdi/images/hd/top_leftleft.jpg';">
<img src="templates/lmdi/images/hd/top_leftleft.jpg" alt="" name="image3" border=0 align="top"></a>
    <!--<img src="templates/lmdi/images/hd/top_leftleft.jpg" alt="" width="234" height="126" border="0" align="top" usemap="#Map"/>-->
    </td>
    <td width="162"><img src="templates/lmdi/images/hd/top_left.jpg" alt="" width="162" height="126" border="0" align="top"></td>
    <td width="100"><a href="http://galerie-insecte.org/galerie/" target="_blank"
   onmouseover="image1.src='templates/lmdi/images/hd/galover.jpg';"
onmouseout="image1.src='templates/lmdi/images/hd/gal.jpg';">
    <img src="templates/lmdi/images/hd/gal.jpg" alt="" name="image1" border=0 align="top"></a>
    </td>
    <td width="90"><img src="templates/lmdi/images/hd/top_mid.jpg" alt="" width="90" height="126" border="0" align="top"></td>
    <td width="84"><a href="http://www.insecte.org/forum/portal.php" onmouseover="image2.src='templates/lmdi/images/hd/forover.jpg';"
onmouseout="image2.src='templates/lmdi/images/hd/for.jpg';">
    <img src="templates/lmdi/images/hd/for.jpg" alt="" name="image2" border=0 align="top"></a>
    </td>
    <td width="201"><img src="templates/lmdi/images/hd/top_right.jpg" alt="" width="146" height="126" border="0" align="top"></td>
  </tr>
  <tr>
    <td height="68"><img src="templates/lmdi/images/hd/left.jpg" alt="" width="198" height="68" border="0" align="top"/>

Voilà ce que ça donne actuellement sur la version 2


Merci bcp de votre aide.

[Jester]

bonjour,

tu vas avoir du boulot. Tu es en train d'essayer de comparer ton code d'un fichier overall_header.tpl en HTML et un fichier overall_header.html avec un codage XHTML strict (celui de phpBB3). Or en effet ça correspond pas vraiment.
De plus maintenant l'affichage des images se fait par CSS et non plus sur les ficheirs HTML directement (enfin presque tout).
Qu'est ce que tu n'arrives à transposer dans ton nouveau style (ne dit pas "tout" ) ?

[Help-me]

J'avais répondu un peu vite, juste mon header, pour l'instant.

Merci.

[Jester]

Si tu travailles sous prosilver, vois quelle partie tu peux remettre en logo, en background du header, etc. Pour t'aider tu as les Tutos du Centre de Docs phpBB3, t'en as pas mal sur les css et les images, couleurs etc.
On ne va pas te coder tout ton header de bout en blanc

[Help-me]

Je suis déjà plonger dedans, merci.

[Help-me]

Bonjour, voilà où j'en suis.

Une image sur les 10 de mon header.

Pour continuer d'ajouter les autre j'ai besoin de common.css, overall_header.php et imageset.cfg, rien de plus ?

Et comment enlever la marge que j'ai au-dessus sous firefox

Merci.

[Jester]

il n'y a plus de overall_header.tpl, mais un overall_header.html
Ensuite oui, tu dois travailler sur le imageset (pour les boutons) et plutôt le colours.css comme tu l'as fait pour les couleurs.
Pour l'espace, il faut jouer sur les marges et padding de la page (body) dans le common.css
Malgré tout ce ne sera pas exactement la même chose sous IE et FF.

[Help-me]

Merci, j'ai réussi à coller bien dans le coin la 1ère image.

Dans l'imageset faut que je rajoute mes images

img_top_left = top_left.jpg*126*234

dans l'overall_header.html j'ajoute une ligne

<a id="logo2">{TOP_LEFT_IMG}</a>

et dans mon common.css

J'ajoute et modifie les valeurs pour que ça colle

#logo2 {
float: left;
width: auto;
padding: 0px 0px 0 0px;
.....
}
Et ainsi de suite pour mes 10 images.

J'ai bon ?

[Jester]

C'est une méthode mais pourquoi ne fais tu pas une seule et même image à ce moment là ?

[Help-me]

J'ai trois image qui fonctionne en mouse over

Voilà ce que ça donne actuellement sur la version 2

[Jester]

Effectivement

[Help-me]

donc ma méthode est correct, au niveau codage propre et validation ?

[Jester]

De ce que tu me montres oui

[Help-me]

Merci,

Bon mon logo 2 ne s'affiche pas.

Common.css

Code: Tout sélectionner

#logo2 {
    margin-left: 235px;
}

Overall header.html

Code: Tout sélectionner

...
<body id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">

     <a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>
     <a id="logo2">{TOP_LEFT_IMG}</a>
   
<div id="wrap">
...

Imageset.cfg

Code: Tout sélectionner

Images
img_site_logo = site_logo.jpg*126*234
img_top_left = top_left.jpg*126*234

Mon logo2 est bien dans le répertoire imageset, avec la bonne extension.

J'ai tout rafraîchi, vidé le cache.

Rien.

Il n'y aurait pas un autre fichier à modifier ?

Merci.

[abble]

salut
laisse tomber le imageset
mets tout dans la css :

Code: Tout sélectionner

#logo2 {
    display: block;
    position: relative;
    top: 0;
    left: 235px;
    background-image: url("{T_THEME_PATH}/images/top_left.jpg");
}