Fonctionnement de la ChatBox

2 participants

Forum gratuit : Le forum des forums actifs :: Vous et Forumactif... :: ressources pour utilisateurs forumactif :: Questions/Réponses fréquentes

Voir le sujet précédent Voir le sujet suivant Aller en bas

  • 0

Tutoriel Fonctionnement de la ChatBox

Message par Shadow Jeu 11 Juin 2015 - 10:49

Fonctionnement de la ChatBox
Forumactif propose par défaut une ChatBox à mettre en place sur votre forum. Cette Chatbox n'est visible que par les membres. La ChatBox a été développée dans le but de donner la possibilité à une communauté de communiquer rapidement et simplement que par le biais de messages postés sur le forum. Vous avez également la possibilité de créer des salons en fonction de l'activation des packages Fonctionnement de la ChatBox 3685216789 ou Fonctionnement de la ChatBox 2398224970 .

Installation de la ChatBox

Activer la ChatBox

Panneau d'administration  Modules  ChatBox - Configuration
Fonctionnement de la ChatBox 07-02-11

Activer la ChatBox : Cliquez sur "Oui" ainsi que sur le bouton "Valider" pour sauvegarder vos modifications.

Afficher la ChatBox

Une fois la ChatBox activée, il convient de faire un choix sur son emplacement sur votre forum.

Panneau d'administration  Modules  ChatBox - Configuration
Fonctionnement de la ChatBox 07-02-10

Trois possibilités s'offrent à vous :

  • Ne pas afficher : la ChatBox ne sera pas affichée sur votre forum. Toutefois, vos membres auront la possibilité de la rejoindre via votre Qui est en ligne ?
    Voir illustration :
    En cliquant sur "Rejoindre la ChatBox", une nouvelle fenêtre souffrira dans votre navigateur afin de pouvoir y accéder.

  • Sur la page d'accueil en haut : La ChatBox sera affichée en haut de votre page d'accueil, après le message d'accueil de votre forum. Vos membres pourront également accéder à la ChatBox depuis le Qui est en Ligne ?

  • Sur la page d'accueil en bas : La ChatBox sera affichée en bas de votre page d'accueil, après votre Qui est en ligne ? Vos membres pourront également accéder à la ChatBox depuis le Qui est en Ligne ?


Pour les deux derniers choix, votre ChatBox s'affichera de la manière suivante (l'affichage peut légèrement différer d'une version à une autre) :
Voir illustration :
N'oubliez pas de cliquer sur le bouton "Valider" pour sauvegarder vos modifications.

Paramétrage de la ChatBox

Panneau d'administration  Modules  ChatBox - Configuration

  • Afficher les avatars des utilisateurs dans la ChatBox : vous permet de choisir si oui ou non les avatars seront affichés dans les conversations.
    Voir illustration :
  • Afficher les images dans la Chatbox : vous permet de choisir si oui ou non les images publiées par vos membres d'afficheront directement dans la Chatbox.
    Voir illustration :
  • Autoriser la suppression d'un message dans la Chatbox : vous permet de choisir si oui ou non les membres de votre forums peuvent supprimer des messages dans la ChatBox. Deux niveaux d'autorisation possibles : Auteur & Modérateurs (de la ChatBox, c'est-à-dire les membres ayant un @ à côté de leur pseudo dans la liste des connectés) ou seulement Modérateurs.

    Pour supprimer un message, il vous suffit de placer le curseur de votre souris à côté de la date et de l'heure de publication d'un message afin de faire apparaître ce symbole [X] vous permettant de supprimer ledit message :
    Voir illustration :
  • Afficher les messages du système (connexion, ...) : vous permet de supprimer les messages du "système" de la ChatBox, plus exactement les phrases qui annoncent la connexion / déconnexion des membres ;

  • Nombre de messages archivés : vous permet de choisir le nombre de messages archivés dans l'onglet "Archives" de votre ChatBox. Cette valeur doit être comprise entre 400 et 2000.

Créer des salons au sein de la ChatBox

Forumactif vous offre la possibilité de structurer la ChatBox en différents salons où les membres interagissent les uns avec les autres. Ces salons peuvent être publics (ouverts à tous) ou privés (ouverts à un nombre restreint de membres ou de groupes).

L'utilisation des salons requiert l'achat d'un package Fonctionnement de la ChatBox 3685216789 (possibilité de créer jusqu'à 4 salons) ou Fonctionnement de la ChatBox 2398224970 (possibilité de créer jusqu'à 8 salons).
Panneau d'administration  Modules  ChatBox - Salons de la ChatBox

Créer un salon

  1. Cliquez sur le bouton "Ajouter" :
    Voir illustration :
  2. Compléter les différents champs proposés :

    • Nom du salon [obligatoire] : Choisir le nom du salon (privilégiez des noms cours comme "Discussions générales" ; "Modération" ; "Administration" ...) ;
    • Description du salon : Indiquer une description du salon pour les membres qui seront autorisés à voir ledit salon ;
    • Couleur [obligatoire]: Indiquer la couleur du salon afin de donner une meilleure visibilité. Une palette vous permet de sélectionner la couleur de votre choix. Si vous connaissez exactement la couleur, vous avez la possibilité d'indiquer les paramètres RGB (Red, Green, Blue) , HSL (Hue, Saturation, Luminosity) ou HEX (HEXadécimal #XXXXXX) :
      Voir illustration :
    • Qui a la permission de voir et participer à ce salon ? [obligatoire] : Choisir qui peut voir ce salon. Vous pouvez choisir "Tout le monde" ou bien sélectionner un (ou plusieurs) groupe(s) qui aura (auront) accès à ce salon. A noter que les administrateurs ont accès automatiquement à tous les salons sans aucune restriction.
      Voir illustration :

N'oubliez pas de cliquer sur le bouton :enreg: pour sauvegarder vos modifications.

Gérer les salons

Vous avez la possibilité de modifier les paramètres relatifs à chacun des salons créés. Ainsi, vous pouvez :

  1. Modifier l'ordre d'affichage des salons sur la Chatbox : il vous suffit de cliquer sur les différentes flèches :down: ou :up: pour gérer l'ordre desdits salons de votre ChatBox ;

  2. D'éditer les paramètres d'un salon : pour éditer les paramètres d'un salon, il vous suffit de cliquer sur le roue crantée edit associée au salon concerné ;

  3. De supprimer un salon : pour supprimer un salon, il vous suffit de cliquer sur la croix suppr associée au salon concerné. Attention, la suppression est immédiate après avoir cliqué sur la croix !

Voir illustration :

Affichage des salons sur la ChatBox


Lorsque les salons de la ChatBox sont utilisés, l'affichage de la ChatBox est modifiée auprès de vos membres :

Fonctionnement de la ChatBox 19-12-19

Comme vous pouvez le constaté, deux onglets font leur apparition :

  1. Cet onglet permet de consulter la liste des membres connectés sur la ChatBox ;

  2. Cet onglet permet de consulter les différents salons disponibles :

    • Le symbole # indique que le salon est public alors que le symbole cadenas indique que le salon est privé. Seulement les membres ayant les accès (autorisations) peuvent le voir ;
    • Le symbole ainsi que le nom des salons sont colorisés en fonction des paramètres déterminés lors de la création ;
    • La description du salon s'affiche en-dessous du nom du salon (si description renseignée).
    • Lorsqu'un membre est connecté sur la ChatBox, un indicateur visuel montre si des messages ont été postés depuis sa dernière visite sur le salon concerné. Autrement dit, cet indicateur visuel indique seulement les nouveaux messages pendant votre connexion à la ChatBox. Dans le cas d'une déconnexion / reconnexion, les indicateurs sont réinitialisés.
      Voir illustration :

Nommer des modérateurs

Panneau d'administration  Modules  ChatBox - Modérateurs
Voir illustration:

Afin de gérer convenable les conversations qui se déroulent sur la ChatBox, vous pouvez nommer des modérateurs. Ils auront la possibilité de bannir/débannir, de supprimer la conversation en cours, de kicker (éjecter) les fauteurs de troubles.

Il suffit de rentrer le pseudo de la personne que vous souhaitez nommer et de valider. Si vous souhaitez supprimer un modérateur, il suffira de cochez en face du pseudo concerné, dans la colonne "supprimer" et de valider votre action.

Un administrateur connecté sur la ChatBox peut nommer des modérateurs sans avoir besoin de se rendre sur le Panneau d'administration. La commande /mod [pseudo] permet de nommer un modérateur et son contraire est /unmod [pseudo] . Ce modérateur aura un @ à côté de son pseudo afin de montrer aux membres qu'il dispose des pouvoirs de modération. Seul un administrateur peut nommer un modérateur. Ce n'est pas parce que les administrateurs et les modérateurs sur une ChatBox ont tous un @ que les droits sont les mêmes.

Gestion des membres bannis

Panneau d'administration  Modules  ChatBox - Utilisateurs bannis
Voir illustration:

Sur cette page, un administrateur pourra décider de sélectionner des utilisateurs bannis en vue de les autoriser à nouveau à accéder à la ChatBox (débannir). Un utilisateur banni ne peut se connecter à la ChatBox et voit le message suivant : "Vous avez été banni de la ChatBox".

Une autre voie existe pour connaitre la liste des utilisateurs bannis : si un modérateur de la ChatBox y est connecté, il peut la consulter en tapant la commande /banlist dans le champ de texte et une pop-up s'ouvrira avec les pseudos des personnes bannies de la ChatBox. Il pourra éventuellement les débannir.

Listes des commandes disponibles sur la ChatBox

Commandes accessibles à tous les membres
/absPermet d'envoyer un message disant que vous êtes absent. Vous pouvez ajouter une raison qui sera affichée dans le message et visible par tous les membres connectés à la ChatBox (Ex: /abs raison). Notez que la commande /away permet de faire la même chose.
/mePlacé en début de phrase, cette commande sera remplacée par votre pseudo (Ex : /me aime Forumactif affichera "Pseudo aime Forumactif").
/exitPermet de vous déconnecter de la ChatBox. Vous pouvez également préciser la raison pour laquelle vous quittez la ChatBox. Cette dernière sera visible par les autres membres connectés. Par exemple, /exit raison).
/rollPermet de lancer de 1 à 9 dés ayant de 4, 6, 8, 10, 12, 20 ou 100 faces avec un bonus (+) ou malus (-). Par exemple, /roll 3d6+4 va lancer 3 dés à 6 faces avec un bonus de 4).
/helpPermet d'afficher un récapitulatif des commandes de la ChatBox avec leurs explications.
Commandes accessibles aux modérateurs et administrateurs
/clear Permet d'effacer les messages de la ChatBox. Notez que la commande /cls permet de faire la même chose.
/kickPermet de déconnecter un membre de la ChatBox. La commande doit-être suivie du pseudo de l'utilisateur à déconnecter (Ex : /kick pseudo). Le fait de déconnecter quelqu'un, ne l'empêchera pas de se reconnecter.
/banPermet de bannir un membre de la ChatBox. Cette commande doit être suivie du nom de l'utilisateur à bannir (Ex : /ban pseudo). Une fois l'utilisateur banni, il ne verra et n'aura plus accès à la ChatBox.
/unbanPermet de débannir un membre de la ChatBox. Cette commande doit être suivie du nom de l'utilisateur à débannir (Ex : /unban pseudo). Dès lors, il aura de nouveau accès à la ChatBox.
/banlistPermet d'afficher la liste des utilisateurs bannis de la ChatBox (pour éventuellement les débannir)
Commandes accessibles aux administrateurs
/modPermet de nommer un modérateur sur la ChatBox. La commande est suivie du pseudo de l'utilisateur qui recevra les droits de modération (Ex : /mod pseudo). Un message s'affichera sur le ChatBox pour informer que l'utilisateur a reçu les droits de modération et un @ s'affichera a côté de son pseudo dans les liste des membres connectés.
/unmodPermet de retirer un modérateur sur la ChatBox. La commande est suivie du pseudo de l'utilisateur qui se verra retirer les droits de modération (Ex : /unmod pseudo). Un message s'affichera sur le ChatBox pour informer que l'utilisateur n'a plus les droits de modération et le @ sera retiré son pseudo dans les liste des membres connectés.

Sujets liés

     Personnalisation esthétique de la ChatBox
    Une liste non exhaustive de codes CSS qui vous permettront de modifier l'apparence de la ChatBox. Les codes qui vous intéressent sont à copier/coller dans la feuille de style CSS de votre forum.

     Personnalisation de la ChatBox
    Nous vous proposons un certain nombre de codes afin de personnaliser l'affichage ainsi que le fonctionnement de la ChatBox. Ces codes concernent les ChatBox incluses dans des pages, soit sur le portail et l'index via les options du panneau d'administration, soit insérées dans des pages du forum via un script ou un code HTML.

     Intégrer la ChatBox à la ToolBar de votre forum
    Cette astuce vous explique comment ajouter la ChatBox de votre forum sur toutes les pages de celui-ci, via la ToolBar, et ajoute quelques améliorations telles qu'une notification visuelle et sonore lorsqu'un message est posté sur la ChatBox. La ToolBar indique, en outre, le nombre de connectés sur la ChatBox.

Ce tutoriel a été rédigé par le Staff du Forum des Forums,
Et en particulier par Pinguino, actualisé par Bipo (août 2023).

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Shadow

Shadow
Modéractive
Modéractive

Féminin
Messages : 24354
Inscrit(e) le : 30/03/2007

Shadow a été remercié(e) par l'auteur de ce sujet.
  • 0

Tutoriel Personnalisation de la chatbox

Message par MlleAlys Jeu 11 Juin 2015 - 19:36

Personnalisation de la Chatbox


Personnaliser la Chatbox

Pour compléter ce tutoriel, voici des codes CSS qui vous permettront de modifier l'apparence de la ChatBox. Les codes qui vous intéressent sont à copier/coller dans la feuille de style css de votre forum :

Panneau d'administration  Affichage  Couleurs - Feuille de style CSS

► Modifier les couleurs de fond
► Modifier les couleurs des textes
► Autres modifications (avatars, boutons, lignes, hauteur,...)


Modification des couleurs de fond de la ChatBox

Voilà un exemple de Chatbox avec les couleurs de fond modifiées, pour vous aider à vous repérer dans les codes plus bas Wink :
Fonctionnement de la ChatBox Dxg9

Pour chaque code, il vous faudra remplacer COULEUR par le code de la couleur souhaitée.


Modifier le fond de l'en-tête de la Chatbox (en bleu sur l'exemple)

Code:
#chatbox_header, td.catBottom, #chatbox_header.main-head {
  background: COULEUR;
}

Modifier le fond de la partie liste des membres (en vert sur l'exemple)

Code:
#chatbox_members {
  background: COULEUR;
}

Modifier le fond des titres dans la partie liste des membres (en rouge sur l'exemple)

Code:
#chatbox_members .member-title {
  background: COULEUR;
}

Modifier le fond de la partie chat (en violet sur l'exemple)

Code:
#chatbox {
  background: COULEUR;
}

Modifier la couleur de fond des lignes impaires de discussion dans la partie chat (en orange sur l'exemple)

Code:
.chatbox_row_1 {
  background: COULEUR;
}

Modifier la couleur de fond des lignes paires de discussion dans la partie chat (en turquoise sur l'exemple)

Code:
.chatbox_row_2 {
  background: COULEUR;
}

Modifier la couleur de fond de la barre des boutons (en rose sur l'exemple)

Code:
#chatbox_messenger .catBottom, body.chatbox, #chatbox_footer {
  background: COULEUR;
}

Modifier le fond de la zone de saisie du message (en gris clair sur l'exemple)

Code:
#chatbox_footer #message {
  background: COULEUR;
}


Modification des couleurs des textes de la ChatBox


Modifier la couleur du titre de la ChatBox

Code:
.chatbox a.cattitle, .chatbox-title, .chatbox-title a.chat-title {
  color: COULEUR !important;
}

Le !important est à laisser juste après le code couleur.

Modifier la couleur des liens et options en haut à droite de la ChatBox

Code:
.chatbox-options a, .chatbox-options li, .chatbox-options li a, .chatbox-options li label {
  color: COULEUR;
}

Modifier la couleur des titres dans la partie liste des membres ("en ligne", "absent")

Code:
#chatbox_members .member-title {
  color: COULEUR;
}

Modifier la couleur des messages verts lors de la connexion d'un membre

Code:
.msg span[style="color:green"] strong {
  color: COULEUR;
}

Modifier la couleur des messages rouges lors de la déconnexion d'un membre

Code:
.msg span[style="color:red"] strong {
  color: COULEUR;
}

Modifier la couleur des messages en "/me"

Code:
.msg span[style="color:undefined"] {
  color: COULEUR;
}

Modifier la couleur de l'heure des messages

Code:
.date-and-time {
  color: COULEUR;
}


Autres modifications


Ne pas afficher l'heure et la date des messages

Code:
.date-and-time {
  display: none;
}

Modifier la couleur de la bordure entre les messages (quand l'affichage des avatars est activé)

Code:
#chatbox > p {
  border-color: COULEUR !important;
}

Supprimer la bordure entre les messages (quand l'affichage des avatars est activé)

Code:
#chatbox > p {
  border: none !important;
}

phpBB3 : Supprimer l'espace entre les messages

Code:
#chatbox > p {
  margin: 0;
}

Modifier la taille des avatars dans la ChatBox

Code:
#chatbox .cb-avatar {
  width: auto !important;
  height: auto !important;
}
#chatbox .cb-avatar > img {
  width: auto !important;
  height: auto !important;
  max-width: 50px;  /*largeur maximale des avatars dans la cb*/
  max-height: 50px;  /*hauteur maximale des avatars dans la cb*/
}

Modifiez les valeurs de la hauteur maximale et de la largeur maximale (ici 50px pour les deux) à votre préférence.
Ce code qui passe par des dimensions maximales sans en imposer une précise permet également d'éviter la déformation des images. Wink

Supprimer la couleur de fond sous les avatars

Code:
#chatbox .cb-avatar {
  background: none !important;
}

Modifier les boutons de mise en forme de la ChatBox

Le code suivant permet la modification de la couleur de fond des boutons, du texte des boutons, et de la bordure des boutons :

Code:
#chatbox_footer #divcolor, #chatbox_footer #divsmilies, #chatbox_footer #help-button, #chatbox_footer #submit_button, #chatbox_footer .format-message + label {
  background: COULEUR !important;
  color: COULEUR !important;
  border: 1px solid COULEUR;
}

Remplacez les COULEUR par le code de la couleur de votre choix.
Les !important sont à laisser juste après les codes des couleurs.

Vous pouvez le modifier et/ou compléter ce code à votre guise, en ajoutant par exemple
border-radius: 50%;
pour avoir des boutons ronds, ce qui donnerait le code suivant :

Code:
#chatbox_footer #divcolor, #chatbox_footer #divsmilies, #chatbox_footer #help-button, #chatbox_footer #submit_button, #chatbox_footer .format-message + label {
  background: COULEUR !important;
  color: COULEUR !important;
  border: 1px solid COULEUR;
  border-radius: 50%;
}

Modifier la largeur de la colonne de la liste des membres

Code:
#chatbox_members {
  width: 100px;  /*largeur de la colonne de la liste des membres connectés à la cb*/
}
#chatbox {
  left: 101px;  /*même largeur que la colonne + 1px */
}

Modifiez les valeurs (ici 100px et 101px) à votre préférence.

Modifier la hauteur de la chatbox sur l'index

Code:
#chatbox_top, #chatbox_bottom {
  height: 500px !important;
}

Modifiez la valeur (ici 500px) par la hauteur souhaitée.
Le !important doit être laissé juste après la valeur.


Tutoriels relatifs :
- Dix codes pour la Chatbox
- Le CSS, comment ça marche ?
- Plus de tutoriels sur la Chatbox ?


Ce tutoriel a été rédigé par le Staff du Forum des Forums.
Et en particulier par MlleAlys, mis à jour par Walt le 29 nov. 2016

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
MlleAlys

MlleAlys
Membre actif

Messages : 5981
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

Forum gratuit : Le forum des forums actifs :: Vous et Forumactif... :: ressources pour utilisateurs forumactif :: Questions/Réponses fréquentes

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum