Icone de sujet dans formulaire de création de sujet

[Outis]

Détails techniques

Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://personofinterest.fra.co

Description du problème

Salut,

J'avais autrefois reçu de l'aide pour créer un formulaire lors de la création d'un nouveau sujet.

Je reviens aujourd'hui pour savoir s'il est possible d'ajouter une petite personnalisation : la possibilité de choisir l’icône de sujet directement dans le formulaire.

Si c'est le cas, je demanderai alors à une bonne âme de m'aider puisque je suis une quiche dans le domaine.

Merci

[Outis]

[Chacha]

Bonjour, Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message. Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »

[Outis]

[Outis]

[Lixyr]

Bonjour Outis,

Il me semble que oui. Pour que ce soit plus simple, pourrais-je avoir le script entier de votre formulaire pour que je puisse tester directement (HTML + JS) ?

[Outis]

Bonjour et merci

HTML

Code:

<meta charset="utf-8" />      <meta name="viewport" content="width=device-width" />      <title>séries Inclassables</title>    <style>
    /* Ce style est pour tout le formulaire */
    
    body {color:#FFFFFF;
    background:url(https://i.servimg.com/u/f11/17/87/12/63/fond_m10.gif);
    text-align: center;
    }
    </style>    <script src="http://tinyurl.com/var-fa" type="text/javascript"></script>    <script type="text/javascript">
    function envoiMessage(form){
    
    var txt_message ="[center][img]%22 + form.champ10.value + %22[/img][/center]\n\n"
    + " [b]Synopsis[/b] " + "\n" + form.champ1.value + "\n\n"
    + " [b]Autre(s) titre(s) :[/b] " + form.champ2.value + "\n"
    + " [b]Genre :[/b] " + form.champ3.value + "\n"
    + " [b]Créateur :[/b] " + form.champ4.value + "\n"
    + " [b]Origine :[/b] " + form.champ5.value + "\n"
    + " [b]Date de la première diffusion :[/b] " + form.champ6.value + "\n"
    + " [b]Chaîne d'origine :[/b] " + form.champ7.value + "\n\n"
    + " [b]Casting[/b] "  + "\n" + form.champ8.value + "\n\n";
    
    form.message.value = txt_message;
    form.subject.value = form.champ11.value;
    }
    </script>              
<form id="coc" onsubmit="envoiMessage(this)" enctype="multipart/form-data" name="post" method="post" action="/post">
              <input value="0" name="lt" type="hidden" />    <input value="newtopic" name="mode" type="hidden" />    <input checked="checked" value="0" name="topictype" type="hidden" />    <input value="" name="message" type="hidden" />          
 <!--            Contiendra le texte du message            -->     <input value="7" name="f" type="hidden" />          
 <!--            ID du forum dans lequel le message sera posté            -->     <input value="" id="titre" name="subject" type="hidden" />              
 <p style="text-align: center;">
              <label><a href="http://personofinterest.fra.co/f7-inclassables"><img src="https://i.servimg.com/u/f37/18/19/98/73/bannie10.jpg" /></a>     <br />cliquer sur l'image pour retourner sur le forum sans valider    <br /><br />    <span style="color: rgb(255, 1, 1); font-size: 48px;"><strong>Séries Inclassables</strong></span></label>              
 </p>
                              
 <p>
              <label><strong>TITRE<br /> <em>entre 3 et 35 caracteres</em></strong></label><br />    <textarea id="champ11" name="champ11" rows="3" required="required" cols="50" maxlength="35"></textarea>              
 </p>
                              
 <p>
              <label><strong>URL de l'Image :  </strong></label><br />    <textarea id="champ10" name="champ10" rows="3" required="required" cols="50"></textarea>              
 </p>
                              
 <p>
              <label><strong>SYNOPSIS</strong></label><br />    <textarea id="champ1" name="champ1" rows="3" required="required" cols="50"></textarea>              
 </p>
                              
 <p>
              <label><strong>AUTRE(S) TITRE(S) </strong></label><br />    <input required="required" size="30" id="champ2" name="champ2" type="text" />              
 </p>
                              
 <p>
              <label><strong>GENRE</strong></label><br />    <input name="champ3" id="champ3" size="30" required="required" type="text" />              
 </p>
                              
 <p>
              <label><strong>CREATEUR(S)</strong></label><br />    <input name="champ4" id="champ4" size="30" required="required" type="text" />              
 </p>
                              
 <p>
              <label><strong>PAYS D'ORIGINE</strong></label><br />    <input name="champ5" id="champ5" size="30" required="required" type="text" />              
 </p>
                              
 <p>
              <label><strong>DATE DE LA PREMIERE DIFFUSION <br />    <em>(entrez une date)</em></strong></label><br />    <input name="champ6" id="champ6" size="30" required="required" type="text" />              
 </p>
                              
 <p>
              <label><strong>CHAINE D'ORIGINE</strong></label><br />    <input name="champ7" id="champ7" size="30" required="required" type="text" />              
 </p>
                              
 <p>
              <label><strong>ACTEUR : ROLE   </strong></label><br />    <textarea id="champ8" name="champ8" rows="3" required="required" cols="50"></textarea>              
 </p>
                                  
 <p>
              <input name="post" value="VALIDER" type="submit" />              
 </p>
                              
 <p>
              <label><span style="color: rgb(255, 255, 0); font-size: 24px;"><strong><em>Vous pourrez donner votre avis dans un nouveau message,<br />      après la création de cette fiche</em>  </strong></span></label><br />              
 </p>
                              
</form>

JS

Code:


/*DANS L’ESPACE */
$(function(){
    $('a[href="/post?f=21&mode=newtopic"]').attr('href','http://personofinterest.fra.co/h5-dans-l-espace');
    });

/*FUTUR */
$(function(){
    $('a[href="/post?f=26&mode=newtopic"]').attr('href','http://personofinterest.fra.co/h6-futur-proche-ou-lointain');
    });

/*VOYAGE TEMPOREL */
$(function(){
    $('a[href="/post?f=28&mode=newtopic"]').attr('href','http://personofinterest.fra.co/h9-voyages-temporels-mondes-alternatifs');
    });

/*SUPER HÉROS */
$(function(){
    $('a[href="/post?f=12&mode=newtopic"]').attr('href','http://personofinterest.fra.co/h7-super-heros');
    });

/*FANTASY */
$(function(){
    $('a[href="/post?f=66&mode=newtopic"]').attr('href','http://personofinterest.fra.co/h8-fantasy');
    });

/*FANTASTIQUE */
$(function(){
    $('a[href="/post?f=48&mode=newtopic"]').attr('href','http://personofinterest.fra.co/h10-fantastique');
    });


/*COMÉDIE OU DRAME */
$(function(){
    $('a[href="/post?f=10&mode=newtopic"]').attr('href','http://personofinterest.fra.co/h11-comedie-ou-drame');
    });


/*POLICIER, ACTION, ESPIONNAGE */
$(function(){
    $('a[href="/post?f=13&mode=newtopic"]').attr('href','http://personofinterest.fra.co/h12-action-policier-espionnage');
    });

/*INCLASSABLE*/
$(function(){
    $('a[href="/post?f=7&mode=newtopic"]').attr('href','http://personofinterest.fra.co/h13-series-inclassables');
    });


[Lixyr]

Bonjour Outis,

bien reçu.

*message édité*

Y a-t-il un endroit sur votre forum où je peux poster en tant qu'invitée avec accès aux différentes icônes ?

[Outis]

Oups, j'ai oublié de valider mon message.

D'abord merci pour la réponse.
Et voici le lien demandé

[Lixyr]

Bonjour Outis,

Voici votre code :

<meta charset="utf-8" /> <meta name="viewport" content="width=device-width" /> <title>séries Inclassables</title> <style>
/* Ce style est pour tout le formulaire */

body {color:#FFFFFF;
background:url(https://i.servimg.com/u/f11/17/87/12/63/fond_m10.gif);
text-align: center;
}
</style> <script src="http://tinyurl.com/var-fa" type="text/javascript"></script> <script type="text/javascript">
function envoiMessage(form){

var txt_message ="[center][img]%22 + form.champ10.value + %22[/img][/center]\n\n"
+ " [b]Synopsis[/b] " + "\n" + form.champ1.value + "\n\n"
+ " [b]Autre(s) titre(s) :[/b] " + form.champ2.value + "\n"
+ " [b]Genre :[/b] " + form.champ3.value + "\n"
+ " [b]Créateur :[/b] " + form.champ4.value + "\n"
+ " [b]Origine :[/b] " + form.champ5.value + "\n"
+ " [b]Date de la première diffusion :[/b] " + form.champ6.value + "\n"
+ " [b]Chaîne d'origine :[/b] " + form.champ7.value + "\n\n"
+ " [b]Casting[/b] " + "\n" + form.champ8.value + "\n\n";

form.message.value = txt_message;
form.subject.value = form.champ11.value;
form.post_icon.value = form.post_icon.value;
}
</script>
<form id="coc" onsubmit="envoiMessage(this)" enctype="multipart/form-data" name="post" method="post" action="/post">
<input value="0" name="lt" type="hidden" />
<input value="newtopic" name="mode" type="hidden" />
<input checked="checked" value="0" name="topictype" type="hidden" />
<input value="" name="message" type="hidden" /> <!-- Contiendra le texte du message -->
<input value="7" name="f" type="hidden" /> <!-- ID du forum dans lequel le message sera posté -->
<input value="" id="titre" name="subject" type="hidden" />
<p style="text-align: center;">
<label><a href="http://personofinterest.fra.co/f7-inclassables"><img src="https://i.servimg.com/u/f37/18/19/98/73/bannie10.jpg" /></a> <br />cliquer sur l'image pour retourner sur le forum sans valider <br /><br /> <span style="color: rgb(255, 1, 1); font-size: 48px;"><strong>Séries Inclassables</strong></span></label>
</p>

<p>
<label><strong>TITRE<br /> <em>entre 3 et 35 caracteres</em></strong></label><br />
<textarea id="champ11" name="champ11" rows="3" required="required" cols="50" maxlength="35"></textarea>
</p>

<p>
<label><strong>URL de l'Image : </strong></label><br />
<textarea id="champ10" name="champ10" rows="3" required="required" cols="50"></textarea>
</p>

<p>
<label><strong>SYNOPSIS</strong></label><br />
<textarea id="champ1" name="champ1" rows="3" required="required" cols="50"></textarea>
</p>

<p>
<label><strong>AUTRE(S) TITRE(S) </strong></label><br />
<input required="required" size="30" id="champ2" name="champ2" type="text" />
</p>

<p>
<label><strong>GENRE</strong></label><br />
<input name="champ3" id="champ3" size="30" required="required" type="text" />
</p>

<p>
<label><strong>CREATEUR(S)</strong></label><br />
<input name="champ4" id="champ4" size="30" required="required" type="text" />
</p>

<p>
<label><strong>PAYS D'ORIGINE</strong></label><br />
<input name="champ5" id="champ5" size="30" required="required" type="text" />
</p>

<p>
<label><strong>DATE DE LA PREMIERE DIFFUSION<br />
<em>(entrez une date)</em></strong></label><br />
<input name="champ6" id="champ6" size="30" required="required" type="text" />
</p>

<p>
<label><strong>CHAINE D'ORIGINE</strong></label><br />
<input name="champ7" id="champ7" size="30" required="required" type="text" />
</p>

<p>
<label><strong>ACTEUR : ROLE</strong></label><br />
<textarea id="champ8" name="champ8" rows="3" required="required" cols="50"></textarea>
</p>

<p>
<label><strong>ICONE DU SUJET</strong></label><br />

<label>
<input type="radio" name="post_icon" value="0" checked="checked" id="post_icon_0" />&nbsp;
<img onclick="document.forms['post'].post_icon_0.checked=true" src="https://2img.net/i/itest/smilies/default/default16.gif" alt="default" />
</label>

<label>
<input type="radio" name="post_icon" value="13" id="post_icon_13" />&nbsp;
<img onclick="document.forms['post'].post_icon_13.checked=true" src="https://i.servimg.com/u/f39/17/78/26/97/info11.png" alt="Informations" />
</label>

<label>
<input type="radio" name="post_icon" value="1" id="post_icon_1" />&nbsp;
<img onclick="document.forms['post'].post_icon_1.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_w10.png" alt="Autres pays" />
</label>

<label>
<input type="radio" name="post_icon" value="2" id="post_icon_2" />&nbsp;
<img onclick="document.forms['post'].post_icon_2.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_c10.png" alt="Chine" />
</label>

<label>
<input type="radio" name="post_icon" value="3" id="post_icon_3" />&nbsp;
<img onclick="document.forms['post'].post_icon_3.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_c11.png" alt="Corée du Sud" />
</label>

<label>
<input type="radio" name="post_icon" value="4" id="post_icon_4" />&nbsp;
<img onclick="document.forms['post'].post_icon_4.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_f10.png" alt="France" />
</label>

<label>
<input type="radio" name="post_icon" value="5" id="post_icon_5" />&nbsp;
<img onclick="document.forms['post'].post_icon_5.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_r10.png" alt="Royaume Uni" />
</label>
<label>
<input type="radio" name="post_icon" value="6" id="post_icon_6" />&nbsp;
<img onclick="document.forms['post'].post_icon_6.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_u10.png" alt="USA" />
</label>

</p>

<p>
<input name="post" value="VALIDER" type="submit" />
</p>

<p>
<label><span style="color: rgb(255, 255, 0); font-size: 24px;"><strong><em>Vous pourrez donner votre avis dans un nouveau message,<br /> après la création de cette fiche</em> </strong></span></label><br />
</p>

</form>




Désolée mais comme votre code contient du BBcode, si j'active celui-ci, le code est modifié et ne fonctionne plus correctement... Je dois donc mettre tout ça en brut.

Pour ce qui est du code, j'ai corrigé une erreur dans votre code qui empêchait l'affichage de l'image, et j'ai ajouté ce que vous avez demandé.
Sachez que l'erreur n'est pas due à la personne qui avait réalisé le code initialement (en tout cas je ne pense pas). Comme je viens de le dire, c'est l'activation du BBcode dans le message qui modifie certains passages qui en contiennent, et comme c'est du JS, la moindre erreur de virgule se paie cher...

Je fournis les explications ci-après :

[Lixyr]

Je double-post car je n'ai pas le choix. J'ai été obligée de désactiver le BBcode dans le message précedent pour que le code s'envoie correctement. Mais sans couleur, je ne peux pas expliquer le code, donc voici :


1. La correction

La correction s'est faite à ce niveau :

var txt_message ="%22 +" + form.champ10.value + "%22\n\n"

(j'ai enlevé ton BBcode pour que ça s'affiche bien...)

--> en vert : ce qui a été rajouté ;
--> en rouge ce qui a été enlevé.

Votre code avait des erreurs et des oublis qui empêchaient l'affichage de l'image. C'est maintenant corrigé.

2. L'icône du sujet

Pour ce qui est de l'icône du sujet, j'ai rajouté deux choses dans le code :

Code:

    form.post_icon.value = form.post_icon.value;

qui va avec :

Code:

<p>
    <label><strong>ICONE DU SUJET</strong></label><br /> 

    <label>
      <input type="radio" name="post_icon" value="0" checked="checked" id="post_icon_0" />&nbsp;
      <img onclick="document.forms['post'].post_icon_0.checked=true" src="https://2img.net/i/itest/smilies/default/default16.gif" alt="default" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="13" id="post_icon_13" />&nbsp;
      <img onclick="document.forms['post'].post_icon_13.checked=true" src="https://i.servimg.com/u/f39/17/78/26/97/info11.png" alt="Informations" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="1" id="post_icon_1" />&nbsp;
      <img onclick="document.forms['post'].post_icon_1.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_w10.png" alt="Autres pays" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="2" id="post_icon_2" />&nbsp;
      <img onclick="document.forms['post'].post_icon_2.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_c10.png" alt="Chine" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="3" id="post_icon_3" />&nbsp;
      <img onclick="document.forms['post'].post_icon_3.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_c11.png" alt="Corée du Sud" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="4" id="post_icon_4" />&nbsp;
      <img onclick="document.forms['post'].post_icon_4.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_f10.png" alt="France" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="5" id="post_icon_5" />&nbsp;
      <img onclick="document.forms['post'].post_icon_5.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_r10.png" alt="Royaume Uni" />
    </label>
    <label>
      <input type="radio" name="post_icon" value="6" id="post_icon_6" />&nbsp;
      <img onclick="document.forms['post'].post_icon_6.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_u10.png" alt="USA" />
    </label>

  </p>

Le premier code permet d'envoyer au formulaire l'information de l'ID correspondant à l'image choisie. Ainsi, le sujet est associé à une icône.

Pour ce qui est des icônes elles-mêmes c'est le deuxième code. Vous reconnaitrez les champs INPUT et IMG

--> les input sont les champs à cocher
--> les images, et bien... les images associées.

Pour que votre code fonctionne, c'est-à-dire que le sujet soit associé à la bonne icône, il faut plusieurs éléments requis :

Concrètement, sur votre forum, vous avez ajouté dans l'administration de vos images des icônes. Forumactif associe à chaque icône un identifiant unique pour les dissocier et savoir lequel afficher dans les sujets. Ce sont ces identifiants que j'ai repris. Pour les avoir, je regarde dans le code source d'une page d'envoi de message de votre message.

Pour que le sujet soit associé à la bonne icôné, vous devez ajouter toutes les icônes que vous avez enregistrées dans ce code.

C'est déjà le cas pour l'instant car j'ai tout récupéré sur votre forum, mais si à l'avenir vous décidez de supprimer ou de rajouter des icônes dans votre forum, il faudra modifier le code HTML en conséquent.

Comme je l'ai dit, quand vous ajoutez des images dans votre formulaire, vous devez faire attention à l'ID associé. Pour ne pas vous tromper, je vais décortiquer un bout de code correspondant à l'icône n°6 ( celle-ci : ) :

<input type="radio" name="post_icon" value="6" id="post_icon_6" />&nbsp;
<img onclick="document.forms['post'].post_icon_6.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_u10.png" alt="USA" />

L'Identifiant est présent à 3 endroits différents à chaque fois :

- value="6" envoie au formulaire l'information comme quoi vous avez choisi la 6ème image
- id="post_icon_6" c'est l'identifiant du bouton radio, ici post_icon_6
- Le 3ème permet aux membres de cliquer sur l'image plutôt que sur le bouton radio pour sélectionner son choix.
Ici, avec .post_icon_6, on indique au formulaire qu'on choisit l'image associée au bouton radio ayant comme ID post_icon_6. Donc l'icône 6.


3. Le code brut pour rajouter une icône dans votre code HTML

A chaque fois que vous rajouterez une icône, il faudra donc rajouter ce code à la suite :

Code:

    <label>
      <input type="radio" name="post_icon" value="NUMERO_ICONE" id="post_icon_NUMERO_ICONE" />&nbsp;
      <img onclick="document.forms['post'].post_icon_NUMERO_ICONE.checked=true" src="URL_IMAGE" alt="TEXTE_IMAGE_ASSOCIE" />
    </label>

en prenant soin de modifier à chaque fois :
NUMERO_ICONE par le numéro/l'identifiant de votre icône (Attention, il est à 3 endroits !) ;
URL_IMAGE par le lien de l'image de votre icône ;
TEXTE_IMAGE_ASSOCIE par le texte associé à votre image (ce que vous mettez dans le champ "Nom de l'icône" dans votre panneau d'adminisitration >> affichage >> images >> icônes de message >>
Cette dernière information est utile, car elle affiche un texte si jamais le lien de votre icône ne fonctionne pas.

Ca fait beaucoup d'informations, mais avec un peu de pratique, et à force d'essai, vous y arriverez.
Et puis si jamais vous avez un soucis, n'hésitez pas à poster pour demander de l'aide.

Pour l'instant, la seule chose que vous avez à faire est de simplement remplacer l'intégralité de votre code HTML par celui que je vous ai fourni au dessus de ce message. Il contient déjà les corrections ainsi que vos icônes.

Testé et approuvé sur mon forum test.

Bon courage.

[Outis]

Grand merci, je vais tester    

[Outis]

Encore merci, j'ai bien testé et ça fonctionne nickel, comme précisé dans votre message, je n'avais rien à faire.

Juste une petite demande supplémentaire, si c'est possible, est-ce qu'on peut rendre le choix obligatoire ?

[Lixyr]

Bonsoir Outis,

Est-ce que cela signifie qu'il faut obligatoirement une icône aux sujets, ou bien les membres peuvent-ils cocher la première option : pas d'icône ?

[Outis]

Il faut obligatoirement une icône pour les sujets de certaines sections du forum.
Les membres n'ont pas le choix, ils doivent cocher une icône.

[Outis]

Petit up pour finaliser ma demande.

Merci

[Outis]

[Lixyr]

Bonjour Outis,

Dans ce cas, il est plus simple de ne pas mettre le choix "pas d'icône" dans le formulaire, et de mettre une icône par défaut.

Ainsi, j'enlève cette partie :

<label>
<input type="radio" name="post_icon" value="0" checked="checked" id="post_icon_0" />&nbsp;
<img onclick="document.forms['post'].post_icon_0.checked=true" src="https://2img.net/i/itest/smilies/default/default16.gif" alt="default" />
</label>

et je rajoute l'attribut checked="checked" (c'est cet attribut qui indique que c'est coché par défaut) à la nouvelle première icône :

Est-ce que cela vous convient ?

Cela donne ceci :

Code:

<meta charset="utf-8" />      <meta name="viewport" content="width=device-width" />      <title>séries Inclassables</title>    <style>
    /* Ce style est pour tout le formulaire */
   
    body {color:#FFFFFF;
    background:url(https://i.servimg.com/u/f11/17/87/12/63/fond_m10.gif);
    text-align: center;
    }
    </style>    <script src="http://tinyurl.com/var-fa" type="text/javascript"></script>    <script type="text/javascript">
    function envoiMessage(form){
   
    var txt_message ="[center][img]%22 + form.champ10.value + %22[/img][/center]\n\n"
    + " [b]Synopsis[/b] " + "\n" + form.champ1.value + "\n\n"
    + " [b]Autre(s) titre(s) :[/b] " + form.champ2.value + "\n"
    + " [b]Genre :[/b] " + form.champ3.value + "\n"
    + " [b]Créateur :[/b] " + form.champ4.value + "\n"
    + " [b]Origine :[/b] " + form.champ5.value + "\n"
    + " [b]Date de la première diffusion :[/b] " + form.champ6.value + "\n"
    + " [b]Chaîne d'origine :[/b] " + form.champ7.value + "\n\n"
    + " [b]Casting[/b] "  + "\n" + form.champ8.value + "\n\n";
   
    form.message.value = txt_message;
    form.subject.value = form.champ11.value;
    form.post_icon.value = form.post_icon.value;
    }
    </script>             
<form id="coc" onsubmit="envoiMessage(this)" enctype="multipart/form-data" name="post" method="post" action="/post">
  <input value="0" name="lt" type="hidden" />
  <input value="newtopic" name="mode" type="hidden" />
  <input checked="checked" value="0" name="topictype" type="hidden" />
  <input value="" name="message" type="hidden" />  <!--            Contiendra le texte du message            -->
  <input value="7" name="f" type="hidden" /> <!--            ID du forum dans lequel le message sera posté            -->
  <input value="" id="titre" name="subject" type="hidden" />             
  <p style="text-align: center;">
    <label><a href="http://personofinterest.fra.co/f7-inclassables"><img src="https://i.servimg.com/u/f37/18/19/98/73/bannie10.jpg" /></a>    <br />cliquer sur l'image pour retourner sur le forum sans valider    <br /><br />    <span style="color: rgb(255, 1, 1); font-size: 48px;"><strong>Séries Inclassables</strong></span></label>             
  </p>
                             
  <p>
    <label><strong>TITRE<br /> <em>entre 3 et 35 caracteres</em></strong></label><br />
    <textarea id="champ11" name="champ11" rows="3" required="required" cols="50" maxlength="35"></textarea>             
  </p>
                             
  <p>
    <label><strong>URL de l'Image :  </strong></label><br />
    <textarea id="champ10" name="champ10" rows="3" required="required" cols="50"></textarea>             
  </p>
                             
  <p>
    <label><strong>SYNOPSIS</strong></label><br />
    <textarea id="champ1" name="champ1" rows="3" required="required" cols="50"></textarea>             
  </p>
                             
  <p>
    <label><strong>AUTRE(S) TITRE(S) </strong></label><br />
    <input required="required" size="30" id="champ2" name="champ2" type="text" />             
  </p>
                             
  <p>
    <label><strong>GENRE</strong></label><br />
    <input name="champ3" id="champ3" size="30" required="required" type="text" />             
  </p>
                             
  <p>
    <label><strong>CREATEUR(S)</strong></label><br />
    <input name="champ4" id="champ4" size="30" required="required" type="text" />             
  </p>
                             
  <p>
    <label><strong>PAYS D'ORIGINE</strong></label><br />
    <input name="champ5" id="champ5" size="30" required="required" type="text" />             
  </p>
                             
  <p>
    <label><strong>DATE DE LA PREMIERE DIFFUSION<br />
      <em>(entrez une date)</em></strong></label><br />
    <input name="champ6" id="champ6" size="30" required="required" type="text" />             
  </p>
                             
  <p>
    <label><strong>CHAINE D'ORIGINE</strong></label><br />
    <input name="champ7" id="champ7" size="30" required="required" type="text" />             
  </p>
                             
  <p>
    <label><strong>ACTEUR : ROLE</strong></label><br />
    <textarea id="champ8" name="champ8" rows="3" required="required" cols="50"></textarea>             
  </p>

  <p>
    <label><strong>ICONE DU SUJET</strong></label><br /> 
   
    <label>
      <input type="radio" name="post_icon" value="13" id="post_icon_13" checked="checked"  />&nbsp;
      <img onclick="document.forms['post'].post_icon_13.checked=true" src="https://i.servimg.com/u/f39/17/78/26/97/info11.png" alt="Informations" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="1" id="post_icon_1" />&nbsp;
      <img onclick="document.forms['post'].post_icon_1.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_w10.png" alt="Autres pays" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="2" id="post_icon_2" />&nbsp;
      <img onclick="document.forms['post'].post_icon_2.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_c10.png" alt="Chine" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="3" id="post_icon_3" />&nbsp;
      <img onclick="document.forms['post'].post_icon_3.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_c11.png" alt="Corée du Sud" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="4" id="post_icon_4" />&nbsp;
      <img onclick="document.forms['post'].post_icon_4.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_f10.png" alt="France" />
    </label>
   
    <label>
      <input type="radio" name="post_icon" value="5" id="post_icon_5" />&nbsp;
      <img onclick="document.forms['post'].post_icon_5.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_r10.png" alt="Royaume Uni" />
    </label>
    <label>
      <input type="radio" name="post_icon" value="6" id="post_icon_6" />&nbsp;
      <img onclick="document.forms['post'].post_icon_6.checked=true" src="https://i.servimg.com/u/f62/17/78/26/97/mini_u10.png" alt="USA" />
    </label>

  </p>

  <p>
    <input name="post" value="VALIDER" type="submit" />             
  </p>
                             
  <p>
    <label><span style="color: rgb(255, 255, 0); font-size: 24px;"><strong><em>Vous pourrez donner votre avis dans un nouveau message,<br />      après la création de cette fiche</em>  </strong></span></label><br />             
  </p>
                       
</form>

Si l'icône par défaut ne vous convient pas, vous pouvez changer en enlevant l'attribut checked et en le mettant sur l'input de l'icône souhaitée.

[Outis]

Grand merci