Le multilinguisme risque de cloisonner les discutions entre chaque langue et de limiter la vie communautaire du site.
Evidemment, il n’est pas toujours évident que l’utilisateur connaisse toutes les langues, mais il peut tout de même en comprendre plus d’une et participer aux discutions de chaque traduction.
Choix d’affichage
Comment afficher les plusieurs forums sur une même page. Les boucles spip ne permettent pas de mélanger correctement chaque langue. Les afficher les unes derrière les autres dérouterait l’utilisateur puisqu’on ne garderait pas l’ordre chronologique.
Mon choix a alors été de choisir javascript et le css pour afficher un onglet pour chaque langue.
Avant tout, il faut définir des nouvelles classes css (dans habillage.css par exemple) :
/*
* onglets forums langue
*/
li.onglet a { text-decoration: none; color: #505050; }
li.onglet a:hover { text-decoration: none; color: #303030; background: #efefef; }
li.onglet-last a:hover { text-decoration: none; color: #303030; background: #efefef; }
li.onglet-selected a:hover { text-decoration: none; color: #303030; background: white; }
li.onglet-selected-last a:hover { text-decoration: none; color: #303030; background: white; }
li.onglet, li.onglet-last, li.onglet-selected-last, li.onglet-selected {
display: inline;
padding: 3px;
margin-right: -1px;
border: 1px solid #a4a4a4;
font-size: 80%;
}
li.onglet, li.onglet-last {
color: #a0a0a0;
background: #efefef;
}
li.onglet {
border-right: 0px;
}
li.onglet-selected, li.onglet-selected-last {
background: #cfcfcf;
}
li.onglet-selected {
border-right: 0px;
}
div.onglet-content {
border-top: 1px #a4a4a4 solid;
margin-left: -16px;
padding: 3px;
padding-left: 16px;
display: block;
margin-top: -1em;
}
div.onglet-content-hidden {
visibility: hidden;
position: absolute;
top: 0;
left: 0;
display: block;
}
et un bout de javascript, à mettre soit dans le header de votre page (entre
et), soit juste avant les boucles présentées ici :
<script language="JavaScript">
function change(id, newClass) {
identity=document.getElementById(id);
identity.className=newClass;
}
</script>
On n’est pas ici pour faire un cour de css ou de javascript, je vous pointes vers ces pages [1] et [2] pour plus d’information. Libre à vous d’adapter le css (ou pour les experts les boucles à venir) pour une présentation personnalisée.
Squelette
Voici le squelette tout fait, à voir en démo ici ou là.
forum_multi.php
<?php
if (!defined("_LICENCE")) {
define("_LICENCE", "1");
?>
<!--
This is a template for SPIP(spip.net) cms. Developped by Pierre Andrews for 6v8.gamboni.org
Copyright (C) 2003 Pierre ANDREWS
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation; either version 2 of the License, or any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
-->
<?php } ?>
<?php
$fond = "forum_multi";
$delais = 24 * 3600;
$multilang = true;
include ("inc-public.php");
?>
forum_multi.html
<?php
if (!defined("_LICENCE")) {
define("_LICENCE", "1");
?>
<!--
This is a template for SPIP(spip.net) cms. Developped by Pierre Andrews for 6v8.gamboni.org
Copyright (C) 2003 Pierre ANDREWS
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation; either version 2 of the License, or any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307 USA
-->
<?php } ?>
<!--insérez ici le code javascript par exemple-->
<BOUCLE_global(ARTICLES){id_article}>
<B_traduction_onglets>
<!-- les onglets -->
<div id="onglets">
<ul>
<?php $counter_onglets = 0;?>
<BOUCLE_traduction_onglets(ARTICLES) {traduction}>
<B_forum_onglet>
<?php $nb_forum = #TOTAL_BOUCLE;?>
<BOUCLE_forum_onglet(FORUMS){id_article}>
</BOUCLE_forum_onglet>
<?php $counter_onglets++;?>
<li class="<?php if($menu_lang == "#LANG") { echo "onglet-selected"; } else if($counter_onglets == #TOTAL_BOUCLE) {echo "onglet-last";} else {echo "onglet";}?>" id="#LANG">
<?php $counter_onglets_autres = 0;?>
<?php if($nb_forum > 0) {?>
<a href="javascript:;" onClick="change('#LANG','<?php echo ($counter_onglets == #TOTAL_BOUCLE)?"onglet-selected-last":"onglet-selected";?>');change('#LANG-content','onglet-content');<BOUCLE_traduction_onglets_autres(ARTICLES) {traduction}{exclus}><?php $counter_onglets_autres++;?>change('#LANG','<?php echo ($counter_onglets_autres == #TOTAL_BOUCLE)?"onglet-last":"onglet";?>');change('#LANG-content','onglet-content-hidden');</BOUCLE_traduction_onglets_autres>">[(#LANG|traduire_nom_langue)]</a>
<?php } else {?>
[(#LANG|traduire_nom_langue)]
<?php } $nb_forum = 0;?>
</li>
</BOUCLE_traduction_onglets>
</ul>
</div>
</B_traduction_onglets>
<!--pas de traduction ‡ l'article #TITRE-->
<//B_traduction_onglets>
<B_traduction_forum>
<!-- les forums -->
<div>
<BOUCLE_traduction_forum(ARTICLES) {traduction}>
<div class="<?php if($menu_lang=="#LANG") { echo "onglet-content"; } else {echo "onglet-content-hidden";}?>" id="#LANG-content">
<B_forums2>
<ul class="forum-total">
<BOUCLE_forums2(FORUMS){id_article}{par date}{inverse}>
<li>
<div class="forum-fil">
<div class="forum">
<a name="forum#ID_FORUM"></a>
<div class="forum-chapo">
<div class="forum-titre">#TITRE</div>
[(#DATE|affdate)][ | <A HREF="ecrire_auteur.php?id_article=#ID_ARTICLE">(#NOM)</A>]
</div>
<div class="forum-item">
#TEXTE
[<div class='forum-titre'><a href="(#URL_SITE)" class="spip_out">#NOM_SITE</a></div>]
[<div class='forum-repondre-message'><a href="forum.php?(#PARAMETRES_FORUM)">Reply to this message</a></div>]
</div>
</div>
<B_forums_fils2>
<ul>
<BOUCLE_forums_fils2(FORUMS){id_parent}{par date}>
<li>
<div class="forum">
<a name="forum#ID_FORUM"></a>
<div class="forum-chapo">
<div class="forum-titre">#TITRE</div>
[(#DATE|affdate)][ | <A HREF="ecrire_auteur.php?id_article=#ID_ARTICLE">(#NOM)</A>]
</div>
<div class="forum-item">
#TEXTE
[<div class='forum-titre'><a href="(#URL_SITE)" class="spip_out">#NOM_SITE</a></div>]
[<div class='forum-repondre-message'><a href="forum.php?(#PARAMETRES_FORUM)">Reply to this message</a></div>]
</div>
</div>
<BOUCLE_Forums_Boucle2(boucle_forums_fils2)></BOUCLE_Forums_Boucle2>
</li>
</BOUCLE_forums_fils2>
</ul>
</B_forums_fils2>
</div>
</li>
</BOUCLE_forums2>
</ul>
</B_forums2>
</div>
</BOUCLE_traduction_forum>
</div>
</B_traduction_forum>
<B_forums>
<ul class="forum-total">
<BOUCLE_forums(FORUMS){id_article}{par date}{inverse}>
<li>
<div class="forum-fil">
<div class="forum">
<a name="forum#ID_FORUM"></a>
<div class="forum-chapo">
<div class="forum-titre">#TITRE</div>
[(#DATE|affdate)][ | <A HREF="ecrire_auteur.php?id_article=#ID_ARTICLE">(#NOM)</A>]
</div>
<div class="forum-item">
#TEXTE
[<div class='forum-titre'><a href="(#URL_SITE)" class="spip_out">#NOM_SITE</a></div>]
[<div class='forum-repondre-message'><a href="forum.php?(#PARAMETRES_FORUM)">Reply to this message</a></div>]
</div>
</div>
<B_forums_fils>
<ul>
<BOUCLE_forums_fils(FORUMS){id_parent}{par date}>
<li>
<div class="forum">
<a name="forum#ID_FORUM"></a>
<div class="forum-chapo">
<div class="forum-titre">#TITRE</div>
[(#DATE|affdate)][ | <A HREF="ecrire_auteur.php?id_article=#ID_ARTICLE">(#NOM)</A>]
</div>
<div class="forum-item">
#TEXTE
[<div class='forum-titre'><a href="(#URL_SITE)" class="spip_out">#NOM_SITE</a></div>]
[<div class='forum-repondre-message'><a href="forum.php?(#PARAMETRES_FORUM)">Reply to this message</a></div>]
</div>
</div>
<BOUCLE_Forums_Boucle(boucle_forums_fils2)></BOUCLE_Forums_Boucle>
</li>
</BOUCLE_forums_fils>
</ul>
</B_forums_fils>
</div>
</li>
</BOUCLE_forums>
</ul>
</B_forums>
<//B_traduction_forum>
</BOUCLE_global>
- On commence par une première boucle qui affiche les onglets, il y a un peu de code php pour déterminer celui qu’il faut sélectionner par défaut.
- Ensuite, on boucle pour afficher le contenu.
- S’il n’y a pas de traduction, on affiche seulement le forum de cet article, sans onglet.
Utilisation
pensez bien à insérer le code javascript et css comme indiqué. Vous pouvez ensuite importer le squelette directement (depuis le squelette d’article par exemple) avec le code :
<INCLURE(forum_multi.php){id_article}>
Remarquez qu’il faut que l’ID de l’article soit disponible.
Comptabilité
Ce code est testé avec spip 1.7.2pr1, peut être avec spip 1.7.1, je n’ai pas testé, je ne suis pas sûr que $menu_lang soit disponible.
Browser | Version | Comptabilité |
---|---|---|
Safari | 1.2.1 | oui |
Firefox | 0.8 os X | oui |
IE | 5.1 | oui |
Mozilla | 5.0 windows | oui |
faites moi savoir pour les autres systèmes.
Aucune discussion
Ajouter un commentaire
Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :
Merci d’avance pour les personnes qui vous aideront !
Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.
Suivre les commentaires : |