Nouveau theme MX-Fer pour vous

[kawa]

Bonjour

Je vous présente un nouveau thème : MX-Fer.
A télécharger ici: http://www.megafileupload.com/en/file/98930/mx-fer-zip.html

Ce thème est construit différemment
Il est construit en tableaux et en cellules et il est très référencé sous le CSS.
Par contre je n'est pas divisé les tableaux des blocs de gauche, droite et centre, il n'y a pas d'en-tete (thead), pas de cors (tbody)et pas de pied de tableau (tfoot).
Vous vous demandez sûrement pourquoi que je n'ai pas divisé ces tableaux ?
La réponse est assé simple !
J'ai remarqué qu'il y a beaucoup de bloc, modules en addons chez PragmaMx ou autre qui est déjà une structure divisé en 3 parties, alors si a la base un thème de pragmaMX qui est divisé, on ce retrouve avec plusieurs divisions pour un seul bloc, ce qui peut créer des bugs sous différents navigateurs.

Peut-être que je suis dans l'erreur ou peux etre pas, mais il faut le tester, alors j'ai besoin de vous cher membre pour faire des testes.
A la base j'ai besoin de vous pour tester ce thème sous Internet Explorer 6 ou 6.5 et de le comparer avec Mozilla Firefox.
Et si cela est possible de me faire quelque capture d'écran et de les ajouter a la suite de ce message.
Si vous avez plusieurs blocs, module en extra dans votre pragma, ce serait parfait pour tester ce theme.

Ce thème est bien codé et si ce thème passe le teste, je vais créer d'autre thème en utilisent cette structure.
Alors il est tres important pour moi d'avoir un minimum d'aide pour tester ce theme.


Je vous dit merci d'avance pour votre aide.

Petit message pour diabolo.
Il est vrai que les tableaux et cellules sont beaucoup plus lourds que le DIV, mais bon cela fait 6 mois que je me casse la tete pour le DIV et il y a des choses que je ne peux faire ou réaliser en DIV, le DIV ne peux pas avoir de cellules, ce qui créer des problèmes sur une découpe a 3 images ou plus et qu'une image doit ce répéter.
J'ai aussi testé une découpes-en DIV sur un bloc en 10 images, sans comprendre il y avait des bugs sous différent navigateur et ces bugs était déférent sous différent navigateur, alors impossible pour moi de corriger le problème et j'ai commencé a m'arracher les cheveux sur la tete lorsque jai voulu ajouter du margin et padding autour des blocs centre, les bugs apparaissent par magie, j'avais réussi a corrigé le problème avec ces blocs en les rendent fixe, mais le problème est que tout le monde connaît le petit extra de pragmaMX qui permet d'activer ou désactiver les blocs de droite, ce qui occasionnait un lègé problème avec les blocs centre fixe.
Perso, il est impossible (pour l'instant) de créer un thème en DIV avec une découpe qui demande a une image de ce répérer, bien sur ont peut triché, d'ailleurs j'ai triché sur mon premier thème mx-zolt (que je vais refaire dans un futur très proche), ya pas de padding sur mes blocs de droite et gauche, mais je ne pouvais pas faire cette manip avec mes blocs de centre.
Alors, la question a ce pauser, doije  continuer a construire des thèmes en tableau et cellule ou faire un Mix en div et cellule ?
Perso je ne crois pas gagner de la rapidité en sauvent qu'une dizaine de lignes en div et de continuer le thème en tableau et cellule.

Sinon pour changer de sujet.
Je me demande si cela est possible pour toi de me donner le nouveau thème de PragmaMx de sa nouvelle version en MP.
J'ai déjà 2 autres theme de créer, il me reste qu'a faire le découpage et je ne veux pas trop m'aventurer a créer des thèmes si ces thèmes ne seront plus 100% compatible avec la nouvelle version de PragmaMx.
J'ai aussi une autre chose a te demander, le thème de ce site, j'aime bien sa structure la position des boutons, etc...
Alors, j'aimerais savoir si cela est possible pour toi de me donner ce thème en MP, bien sur que je ne vais pas le distribuer, je veux simplement étudier sa structure et de récupérer quelques lignes de code.

S.V.P Diabolo, il ne faut pas dépasser 1.44Mo, car je suis que sur disquette.

Merci d'avance.

[tcharg]

Bonjour,

Bravo pour ce beau boulot 
P'tit nouveau chez Pragma, je viens de lancer une install de PragmaMx, dans la foulée un forum Smf et ton dernier thème ! Le plus pénible a été l'upload des fichiers
Pour les ceusses qui veulent le voir, c'est ici : http://www.le421.com

PS: rapide test sous IE7 : Aucun problème chez moi...
PPS : ça existe encore les disquettes ?
PPPS : la ligne de footer "Site motorisé par la version française de pragmaMx 0.1.10." ne s'affiche pas !

[Diabolo]

Slt
Bon travail

J'ai remarqué des petites erreurs de code à corriger
http://users.skynet.be/mgueury/mozilla/

Concernant la structure tableaux vs div , y a pas photo le div c'est mieux car c'est sémantiquement correct contrairement aux tableaux.

Maintenant en terme d'utilisation finale les tableaux sont évidemment plus simple à mettre en place (comme tu dit niveau compatibilité c'est mieux) et dans tous les cas ce n'est pas non plus une mauvais choix, si ça te convient  . Ne pas oublier qu'au final que ce soit div ou tableau 99,9 % des utilisateurs s'en foutent royalement.

Concernant la nouvelle version de pmx elle sera dans le bacs d'ici très peu de temps et dans tous les cas les anciens thèmes seront compatibles.

Pour le thème de notre site, je te l'enverrais sous peu.

Sinon pour ceux qui veulent créer leur propre thème, je vous conseille le frameworks YAML
http://www.pragmamx.org/Downloads-op-view-lid-711.html
De bonne connaissances en css sont requises et un temps d'adaptation au frameworks mais c'est une base idéale pour tous thèmes  

[Skud29]

Salut kawa,

Ca envoie sévère tes thèmes 

J'ai fait quelques captures sous IE 6, Pas d'erreurs en vue, je vais tester avec des modules comme Vidéos Stream...

Les captures sont ici: http://gtrevolution.free.fr/img_theme_kawa/

Edit: 2 Screens du module Vidéos Stream ajouté. Tu peux voir une sale erreur sur "image11Videos_Stream" ne fait pas gaffe à ça, il fait ça sur tous les thèmes, il y a une correction de code à faire.

[fonfonsd]

bravo beau boulot

[kawa]

Merci pour votre aide 

OK pour tcharg, je repérer le probleme, je vais le corriger le plus rapidement possible.
Et pour répondre a ta question: ça existe encore les disquettes ?
La réponce est oui car chaque pc pert de moi n'ont pas de lecteur DVD, alors je travail sur disquette pour ramener le travail chez moi, c'est completement fou, je fais 3 kilometre en motoneige pour me trouver un acces internet...
Je suis en mission dans le grand Nord canadien (avec les caribous)

Diabolo, je ne peut pas voir les erreurs, je n'est pas vraiment acces a l'internet. 
Si possible, jaimerais connaitre les erreus s.v.p.
Merci d'avance pour l'un des themes, je vais attendre de recevoir le ou les nouveaux theme de pragmaMX avant de continuer la création.

Et en passant, merci beaucoup pour votre aide 

@++

[alexandrevatin]

Bonjour l’ami Kawa

Très jolie thème, bravo !
Ensuite c’est une question de gout&de couleurs!

Suivant l'install de notre ami tcharg
à cette adresse: http://www.le421.com/themes/mx-fer/theme.html
On obtient le résultat de l’image ci-dessous


A cette adresse: http://www.videoaudiotechnologie.fr/themes/mx-fer/theme.html
En modifiant le fichier theme.html comme ceci

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- * pragmaMx - Web Content Management System * Copyright by pragmaMx Developer Team - http://www.pragmamx.org * $Id: theme.html,v 1.12.2.3 2008/01/10 11:45:58 tora60 Exp $ -->
<title>mx-fer</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="pragma" content="no-cache" />
<link type="text/css" href="style/style.css" rel="stylesheet" />
<!-- START more_header -->
<!-- dESIGN by hENNE-->
<!-- END more_header -->
</head>
<body class="divmain">
<div id="encadrement">
<table style="width: 1000px; height: 100%;" align="center" border=
"0" cellpadding="0" cellspacing="0">
<tbody>

<tr>
<td class="cadre_01"></td>
<td class="cadre_02">
<div align="left"><img src="images/cadre_02.png" alt="" height="21"
width="176" /></div></td>
<td class="cadre_04"></td>
</tr>
<tr valign="top">
<td class="cadre_05"></td>
<td height="104">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td class="cadre_06">
<div id="menuitem_1">{MENUITEM_1}</div>
<div id="menuitem_2">{MENUITEM_2}</div>
<div id="menuitem_3">{MENUITEM_3}</div>
<div id="menuitem_4">{MENUITEM_4}</div></td>
<td class="cadre_07"></td>
<td class="cadre_77">
<div id="loginform">{LOGINFORM}</div></td>
</tr>
</tbody>
</table></td>
<td class="cadre_08"></td>
</tr>
<tr>

<td class="cadre_09"></td>
<td class="cadre_10">
<div align="left"><img src="images/cadre_10.png" alt="" border="0"
height="21" width="176" /></div></td>
<td class="cadre_12"></td>
</tr>
<!-- beginn content -->
<tr>
<td class="cadre_13"></td>
<td class="cadre_14"></td>
<td class="cadre_15"></td>
</tr>
<tr valign="top">
<td style="background-image: url(images/cadre_19.png);" width="34">
<img src="images/cadre_16.png" alt="" border="0" height="48" width=
"34" /></td>
<td>
<div class="clear"></div>

<table style="width: 100%; height: 100%;" border="0" cellpadding=
"0" cellspacing="0">
<tbody>
<tr><!-- START left_noblocks -->
<td class="blocksLeft" valign="top" width="212">
<div id="leftcolumn" style="width: 212px;">
<!-- START blocks_left_loop -->
<!-- START block_left -->
<table style="margin-bottom: 5px;" border="0" cellpadding="0"
cellspacing="0">
<tbody>
<tr>
<td class="bloc_gauche_01"></td>
<td class="bloc_gauche_02">
<div class="boxtitle_g">{BLOCK_TITLE}</div></td>
<td class="bloc_gauche_03"></td>
</tr>

<tr>
<td class="bloc_gauche_04"></td>
<td class="bloc_gauche_05">
<div class="boxcontent_g">{BLOCK_CONTENT} <!-- START comment -->
 1 Commande du contenue Ceci est un simple texte pour regarder la
structure du texte qui sera valide dans le bloc, le but est d'en
ajuster le padding. Et aussi regarder la position des images, alors
merci de ne pas tenir compte de ce texte, qui est a mes yeux tres
importants ! <!-- END comment --></div></td>
<td class="bloc_gauche_06"></td>
</tr>
<tr>
<td class="bloc_gauche_07"></td>
<td class="bloc_gauche_08"></td>
<td class="bloc_gauche_09"></td>
</tr>
</tbody>
</table>
<!-- END block_left -->
<!-- END blocks_left_loop --></div></td>
<!-- END left_noblocks -->
<td class="CenterBox" valign="top">
<!-- START blocks_center_top_loop -->
<!-- START block_center_top -->
<table style="margin-bottom: 5px;" border="0" cellpadding="0"
cellspacing="0" width="100%">
<tbody>
<tr>
<td class="centre_01"></td>
<td colspan="2" class="centre_02"></td>
<td class="centre_03"></td>
</tr>
<tr>
<td class="centre_04"></td>

<td class="centre_05">
<div class="storytitle">{BLOCK_TITLE}</div></td>
<td class="centre_06"></td>
<td class="centre_07"></td>
</tr>
<tr>
<td class="centre_08"></td>
<td colspan="2" bgcolor="#000000" class="content" valign="top">
{BLOCK_CONTENT} <!-- START comment -->
 2 Commande du contenue <!-- END comment --></td>
<td class="centre_10"></td>
</tr>

<tr>
<td class="centre_11"></td>
<td></td>
<td></td>
<td class="centre_14"></td>
</tr>
<tr>
<td class="centre_15"></td>
<td colspan="2" class="centre_16"></td>
<td class="centre_17"></td>
</tr>
</tbody>
</table>
<br />
<!-- END block_center_top -->
 <!-- END blocks_center_top_loop -->

 <!-- START script_output -->
 <!-- START opentable -->
<table align="center" border="0" cellpadding="0" cellspacing="1"
width="100%">
<tbody>
<tr>
<td>
<table border="0" cellpadding="5" cellspacing="0" width="100%">
<tbody>
<tr>
<td class="content">{OPENCLOSE_TABLE}</td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table>
<!-- END opentable -->
<br />
<!-- START opentable2 -->
<table style=
"border: 1px solid rgb(231, 242, 204); background-color: rgb(159, 2, 2);"
align="center" border="0" cellpadding="1" cellspacing="8" width=
"70%">
<tbody>
<tr>
<td>{OPENCLOSE_TABLE_2}</td>
</tr>
</tbody>
</table>
<!-- END opentable2 -->
<br />
<!-- START opentableal -->

<table style=
"border: 3px double Red; background-color: rgb(159, 2, 2);" align=
"center" border="0" cellpadding="10" cellspacing="0" width="85%">
<tbody>
<tr>
<td>{OPENCLOSE_TABLE_AL}</td>
</tr>
</tbody>
</table>
<!-- END opentableal -->
<br />
<!-- START themeindex_1 -->
<table style="margin-bottom: 5px;" border="0" cellpadding="0"
cellspacing="0" width="100%">
<tbody>
<tr>
<td class="centre_01"></td>
<td colspan="2" class="centre_02"></td>
<td class="centre_03"></td>
</tr>
<tr>
<td class="centre_04"></td>
<td class="centre_05">
<div class="storytitle">{$title}</div></td>
<td class="centre_06">
<div align="right">{$buttons}</div></td>
<td class="centre_07"></td>
</tr>
<tr>
<td class="centre_08"></td>
<td colspan="2" bgcolor="#000000" class="content" valign="top">
{$content} <!-- START comment -->

 3 Commande du contenue <!-- END comment --></td>
<td class="centre_10"></td>
</tr>
<tr>
<td class="centre_11"></td>
<td class="tiny" bgcolor="#000000">{$infoline}</td>
<td bgcolor="#000000" align="right">{$readmore}</td>
<td class="centre_14"></td>
</tr>
<tr>
<td class="centre_15"></td>
<td colspan="2" class="centre_16"></td>
<td class="centre_17"></td>
</tr>
</tbody>
</table>
<br />
<!-- END themeindex_1 -->
 <!-- START themeindex_2 -->
<table style="margin-bottom: 5px;" border="0" cellpadding="0"
cellspacing="0" width="100%">
<tbody>
<tr>
<td class="centre_01"></td>
<td colspan="2" class="centre_02"></td>
<td class="centre_03"></td>
</tr>
<tr>
<td class="centre_04"></td>
<td class="centre_05">

<div class="storytitle">{$title}</div></td>
<td class="centre_06">
<div align="right">{$buttons}</div></td>
<td class="centre_07"></td>
</tr>
<tr>
<td class="centre_08"></td>
<td colspan="2" bgcolor="#000000" class="content" valign="top">
{$content} <!-- START comment -->
 4 Commande du contenue <!-- END comment --></td>

<td class="centre_10"></td>
</tr>
<tr>
<td class="centre_11"></td>
<td class="tiny" bgcolor="#000000">{$infoline}</td>
<td bgcolor="#000000" align="right">{$readmore}</td>
<td class="centre_14"></td>
</tr>
<tr>
<td class="centre_15"></td>
<td colspan="2" class="centre_16"></td>
<td class="centre_17"></td>
</tr>
</tbody>
</table>

<br />
<!-- END themeindex_2 -->
 <!-- START themearticle -->
<table border="2" cellpadding="0" cellspacing="1" width="100%">
<tbody>
<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td>
<div class="storytitle">{$title}</div></td>
<td align="right" valign="top">&nbsp;</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="5" cellspacing="0" width="100%">
<tbody>
<tr valign="bottom">
<td class="content"><i>{$infoline}</i></td>
</tr>
</tbody>
</table>
<img alt="" src="images/pixel.gif" border="0" height="1" width=
"1" /><br />
<table border="0" cellpadding="5" cellspacing="0" width="100%">
<tbody>
<tr>
<td>
<div class="content">{$content} <!-- START comment -->

 5 Commande du contenue Ceci est un simple texte pour regarder la
structure du texte qui sera valide, le but est d'en ajuster le
padding. Et aussi regarder la position des images, alors merci de
ne pas tenir compte de ce texte qui est a mes yeux tres importants
Ceci est un simple texte pour regarder la structure du texte qui
sera valide, le but est d'en ajuster le padding. Et aussi regarder
la position des images, alors merci de ne pas tenir compte de ce
texte qui est a mes yeux tres importants <!-- END comment --></div></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table>
<!-- END themearticle -->
<!-- END script_output -->
<!-- START blocks_center_down_loop -->
<!-- START block_center_down -->
<table align="center" border="0" cellpadding="0" cellspacing="1"
width="100%">
<tbody>

<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td>
<div class="storytitle">{BLOCK_TITLE}</div></td>
<td align="right" valign="top">&nbsp;</td>
</tr>
<tr>
<td colspan="2">
<div class="content">{BLOCK_CONTENT} <!-- START comment -->
 6 Commande du contenue Ceci est un simple texte pour regarder la
structure du texte qui sera valide, le but est d'en ajuster le
padding. Et aussi regarder la position des images, alors merci de
ne pas tenir compte de ce texte qui est a mes yeux tres importants
Ceci est un simple texte pour regarder la structure du texte qui
sera valide, le but est d'en ajuster le padding. Et aussi regarder
la position des images, alors merci de ne pas tenir compte de ce
texte qui est a mes yeux tres importants <!-- END comment --></div></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table>
<br />
<!-- END block_center_down -->
<br />
<!-- END blocks_center_down_loop --></td>
<!-- START index_on -->
<td class="blocksRight" valign="top" align="right" width="208">
<div id="rightcolumn"><!-- START blocks_right_loop -->
<!-- START block_right -->
<table style="margin-bottom: 5px;" border="0" cellpadding="0"
cellspacing="0">

<tbody>
<tr>
<td class="bloc_droite_01"></td>
<td class="bloc_droite_02">
<div class="boxtitle_d">{BLOCK_TITLE}</div></td>
<td class="bloc_droite_03"></td>
</tr>
<tr>
<td class="bloc_droite_04"></td>
<td class="bloc_droite_05">
<div class="boxcontent_d">{BLOCK_CONTENT} <!-- START comment -->
 7 Commande du contenue Ceci est un simple texte pour regarder la
structure du texte qui sera valide dans le bloc, le but est d'en
ajuster le padding. Et aussi regarder la position des images, alors
merci de ne pas tenir compte de ce texte, qui est a mes yeux tres
importants ! <!-- END comment --></div></td>
<td class="bloc_droite_06"></td>
</tr>
<tr>
<td class="bloc_droite_07"></td>
<td class="bloc_droite_08"></td>
<td class="bloc_droite_09"></td>
</tr>
</tbody>
</table>
<!-- END block_right -->
<!-- END blocks_right_loop --></div></td>
<!-- END index_on --></tr>
</tbody>
</table></td>

<td style="background-image: url(images/cadre_21.png);" width="37">
<img src="images/cadre_18.png" alt="" border="0" height="48" width=
"37" /></td>
</tr>
<!-- beginn footer -->
<tr>
<td class="cadre_22"></td>
<td class="cadre_23"></td>
<td class="cadre_24"></td>
</tr>
<tr>
<td class="cadre_25"></td>
<td class="cadre_26"></td>
<td class="cadre_27"></td>
</tr>
<tr>
<td class="cadre_28"></td>
<td class="cadre_29"></td>

<td class="cadre_30"></td>
</tr>
<tr>
<td style="background-image: url(images/cadre_31.png);" width="34">
<img style="width: 34px; height: 57px;" src="images/cadre_34.png"
alt="" border="0" /></td>
<td style="background-color: rgb(0, 0, 0); height: 180px;" align=
"center" bgcolor="#000000" height="180">
<div class="footmsg">{FOOTMESSAGE}<br />
{VIEWBENCH}</div>
  <p>
    <a href="http://validator.w3.org/check?uri=referer"><img
        src="http://www.w3.org/Icons/valid-xhtml10"
        alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a>
  </p></td>
<td style="background-image: url(images/cadre_33.png);" width="37">
<img style="width: 37px; height: 62px;" src="images/cadre_36.png"
alt="" border="0" /></td>
</tr>
<tr>
<td class="cadre_37"></td>
<td class="cadre_38">&nbsp;</td>

<td class="cadre_39"></td>
</tr>
<tr>
<td class="cadre_40"></td>
<td class="cadre_41"></td>
<td class="cadre_42"></td>
</tr>
</tbody>
</table>
<!-- START comment -->
<!-- END comment --></div>
</body>
</html>

On obtient le résultat de ci-dessous


Bien amicalement
Alex

[kawa]

Bonjour et merci pour cette astuce alexandrevatin

Par contre c'est quand meme étrange qu'il n'affiche pas d'erreur avec cette modiffication car il y avait vraiment une erreur dans le theme.
De plus j'aurais aimé avoir et savoir sur quel ligne qu'il y avait des erreur.
J'apporte le code chez moi et je vais le regarder 

Allé @++

Voila ! j'ai fait la mise a jour du thème mx-fer.

J'avais simplement oublié une balise dans le tableau du pied de page.

Alors, je te dit un grand merci tcharg d'avoir trouvé ce problème.


@++