Aggiungi una chat al tuo sito web.

Aggiungi la riga tra i tuoi tag <head> e </head>.

Implementa il modulo.

La formula contiene 3 campi, di cui il campo « Nome d'utente » è obbligatorio. Il campo « Password » è facoltativo e il campo « Sala » può essere nascosto. È possibile modificare tutti gli attributi di questi campi, ad eccezione dell'attributo « id ». Il pulsante o il link di connessione è obbligatorio e include la classe «tchat-connect». È possibile modificare anche gli altri attributi.

Campo nome utente“

Campo stanza

o in hidden

Campo lingua

Especifica el idioma en el que encontrarás la aplicación de chat.
Valores posibles (indica el valor entre comillas) :

"fr" (Francese)
"en" (Inglese)
"it" (italiano)
"de" (Tedesco)
"es" (Spagnolo)
"sv" (Svedese)
"no" (Norvegese)

Pulsante di accesso alla chat

Le boutton connection permet d'ouvrir la fenetre de tchat.Le boutton doit comporter la classe css 'tchat-connect' (class='tchat-connect'')

<button class="tchat-connect" type="button" name="tchat-connect" id="tchat-connect"> Connection au chat </button>

Esempio di integrazione

esempio 1

Nickname:
Password:
Sala chat:

<div class="form">
    <label>Pseudo:</label>
    <input type="text" name="pseudo" id="tchat-pseudo" />
    <br />
    <label>Mot de passe:</label>
    <input type="text" name="pseudo" id="tchat-password" />
    <br />
    <label>Salon:</label>
    <input type="text" name="pseudo" id="tchat-rooms" value="#cafe" />
    <br /><br />
    <div  class="justify-end"> 
        <br />
        <input type="hidden" id="tchat-lang" value="it" />
        <button class="tchat-connect">Se connecter au tchat</button>
    </div>    
    <br />    
</div>

aucun css

esempio 2

Nickname :

<div class="form-round">
    <label>Pseudo:</label>
    <input class="maxsize" type="text" name="pseudo" id="tchat-pseudo" />                                                                        
    <input type="hidden" name="rooms" id="tchat-rooms" value="#cafe" />
    <input type="hidden" id="tchat-lang" value="<?=$locale?>" />
    <br /><br />
    <button class="tchat-connect">Se connecter au tchat</button>
    <br />                               
</div>

maxsize {
    width:100%;
}
div.form-round {
    background-color: #030bfc;
    border-radius: 50px;
    color: white;
    padding: 1rem;
    text-align: center;
)

esempio 3

Nickname :

Sala chat :

<div class="maxsize form-round">
    <div>
        <label>Pseudo :</label>
        <br />
        <input class="col-12" type="text name="pseudo" id="tchat-pseudo" />                                                                
    </div>    
    <div>
        <label>Salons :</label>
        <br />
        <input class="col-12" type="text name="rooms" id="tchat-rooms" value="#cafe"/>                                
    </div>
    <br />
    <div  class="justify-end">                            
        <input type="hidden" id="tchat-lang" value="<?=$locale?>" />
        <button type="button" class="tchat-connect">Se connecter au tchat</button>                            
    </div>    
</div>

maxize {
    width:100%;
}
div.form-round {
    background-color: #030bfc;
    border-radius: 50px;
    color: white;
    padding: 1rem;
    text-align: center;
)

esempio 4

Nickname :

Password :

<div class="maxsize form">
<div>
    <label>Pseudo :</label>
    <br />
    <input class="col-12" type="text" name="pseudo" id="tchat-pseudo" />                                                                
</div>    
<div>
    <label>Mot de passe :</label>
    <br />
    <input class="col-12" type="text" name="password" id="tchat-password" />                                
</div>
<br />
<div  class="justify-end">                                        
    <input type="hidden" name="rooms" id="tchat-rooms" value="#cafe" />
    <input type="hidden" id="tchat-lang" value="<?=$locale?>" />
    <button type="button" class="tchat-connect">Se connecter au tchat</button>                            
</div>    
</div>

maxize {
    width:100%;
}