5568 sujets

Sémantique web et HTML

Bonjour,

j'ai un formulaire de ce type là :



<a name="formulaire_menu_lang" id="formulaire_menu_lang"></a>

<form method="post" action="#ENV{url}">  [(#ENV{url}|form_hidden)]

  <input type="image" name="var_lang" value="fr" src="http://www.korx-crew.com/test/spip/squelettes/images/flag_france.png" alt="Fran&ccedil;ais" title="Fran&ccedil;ais" height="13" width="20" />

  <input type="image" name="var_lang" value="en" src="http://www.korx-crew.com/test/spip/squelettes/images/flag_uk.png" alt="English" title="English" height="13" width="20" />

  <noscript>

   <input type="submit" value="&gt;&gt;" />

  </noscript>

</form>



Qui ressort ce code dans le source :



<a name="formulaire_menu_lang" id="formulaire_menu_lang"></a>
  <form method="post" action="http://www.korx-crew.com/test/spip/spip.php?action=cookie&amp;url=%2Ftest%2Fspip%2F">
      
<input name='action' value='cookie' type='hidden' />
<input name='url' value='/test/spip/' type='hidden' />
      <input type="image" name="var_lang" value="fr" src="http://www.korx-crew.com/test/spip/squelettes/images/flag_france.png" alt="Fran&ccedil;ais" title="Fran&ccedil;ais" height="13" width="20" />&nbsp;

      <input type="image" name="var_lang" value="en" src="http://www.korx-crew.com/test/spip/squelettes/images/flag_uk.png" alt="English" title="English" height="13" width="20" />
      <noscript>
        <input type="submit" value="&gt;&gt;" />
      </noscript>
  </form>



Le site est visible à cette adresse : www.korx-crew.com

Comme l'indique l'url je taf sur un moteur spip actuellement et ce dernier gère un système multilingue via des cookies.

Mon formulaire a pour but de changer la langue en rajoutant la variable ?lang=fr ou ?lang=en à l'url. Il fonctionne très bien sous firefox mais pas sous IE (6 et 7) ni sous opera.

Quelqu'un saurait-il d'ou celà vient ??

Je précise que sous ie et opera le flag français semble fonctionner en donnant le bon lien ce qui n'est pas le cas du flag English qui lui renvoi vers la page initiale Smiley ohwell

PS: je n'arrive pas non plus a avoir l'alignement vertical des ti drapeau sous ie et opera. idem meme question.
Modifié par Klesk (30 Jul 2008 - 12:07)
Bon rectification après différents refresh et vidage de cache, l'alignement vertical est parfait sous ie et firefox et interprété pas tip top sous opera mais ça reste correct donc passons.

En revanche je rectifi egalement, les flag français et anglais ne fonctionnent nullement sous ie et opera.
je suis désolé pour cette réponse non constructive.
Etant donné que je n'ai que firefox, je n'ai pas pu constater ton probleme, donc j'ai regardé un peu ton site, et je voulais juste dire... ptdr pour les traductions en anglais Smiley biggol
Rasta31 a écrit :
je suis désolé pour cette réponse non constructive.
Etant donné que je n'ai que firefox, je n'ai pas pu constater ton probleme, donc j'ai regardé un peu ton site, et je voulais juste dire... ptdr pour les traductions en anglais Smiley biggol



En effet...tu peux donc passer ton chemin !! Smiley smile See you Smiley cligne

Je ne m'occupe pas du contenu mais du dev, et j'ai un anglophone qui s'occupera des trads quand le site sera en ligne donc le fait qu'actuellement un pote m'ai pondu des textes bateau ou autre je m'en carre, ça me serre juste à tester mes fonctions.

EDIT : je viens d'aller faire un tour sur ton site et je pense qu'on doit avoir le même pote pour les trad...

a écrit :

This website have been all (HTML/CSS/PHP) coded by RIEU Kevin, helped by InZeMiX from astrowars.
There is no real copyright on this website, it is "open source", you just need to contact the webmaster to get the source you want. It does not mean you can appropriate yourself RIEU Kevin's work.


Anglais niveau scolaire en gros.


Sur ce si quelqu'un à une idée concernant mon problème ça serait intéressant.
Modifié par Klesk (05 Aug 2007 - 04:21)
bon alors tout premierement, pour faire fonctionner un vertical-align il faut que le parent soit défini en tant que display: table-cell; sinon ça ne marche pas.

Ensuite tu dois remplacer ton display: inline; par un float: left.

Pour éviter de devoir modifier le css et le html pour changer les tailles de tes éléments de formulaire, passe tous les attribut height et width du html dans le css. Tu vas en avoir besoin pour modifier la hauteur/largeur de ton select.

Aussi, au lieu d'utiliser plusieurs &nbsp; tu peux utiliser la fonction margin-right sur le formulaire.

Sinon les flags fonctionnent très bien sous firefox et opera, j'ai pas pu tester sous IE, je n'ai pas windows.

NB: merci d'être plus aimable à l'avenir, j'ai juste déliré sur la traduction qui ne correspond pas au niveau de langage du francais (qui est plutôt soutenu, alors que l'anglais est plutôt familier "fucking good server")
Modifié par Rasta31 (05 Aug 2007 - 18:00)
Tout d'abord merci pour ton mea culpa et je te présente également le miens. A l'avenir taches d'être plus explicites quand tu délires sur un truc !! Smiley smile JE ne l'avais pas compris comme je le devais visiblement !!


Bon sinon concernant tes remarques j'en prends note pour la suite et je tacherai de m'en servir pour optimiser mon source.

Mon problème principal actuellement étant le non fonctionnement de mon formulaire cité ci-dessus sous ie et opera, alors qu'il foncitonne parfaitement sous firefox :S. N'étant pas super familier des formulaires je suis un peu bloqué.

PS: J'avoue avoir bien rigolé à la relecture des trad anglaises de mon site. Je comprends mieux ta réaction !! Enfin bon ça ne me choque pas Smiley lol et vu le sujet du site ça ne ferait pas non plus tache si on les laissaient telles qu'elles.
Modifié par Klesk (05 Aug 2007 - 19:25)
peut etre devrais tu specifier l'attribut method="GET/POST" (l'un ou l'autre, pour ton cas ça doit etre du GET)

mais je ne sais pas si ça va vraiment aider. Essaye tout de même.
J'ai déjà l'attribu method="post" dans ma balise <form>. EN fait je suis parti du code source d'origine de spip qui est le suivant :



<div class="formulaire_spip formulaire_menu_lang">
<a name="formulaire_menu_lang" id="formulaire_menu_lang"></a>

<form method="post" action="#ENV{url}"><div>
	[(#ENV{url}|form_hidden)]
	<label for="#ENV{nom}"><:info_langues:></label>
	<select class="forml" name="#ENV{nom}" id="#ENV{nom}" onchange="document.location.href='#ENV{url}&amp;#ENV{nom}='+this.options[this.selectedIndex].value">
	#ENV*{langues}
	</select>
	<noscript><div style="display:inline;">
		<input type="submit" value="&gt;&gt;" />
	</div></noscript>
</div></form>

</div>



En fait je cherche a transformer le <select> en <input type="image" /> ayant faisant appel a la meme fonction de spip. Apparement ça change simplement la valeur d'un cookie.
c'est vrai que ton formulaire est un peu spécial.

A ta place j'aurais plutot fait un truc du genre :


<a href="spip/change_language.php?language=french"><img src="french_flag.png" alt="french flag" title="Set language to french" /></a>
<a href="spip/change_language.php?language=english"><img src="english_flag.png" alt="english flag" title="Set language to english" /></a>


et dans ton script php tu modifies le cookie de l'utilisateur et tu le rediriges vers la page d'accueil ou encore mieux celle d'où il vient.

Mais bon je ne sais vraiment pas comment fonctionne spip, donc peut etre que je suis à coté de la plaque.
En fait voilà ce que retourne le source du formulaire d'origine de spip :



<a name="formulaire_menu_lang" id="formulaire_menu_lang"></a>

<form method="post" action="http://www.korx-crew.com/test/spip/spip.php?action=cookie&amp;url=%2Ftest%2Fspip%2F"><div>
	
<input name='action' value='cookie' type='hidden' />
<input name='url' value='/test/spip/' type='hidden' />
	<label for="var_lang">Langues du site</label>

	<select class="forml" name="var_lang" id="var_lang" onchange="document.location.href='http://www.korx-crew.com/test/spip/spip.php?action=cookie&amp;url=%2Ftest%2Fspip%2F&amp;var_lang='+this.options[this.selectedIndex].value">
	<option class='maj-debut' value='en'>English</option>
<option class='maj-debut' value='fr' selected='selected'>fran&#231;ais</option>
</select>
	<noscript><div style="display:inline;">
		<input type="submit" value="&gt;&gt;" />
	</div></noscript>
</div></form>



On y voit que la variable #ENV{url} retourne l'url
http://www.korx-crew.com/test/spip/spip.php?action=cookie&amp;url=%2Ftest%2Fspip%2F


Que [(#ENV{url}|form_hidden)] retourne les deux balises :



<input name='action' value='cookie' type='hidden' />
<input name='url' value='/test/spip/' type='hidden' />



ET que la variable #ENV{nom} retourne var_lang.

On y voit que chacune des sélection possible retourne la valeur fr ou en en utiliant le onchange de la balise select :

onchange="document.location.href='http://www.korx-crew.com/test/spip/spip.php?action=cookie&amp;url=%2Ftest%2Fspip%2F&amp;var_lang='+this.options[this.selectedIndex].value"


Ce qui nous donne finalement une url comme ça :

http://www.korx-crew.com/test/spip/spip.php?action=cookie&url=%2Ftest%2Fspip%2F&var_lang=(fr ou en )


Ce qui permet le changement de langue est la variable ?lang=fr ou ?lang=en qui s'ajoute dans l'url selon la valeur dans le cookie.
Modifié par Florent V. (06 Aug 2007 - 10:55)
s'il y a juste une variable à rajouter dans l'url je pense que tu n'as pas besoin de formulaire, et que des liens suffisent, cf mon post précédent pour le code.

Mais bon, possible que je n'ai toujours pas compris le fonctionnement de ton truc Smiley lol
Le formulair permet de changer la variable dans le cookie. Et c'est la présence de ce cookie et son contenu qui permettent l'affichage dans la langue voulue.
ok ok, donc t'es obligé d'utiliser un formulaire.

pour l'affichage du formulaire, je t'ai donné 2 / 3 conseils, j'espere que ça s'affiche correctement désormais.

Pour le fonctionnement du formulaire sous IE et opera je ne peux plus trop t'aider, il faudrait quelqu'un qui connaisse spip.

Sinon avec opera, le select fonctionne pour changer de langue, mais pas les drapeaux.
Heyoan a écrit :
Salut Klesk,

il me semblait bien que la solution que je te donnais dans ce post fonctionnait Smiley rolleyes ...

L'as-tu essayée ?


Disons que j'aimerai tant que possible utiliser les fonctions de spip plutôt que de partir dans du code php.

Sachant en plus que le formulaire spip de base avec le select fonctionne parfaitement quel que soit le navigateur, donc ya pas de raison qu'on y arrive pas avec des input . J'ai déjà reussi à la faire sous firefox, reste plus qu'a faire en sorte que ça marche sous ie et opera.

J'ai recréé un post "PROPRE" car ma demande n'avait plus rien à voir avec le sujet vu que j'avais moi même répondu à un sujet existant.
Modifié par Klesk (06 Aug 2007 - 09:41)
Bon j'ai en partie résolu mon problème, voir même quasi entièrement !!

Voici le code pour spip :


<B_langues> 

  <div id="menu-lang">       

    [<strong class="langue_contexte">(#LANG|traduire_nom_langue)</strong>] 

      <BOUCLE_langues(RUBRIQUES){racine}{par lang}{lang !=#ENV{lang}}>[ 

        <span lang="#LANG" xml:lang="#LANG">|  

          <a href="spip.php?action=cookie&amp;url=#URL_SITE_SPIP/&amp;var_lang=#LANG" rel="alternate" hreflang="#LANG" title="<:accueil_site:> : [(#LANG|traduire_nom_langue)]"   dir="#LANG_DIR">(#LANG|unique|traduire_nom_langue{lang})</a> 

        </span> 

     ]</BOUCLE_langues> 

  </div> 

</B_langues> 


Ya un peu de mise en page avec. Donc le principe là c'est qu'il va, grace à la boucle, me générer un listing horizontal des langues disponibles sur le site. Donc il peut y en avoir 2 comme 6, après on peut limiter le nombre de résultats. La langue sur laquelle nous sommes n'est pas clicable et est positionner avant toutes les autres avec un style qui lui est propre.

Donc pour le moment je suis sur une base texte mais c'est très facilement modifiable pour être mis avec des images étant donné qu'il s'agit de liens.

Le seul souci que je rencontre actuellement, c'est que quand je met des images dans ces liens via une balise <img src="" />, l'image ne s'affichent pas mais la zone de celle-ci est clicable (ie6). Alors que si je prends l'url de l'image dans le source et que je la met direct dans le navigateur cette dernière s'affiche sans problème !!!

J'avoue ne pas voir d'ou ça vient !! Je vais tester avec d'autres browser pour voir ce qui ressort.

PS: je vais vous remettre les images a coté des langues texte pour que vous constatiez le problème.

EDIT : Je comprends pas ça marche maintenant !! Sur tous les browser (ie6, ie7,opera 9.10, firefox 2.0.0.6),enfin me reste a tester sous linux, je verrai ce soir.
Modifié par Klesk (06 Aug 2007 - 19:11)