 | Sujet: [forumactif]Afficher un message particulier suivant le statut de l'Internaute Mer 13 Oct - 14:04 | |
| Hello  Dans ce tuto, nous allons voir comment afficher un message suivant que l'Internaute est inscrit et connecté sur le forum ou non  Attention, ce tutoriel est un peu long  Courage  Pour ce tuto, vous devez avoir accès aux templates de votre forum Tout d'abord, il faut savoir que ce code ne marche pas pour votre message d'en-tête (vous savez celui que vous afficher quand vous allez dans PA >> Affichage >> Page d'accueil >> Généralité, cela ne fonctionne que dans les templates. Pour cet exemple (et explication) nous allons mettre un simple message de bienvenue. Préparation du texte>> Si le membre est connecté, on affichera : | Citation: | | Salut {pseudo}, nous sommes ravis de te retrouver sur {nom du forum}, d'autant plus que ta dernière visite date de {date} |
Pour cela, nous allons donc avoir besoin des variables pseudo, nom du forum et dernière connexion, c'est à dire :
| Code: | {USERNAME}, {FORUMNAME}, {USERLASTVISIT} |
Néanmoins, pour pouvoir les utiliser correctement dans notre template nous allons devoir ajouter :
-> un petit script : pour cela, créez une nouvelle page html et appelez la "variable". On va tout laisser sur "non" et on va y copier/coller ceci
| Code: | function treatvar(nom) { var trouve= xhr.responseText.replace(RegExp("^.+<li style=\"margin-bottom:5px;direction:ltr;text-align:left;\"><strong>{"+nom+"}<\/strong> : (.*?) <span style='direction:ltr'>\(.*?\)<\/span><br \/><\/li>.+$"),'$1'); if(xhr.responseText==trouve) return; var children = document.getElementsByTagName('*') || document.all; var v= new Array(); var i = -1; while(++i < children.length) { var child = children[i]; var classNames = child.className.split(' '); for (var j = 0; j < classNames.length; j++) { if (classNames[j] == nom) { v.push(child); break; } } } i=-1; while(++i!=v.length) if(v[i].tagName=='INPUT'||v[i].tagName=='TEXTAREA')v[i].value+= trouve; else v[i].innerHTML+=trouve;}; if (window.ActiveXObject) { var xhr = new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { var xhr = new XMLHttpRequest(); } if(xhr!=null) { xhr.onreadystatechange = function() { if(xhr.readyState == 4) { treatvar('FORUMURL'); treatvar('FORUMURLINK'); treatvar('FORUMNAME'); treatvar('FORUMNAMELINK'); treatvar('FORUMDESC');treatvar('FORUMBIRTHDAY'); treatvar('FORUMAGE'); treatvar('FORUMCOUNTFORUM'); treatvar('FORUMCOUNTOPIC'); treatvar('FORUMCOUNTPOST');treatvar('FORUMCOUNTUSER');treatvar('FORUMONLINEUSER'); treatvar('FORUMONLINEDATE'); treatvar('FORUMLASTUSER'); treatvar('FORUMLASTUSERLINK'); treatvar('USERNAME'); treatvar('USERLINK'); treatvar('USERBIRTHDAY'); treatvar('USERAGE'); treatvar('USERREGDATE'); treatvar('USERLASTVISIT'); treatvar('USERCOUNTPOST'); } }; xhr.open("GET","/popup_help.forum?l=miscvars", true); xhr.send(null); }
|
-> présenter ses variables dans des class de span.
Nous allons donc avoir un code html qui ressemble à ça :
| Code: | <p>Salut <span class="USERNAME"></span>, nous sommes ravis de te retrouver sur <span class="FORUMNAME"></span>, d'autant plus que ta dernière visite date de <span class="USERLASTVISIT"></span></p> |
>> Si le membre n'est pas connecté ou non inscrit sur le forum, on affichera
| Citation: | Salut et bienvenue sur {nom du forum} ! Si tu n'es pas encore inscrit sur le forum, n'hésite pas à le faire en cliquant [ici] ! Si en revanche, tu es déjà un de nos habitués, identifie toi rapidement en cliquant [là] ! Quoi qu'il en soit, à très vite ! |
Ici, on va donc utiliser de nouveau la variable indiquant le nom du forum, ainsi que 2 liens : un menant vers les inscriptions, un autre vers le module de connexion. Ce qui nous donne :
| Code: | <p>Salut et bienvenue sur <span class="FORUMNAME"></span> !
Si tu n'es pas encore inscrit sur le forum, n'hésite pas à le faire en cliquant [<a href="http://www.school-of-pub.net/profile.forum?mode=register">ici</a>] !
Si en revanche, tu es déjà un de nos habitués, identifie toi rapidement en cliquant [<a href="http://www.school-of-pub.net/login.forum?connexion">là</a>] !
Quoi qu'il en soit, à très vite !</p> |
Différencions les statuts
Pour afficher notre texte suivant le statut de l'Internaute, voici 2 codes à retenir :
>> Pour afficher le texte destiné au membre connecté, on utilisera ceci :
| Code: | <!-- BEGIN switch_user_logged_in -->Le texte<!-- END switch_user_logged_in --> |
>> Pour afficher le texte destiné au membre non connecté ou non inscrit, on utilisera ceci :
| Code: | <!-- BEGIN switch_user_logged_out -->Le texte<!-- END switch_user_logged_out --> |
Du coup, si on rassemble le tout, on aura ça :
* Membre connecté
| Code: | <!-- BEGIN switch_user_logged_in --><p>Salut <span class="USERNAME"></span>, nous sommes ravis de te retrouver sur <span class="FORUMNAME"></span>, d'autant plus que ta dernière visite date de <span class="USERLASTVISIT"></span></p><!-- END switch_user_logged_in --> |
* Membre non connecté ou non inscrit
| Code: | <!-- BEGIN switch_user_logged_out --><p>Salut et bienvenue sur <span class="FORUMNAME"></span> !
Si tu n'es pas encore inscrit sur le forum, n'hésite pas à le faire en cliquant [<a href="http://www.school-of-pub.net/profile.forum?mode=register">ici</a>] !
Si en revanche, tu es déjà un de nos habitués, identifie toi rapidement en cliquant [<a href="http://www.school-of-pub.net/login.forum?connexion">là</a>] !
Quoi qu'il en soit, à très vite !</p><!-- END switch_user_logged_out --> |
Jouons avec les templates
Pour utiliser nos codes, nous allons travailler dans le template suivant index_body
Avant de modifier votre template, n'hésitez pas à l'enregistrer sur votre pc au cas où vous chambouleriez tout 
Tout d'abord, repérons où nous allons placer notre texte. Je pense que le meilleur endroit est sous la barre de nav', avant la chatbox (si elle est en haut du forum), avant le message d'en-tête et avant le forum non ?
Pour cela, repérez ce code :
| Code: | {CHATBOX_TOP} {BOARD_INDEX} |
Et copier coller juste avant le chatbox_top les 2 codes que nous avons précédemment écrit.
| Code: | <script type="text/javascript" src="lien_de_votre_page_html"></script>
<!-- BEGIN switch_user_logged_in --><p>Salut <span class="USERNAME"></span>, nous sommes ravis de te retrouver sur <span class="FORUMNAME"></span>, d'autant plus que ta dernière visite date de <span class="USERLASTVISIT"></span></p><!-- END switch_user_logged_in -->
<!-- BEGIN switch_user_logged_out --><p>Salut et bienvenue sur <span class="FORUMNAME"></span> !
Si tu n'es pas encore inscrit sur le forum, n'hésite pas à le faire en cliquant [<a href="http://www.school-of-pub.net/profile.forum?mode=register">ici</a>] !
Si en revanche, tu es déjà un de nos habitués, identifie toi rapidement en cliquant [<a href="http://www.school-of-pub.net/login.forum?connexion">là</a>] !
Quoi qu'il en soit, à très vite !</p><!-- END switch_user_logged_out -->
{CHATBOX_TOP} {BOARD_INDEX} |
En remplaçant "lien_de_votre_page_html" par le lien de la page html enregistrée plus haut Enregistrer et n'oubliez pas de cliquer sur publier
Et voilà le résultat :
>> Connecté :
>> Non connecté :
Il ne vous reste plus qu'à ajouter un peu de css pour une jolie mise en page, et le tour est joué 
Si vous avez des questions, n'hésitez pas 
[Si vous avez un soucis, n'hésitez pas à venir poser vos questions par ici]
Dernière édition par Miettes le Lun 4 Juil - 10:13, édité 4 fois |
|