Shoutbox dans un volet latéral rétractable  [Réglé] Shoutbox dans un volet latéral rétractable

Rendez vous ici pour toute demande de support du Mod Breizh Shoutbox
Forum rules
This forum is dedicated to the support of Breizh Shoutbox.
The support of this mod is provided only to members group Donors and VIP.
To join the Donors Group, go on this page, see the rules for this operation on this page.
Please read the forum rules before available here.
Share this topic:    Facebook Share this topic on Facebook Twitter Share this topic on Twitter MySpace Share this topic on MySpace Del.icio.us Share this topic on Del.icio.us   

[Réglé] Shoutbox dans un volet latéral rétractable

Postby fr Aswell » 27 Aug 2010, 01:31
» Firefox 3.6.8 Firefox 3.6.8  Windows Seven Windows Seven  Screen Resolution: 1920 x 1200 1920 x 1200

Bonsoir,

En recherchant un mod shoutbox pour mon forum j'ai découvert Breizh Shoutbox que j'ai adopté. L'installation s'est déroulée sans problème et je vous remercie pour votre travail : grâce à lui j'ai maintenant une shoutbox compacte et pleinement fonctionnelle sur mon forum :)
Pour rendre la navigation sur mon forum plus ergonomique, je souhaiterais savoir s'il était possible d'intégrer Breizh Shoutbox dans un volet latéral rétractable qui apparaîtrait sur toutes les pages du forum. Ca permettrait de consulter les sujets postés tout en ayant la shoutbox visible dans le coin en bas à gauche de la page. Je sais que c'est possible sur les forums clés-en-main comme Forumactif en suivant la procédure suivante (j'ai adapté avec la page de la pop-up) :

On insère ce script dans une page HTML...
Code: Select all
jQuery(document).ready(function() { jQuery('body').append('<table style="position: fixed; bottom: 50px; left: 0px;background-color: #ffffff;z-index:10000;"><tr><td><iframe src="http://megamanplanet.free.fr/shout_popup.php" id="chatboxpop" scrolling="no" style="width: 800px; height: 400px; display: none;" marginwidth="0" marginheight="0" frameborder="0"></iframe></td><td style="vertical-align: bottom;"><img src="http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png" onClick="document.getElementById(\'chatboxpop\').style.display=(this.src==\'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png\')?\'block\':\'none\';this.src=(this.src==\'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png\')?\'http://i81.servimg.com/u/f81/11/21/85/73/fermer10.png\':\'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png\';"/></td></tr></table>'); } );


...que l'on doit appeler, pour qu'elle apparaisse sur toutes les pages, grâce à cette ligne placée dans la description du forum :
Code: Select all
<script type=text/javascript src="http://megamanplanet.free.fr/sideshoutbox.html"></script>

Comme sur phpBB la description du forum ne tient pas compte des balises HTML j'ai pensé mettre ce code dans le template overall_header.html mais ça n'a rien fait. Auriez-vous une solution à me proposer pour que Breizh Shoutbox puisse être intégrée dans ce volet latéral ?

Pour avoir un exemple concret du script, comme je ne sais pas si je peux poster des liens de sites extérieurs ici, vous pouvez aller rechercher "chatbox latérale" sur Google, il y est sur le forum qui apparaît en premier dans la liste.

Merci d'avance pour vos réponses.
Last edited by fr Aswell on 27 Aug 2010, 12:03, edited 1 time in total.
Aswell
fr Aswell
Utilisateur
Utilisateur
 
Posts: 4
Joined: 27 Aug 10
Cash on hand: 249.33
Country: fr
PageRank:
PageRank Actuel   PageRank

breizh-portal Sponsor

Publicité

[Réglé] Re: Shoutbox dans un volet latéral rétractable

Postby fr Sylver35 » 27 Aug 2010, 01:47
» Google Chrome 5.0.375. Google Chrome 5.0.375.  Windows Vista Windows Vista  Screen Resolution: 1680 x 1050 1680 x 1050

Bonjour Aswell,

Il est vrai que ce système pourrais être intéressant mais il manque certaines choses dans le code ainsi que dans certaines pages pour y parvenir.

Par contre, pour une aide dans ce sens, ne pas oublier de relire les règles présentes ci-dessus et appliquer...
La vitesse de la lumière étant supérieure à la vitesse du son, bien des gens paraissent brillants jusqu'au moment où ils ouvrent la bouche
Image
Soutenez ce forum pour la continuité et le soutient des mods!

Breizh Shoutbox Ajax 1.5.0 || Breizh Ajax Checks v1.2.0 || mod browser, os & screen v1.0.0 || Mod Erreurs et Notices de débug v1.2.0
User avatar
fr Sylver35
Administrateur
Administrateur
 
First name: Philippe
Posts: 2045
Joined: 24 Aug 08
Location: Bretagne
Cash on hand: 18,157.06
Bank: 21,714.59
Country: fr
PageRank:
PageRank Actuel   PageRank

[Réglé] Re: Shoutbox dans un volet latéral rétractable

Postby fr Aswell » 27 Aug 2010, 01:55
» Firefox 3.6.8 Firefox 3.6.8  Windows Seven Windows Seven  Screen Resolution: 1920 x 1200 1920 x 1200

Bonsoir Sylver35,

Désolé, j'ai effectivement oublié de mentionner l'URL du forum : http://megamanplanet.free.fr
J'ai lu les règles avant de commencer à rédiger et ça m'est sorti de la tête ensuite. J'espère que c'était mon seul oubli ^^
Aswell
fr Aswell
Utilisateur
Utilisateur
 
Posts: 4
Joined: 27 Aug 10
Cash on hand: 249.33
Country: fr
PageRank:
PageRank Actuel   PageRank

[Réglé] Re: Shoutbox dans un volet latéral rétractable

Postby fr Sylver35 » 27 Aug 2010, 04:42
» Google Chrome 5.0.375. Google Chrome 5.0.375.  Windows Vista Windows Vista  Screen Resolution: 1680 x 1050 1680 x 1050

Bien, donc il y a des choses à modifier...
Par contre, je suis allé voir dans le code source de la page du forum que tu a indiqué, c'est Hiroshima!!
Je n'ai jamais vu pareil brouillon et ramassis de code! pas facile de se retrouver dans ce fouillis pour ressortir ce qu'il faut!

Dans un premier temps, n'essayer que dans une seule page pour voir si cela est faisable, sur l'index puisque le code php est présent (hé oui, pour faire venir la shoutbox, le code à insérer dans la page php est indispensable)

Puis, pour faire appel au jQuery, il faudrait bien sûr charger une bibliothèque jQuery avant, celle utilisée est là:
http://illiweb.com/fa/js_20/notutf8-fr.js
Tu l'enregistre dans un fichier nommé "notutf8-fr.js" et tu l'appelle ainsi (exemple):
Code: Select all
<script src="http://http://megamanplanet.free.fr/notutf8-fr.js" type="text/javascript"></script>


Ensuite, quand tu appelle la page: "shout_popup.php", il manque quelque chose, c'est "?t=2"
Donc mettre: "shout_popup.php?t=2" ainsi la shoutbox en popup pourra être appelée

Mais attention, bien voir si le bandeau de rétractation arrive déja, sans quoi, il est impossible de mettre la shoutbox dedans...
Et je pense que le contenu de la page html que tu appelle ne contient pas tout ce qu'il faut!! base toi sur le code donné sur le site que tu a donné précédement.
Essaye cela et redit moi!

Edit: par contre dans la page, j'ai trouvé ce bout de script:
Code: Select all
<script type=text/javascript src=/-h1.htm></script>

et en voici le contenu: http://ewilanrpg.forumactif.com/suggest ... f2/-h1.htm

Et aussi ce script dans <head> qui semble activer le tout:
Code: Select all
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){});
//]]>
</script>


Comme tu voit, la tâche est beaucoup plus ardue que tu ne le pense!
La vitesse de la lumière étant supérieure à la vitesse du son, bien des gens paraissent brillants jusqu'au moment où ils ouvrent la bouche
Image
Soutenez ce forum pour la continuité et le soutient des mods!

Breizh Shoutbox Ajax 1.5.0 || Breizh Ajax Checks v1.2.0 || mod browser, os & screen v1.0.0 || Mod Erreurs et Notices de débug v1.2.0
User avatar
fr Sylver35
Administrateur
Administrateur
 
First name: Philippe
Posts: 2045
Joined: 24 Aug 08
Location: Bretagne
Cash on hand: 18,157.06
Bank: 21,714.59
Country: fr
PageRank:
PageRank Actuel   PageRank

[Réglé] Re: Shoutbox dans un volet latéral rétractable

Postby fr Aswell » 27 Aug 2010, 11:48
» Firefox 3.6.8 Firefox 3.6.8  Windows Seven Windows Seven  Screen Resolution: 1920 x 1200 1920 x 1200

Merci pour ton aide !
J'ai essayé ce que tu m'as dit de faire et ça marche !! Détail de la procédure :

J'ai envoyé la bibliothèque jQuery sur le FTP, puis j'ai rajouté les lignes :
Code: Select all
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){});
//]]>
</script>
<script src="http://megamanplanet.free.fr/notutf8-fr.js" type="text/javascript"></script>

dans le template index_body.html (pour essayer uniquement sur l'index). Ensuite j'ai ajouté en-dessous :
Code: Select all
<script type=text/javascript src="http://megamanplanet.free.fr/sideshoutbox.html></script>


Dans le fichier sideshoutbox.html qui contient le script, j'ai vérifié qu'il était bien identique à celui de la page -h1.htm du forum d'exemple, puis j'ai rajouté "?t=2" à la fin de l'URL de la pop-up. J'obtiens ceci :
Code: Select all
jQuery(document).ready(function() { jQuery('body').append('<table style="position: fixed; bottom: 50px; left: 0px;background-color: #ffffff;z-index:10000;"><tr><td><iframe src="http://megamanplanet.free.fr/shout_popup.php?t=2" id="chatboxpop" scrolling="no" style="width: 800px; height: 400px; display: none;" marginwidth="0" marginheight="0" frameborder="0"></iframe></td><td style="vertical-align: bottom;"><img src="http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png" onClick="document.getElementById(\'chatboxpop\').style.display=(this.src==\'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png\')?\'block\':\'none\';this.src=(this.src==\'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png\')?\'http://i81.servimg.com/u/f81/11/21/85/73/fermer10.png\':\'http://i81.servimg.com/u/f81/11/21/85/73/ouvrir10.png\';"/></td></tr></table>'); } );


J'ai ensuite rajouté les mêmes lignes supplémentaires de index_body.html dans overall_header.html et ça fonctionne sur toutes les pages après rafraîchissement du template et actualisation Ctrl+F5 sous Firefox.

Maintenant il reste encore un petit problème : quand on ouvre la shoutbox latérale, l'image "Ouvrir" ne disparaît pas une fois la shoutbox déroulée. Du coup j'ai les deux boutons "Ouvrir" et "Fermer" simultanément. Connaitrais-tu une solution ?
Au pire ce n'est pas très grave mais bon si jamais y a un truc je suis preneur.
En tout cas merci beaucoup pour ton aide claire et efficace :D !
(J'ai pas mis le sujet en "résolu" encore au cas où tu as une solution pour le problème avec les boutons "Ouvrir" et "Fermer".)

EDIT : en fait c'est parce que j'avais oublié de retirer les lignes de script de index_body.html. Je les ai enlevées et il n'y a plus de problème. Je mets le sujet en "résolu", merci encore pour tout !
Aswell
fr Aswell
Utilisateur
Utilisateur
 
Posts: 4
Joined: 27 Aug 10
Cash on hand: 249.33
Country: fr
PageRank:
PageRank Actuel   PageRank

[Réglé] Re: Shoutbox dans un volet latéral rétractable

Postby fr Sylver35 » 27 Aug 2010, 21:23
» Google Chrome 5.0.375. Google Chrome 5.0.375.  Windows Vista Windows Vista  Screen Resolution: 1680 x 1050 1680 x 1050

Je revient sur ce sujet car j'ai réussi à faire quelque chose de bien plus simple...

Pour commencer, tout ceci n'est absolument pas valide xhtml et surcharge le forum pour rien!!!

Pour bien faire les choses, il faut supprimer toutes les modifications précédentes et supprimer tous les fichiers ajoutés.

Afin de montrer le rendu, je l'ai mis en application ici...

Ouvrir le fichier overall_header.html
Rechercher:
Code: Select all
<body id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">


et ajouter après dans une nouvelle ligne:
Code: Select all
<!-- IF not S_IS_BOT -->
<div style="position: fixed;bottom: 50px;left: 0px;background-color: transparent;z-index:10000;">
        <ul class="linklist rightside" style="margin-top: 0px;">
                <a href="javascript:;" onClick="document.getElementById('box').style.display='block';document.getElementById('dtbox2').style.display='block';document.getElementById('dtbox1').style.display='none';" title="{L_SHOUT_POP}">
                <li class="rightside" style="display: block;margin-left: 0px;" id="dtbox1">
                        <img src="{T_IMAGES_PATH}shoutbox/ouvrir.png" alt="{L_SHOUT_POP}" title="{L_SHOUT_POP}" />
                </li>
                </a>
                <li class="rightside" style="display: none;margin-left: 0px;padding-top: 400px;" id="dtbox2">
                        <a href="javascript:;" onClick="document.getElementById('box').style.display='none';document.getElementById('dtbox2').style.display='none';document.getElementById('dtbox1').style.display='block';"><img src="{T_IMAGES_PATH}shoutbox/fermer.png" alt="{L_CLOSE_WINDOW}" title="{L_CLOSE_WINDOW}" /></a>
                </li>
                <li class="rightside" style="margin-left: 0;valign: bottom;">
                        <iframe src="./shout_popup.php?t=2" id="box" style="width: 800px;height: 500px;display: none;background: transparent;background-attachment: none;background-clip: none;border: 0 none;" frameborder="0px" scrolling="no"/></iframe>
                </li>
        </ul>
</div>
<!-- ENDIF -->


Attention, la balise "code" fait perdre une instruction!!!
Dans ce code, répérez la source de l'iframe:
<iframe src="./shout_popup.php?t=2"
le lien commence par "./' or il faut remplacer par "{"ROOT_PATH"}" en enlevant les guillemets
Ceci est un bug de phpbb3!!

Ensuite, enregistrer les deux images suivantes dans le dossier images/shoutbox/
Image Image

Et voilà, c'est tout!!
Pas de code ou de fichier supplémentaire, ceci suffit!!!

Ne pas oublier de rafraichir les templates du style...
La vitesse de la lumière étant supérieure à la vitesse du son, bien des gens paraissent brillants jusqu'au moment où ils ouvrent la bouche
Image
Soutenez ce forum pour la continuité et le soutient des mods!

Breizh Shoutbox Ajax 1.5.0 || Breizh Ajax Checks v1.2.0 || mod browser, os & screen v1.0.0 || Mod Erreurs et Notices de débug v1.2.0
User avatar
fr Sylver35
Administrateur
Administrateur
 
First name: Philippe
Posts: 2045
Joined: 24 Aug 08
Location: Bretagne
Cash on hand: 18,157.06
Bank: 21,714.59
Country: fr
PageRank:
PageRank Actuel   PageRank

[Réglé] Re: Shoutbox dans un volet latéral rétractable

Postby fr Aswell » 27 Aug 2010, 23:44
» Firefox 3.6.8 Firefox 3.6.8  Windows Seven Windows Seven  Screen Resolution: 1920 x 1200 1920 x 1200

Ta nouvelle solution est bien plus simple ! J'ai effectué les changements et ça marche très bien, ça paraît même un peu plus rapide. Merci pour les images, je te les emprunte pendant quelques temps même si je risque de les remplacer quand le design sera installé ^^
Je trouve que le volet latéral rend bien aussi ici  :)

Merci beaucoup, encore une fois !
Aswell
fr Aswell
Utilisateur
Utilisateur
 
Posts: 4
Joined: 27 Aug 10
Cash on hand: 249.33
Country: fr
PageRank:
PageRank Actuel   PageRank



 

  • Related topics
    Replies
    Views
    Last post

Return to Support pour Breizh Shoutbox

Who is online

Users browsing this forum: No registered users and 0 guests

Login  •  Register


| Valid XHTML 1.0 Strict || breizh hosting || Made with Notepad++ || Contact || Wot || Term of use || Privacy policy || Rules |