Centre d'aide

Explorer notre base de connaissance
article

Créer un bouton fixe

Le bouton fixe est un bouton qui se positionne dans le contenu même de votre page. Il est intégré dans le corps et ne suit donc pas la navigation du visiteur comme pourrait le faire le bouton flottant.

1/ Bouton fixe d'appel Click to Chat gérant l'état disponible
2/ Bouton fixe d'appel Click to Call gérant l'état disponible
3/ Bouton fixe d'appel Click to Chat + Click to Call gérant l'état disponible
4/ Bouton fixe d'appel Click to Chat gérant l'état disponible et indisponible
5/ Bouton d'appel Click to Call gérant l'état disponible et indisponible
6/ Bouton fixe d'appel Click to Chat et Click to Call gérant l'état disponible et indisponible
7/ Plusieurs boutons fixes d'appel Click to Call sur une même page gérant les états disponible et indisponible
8/ Bouton fixe d'appel Click to Chat gérant 3 états (disponible, indisponible ou occupé ) et s'affichant uniquement si une règle de ciblage se déclenche. 

N.B:  Si vous avez toujours le code iAdvizeCallbacks sur votre site. Il faut le supprimer.

Pour créer un bouton fixe, depuis l'Administration iAdvize, rendez-vous dans l'onglet Engagement (1), puis Notification (2), et cliquez sur le bouton bouton-add.png (3)

Boutons_d_appels_-_iAdvize.jpg

Donnez ensuite un nom à votre bouton fixe (1), pour le retrouver ensuite dans la liste des boutons et lorsque vous l'associerez à une règle de ciblage, choisissez le canal (chat, call ou vidéo) que vous souhaitez associer à ce bouton (2) et indiquez enfin les 3 id de div HTML correspondant aux 3 états de votre bouton (3). 

Nous vous recommandons, par défaut, d'utiliser des ID CSS (# pour les ID) ou CLASS CSS (. pour les CLASS) définis par exemple ci-dessous :

  • état En Ligne : #idzfonline, .idzfonline
  • état Hors Ligne : #idzfoffline, .idzfoffline
  • état Occupé : #idzfbusy, .idzfbusy

Ce champ étant sensible à la casse, cette valeur doit être identique à celle mise en place sur le code HTML du bouton fixe (#idzfonline et #idzFonline seront donc considérés comme différents).  

Vous pouvez, enfin, sauvegarder votre nouveau bouton fixe (4).

Boutons_d_appels_-_iAdvize-1.jpg

 

Une fois le bouton fixe créé, celui-ci doit être associé à une règle de ciblage pour apparaître sur votre site. 

Rendez-vous donc dans l'onglet Engagement (1), Ciblage (2) et cliquez sur le bouton bouton-add.png pour créer une nouvelle règle de ciblage (3).

Nommez votre règle (4), sélectionnez les critères de ciblage que vous souhaitez utiliser (5) et dans la liste des actions disponibles, choisissez d'afficher un bouton fixe (6). Vous pouvez ensuite choisir votre bouton dans la liste et sauvegarder votre règle (7).

Re_gles_de_ciblage_-_iAdvize.jpg

Pour plus de renseignement, veuillez consulter l'article sur la création d'une règle de ciblage


Voici différentes implémentations de bouton fixe avec Callback selon vos besoins. Servez-vous !
 

 

1/ Bouton fixe Click to Chat gérant l'état disponible

Pour l'installation d'un bouton fixe d'appel Click to Chat (affiché uniquement si un conseiller est disponible), il suffit d'insérer le code HTML suivant à l'endroit où le bouton doit apparaitre :

<!-- START IADVIZE HTML CHAT CALLBACK -->
<div class="idz_btn_fix">
<div id="idzfonline" style="display: none;"><a href="javascript:void(0)">ONLINE CHAT BUTTON</a></div>
</div>
<!-- END IADVIZE HTML CHAT CALLBACK -->

Vous devez renseigner les valeurs :
- ONLINE CHAT BUTTON : code HTML indiquant que vous êtes disponible

  

2/ Bouton fixe Click to Call gérant l'état disponible

Pour l'installation d'un bouton fixe d'appel Click to Call (uniquement lorsqu'un conseiller est disponible), il suffit d'insérer le code HTML suivant à l'endroit où le bouton doit apparaitre :

<!-- START IADVIZE HTML CALL BUTTON -->
<div class="idz_btn_fix_call">
<div id="idzfcallonline" style="display: none;"><a href="javascript:void(0);">ONLINE CALL BUTTON</a></div>
</div>
<!-- END IADVIZE HTML CALL BUTTON -->

 Vous devez renseigner les valeurs :
- ONLINE CALL BUTTON : code HTML indiquant que vous êtes disponible

 

3/ Bouton fixe Click to Chat + Click to Call gérant l'état disponible

Pour l'installation d'un bouton fixe d'appel Click to Chat et Click to Call (affiché uniquement lorsqu'un conseiller est disponible), il suffit d'insérer le code HTML suivant à l'endroit où le bouton doit apparaitre :

<div class="idz_btn_fix_all">
<!-- START IADVIZE HTML CHAT CALLBACK -->
<div id="idzfonline" style="display: none;"><a href="javascript:void(0)">ONLINE CHAT BUTTON</a></div>
<!-- END IADVIZE HTML CHAT CALLBACK -->
<!-- START IADVIZE HTML CALL BUTTON -->
<div id="idzfcallonline" style="display: none;"><a href="javascript:void(0);">ONLINE CALL BUTTON</a></div>
<!-- END IADVIZE HTML CALL BUTTON -->
</div>

 Vous devez renseigner les valeurs :
- ONLINE CHAT BUTTON: code HTML indiquant que vous êtes disponible sur le canal chat
- ONLINE CALL BUTTON: code HTML indiquant que vous êtes disponible sur le canal call

 

4/ Bouton fixe Click to Chat gérant l'état disponible et indisponible

Pour l'installation d'un bouton fixe d'appel Click to Chat (affiché quand les conseillers sont disponibles ou indisponibles), il suffit d'insérer le code HTML suivant à l'endroit où le bouton doit apparaitre :

<!-- START IADVIZE HTML CALLBACK -->
<div class="idz_btn_fix">
<div id="idzfonline" style="display: none;"><a href="javascript:void(0)">ONLINE CHAT BUTTON</a></div>
<div id="idzfoffline" style="display: none;"><a href="javascript:void(0)">OFFLINE CHAT BUTTON</a></div>
</div>
<!-- END IADVIZE HTML CALLBACK -->

Vous devez renseigner les valeurs :
- ONLINE CHAT BUTTON: code HTML indiquant que vous êtes disponible
- OFFLINE CHAT BUTTON: code HTML indiquant que vous êtes indisponible

 

5/ Bouton fixe Click to Call gérant l'état disponible et indisponible

Pour l'installation d'un bouton d'appel Click to Call gérant l'état disponible et indisponible, il suffit d'insérer le code HTML suivant à l'endroit où le bouton doit apparaitre :

<!-- START IADVIZE HTML CALL BUTTON -->
<div class="idz_btn_fix_call">
<div id="idzfcallonline" style="display: none;"><a href="javascript:void(0);">ONLINE CALL BUTTON</a></div>
<div id="idzfcalloffline" style="display: none;"><a href="javascript:void(0);">OFFLINE CALL BUTTON</a></div>
</div>
<!-- END IADVIZE HTML CALL BUTTON -->

Vous devez renseigner les valeurs :
- ONLINE CALL BUTTON: code HTML indiquant que vous êtes disponible
- OFFLINE CALL BUTTON: code HTML indiquant que vous êtes indisponible

 

6/ Bouton fixe d'appel Click to Chat et Click to Call gérant l'état disponible et indisponible

Pour l'installation d'un bouton fixe d'appel Click to Chat et Click to Call gérant l'état disponible et indisponible, il suffit d'insérer le code HTML suivant à l'endroit où le bouton doit apparaitre :

<div class="idz_btn_fix_all">
<!-- START IADVIZE HTML CHAT CALLBACK -->
<div id="idzfonline" style="display: none;"><a href="javascript:void(0)">ONLINE CHAT BUTTON</a></div>
<div id="idzfoffline" style="display: none;"><a href="javascript:void(0)">OFFLINE CHAT BUTTON</a></div>
<!-- END IADVIZE HTML CHAT CALLBACK -->
<!-- START IADVIZE HTML CALL BUTTON -->
<div id="idzfcallonline" style="display: none;"><a href="javascript:void(0);">ONLINE CALL BUTTON</a></div>
<div id="idzfcalloffline" style="display: none;"><a href="javascript:void(0);">OFFLINE CALL BUTTON</a></div>
<!-- END IADVIZE HTML CALL BUTTON -->
</div>

 Vous devez renseigner les valeurs :
- ONLINE CHAT BUTTON: code HTML indiquant que vous êtes disponible sur le canal Chat
- OFFLINE CHAT BUTTON: code HTML indiquant que vous êtes indisponible sur le canal Chat
- ONLINE CALL BUTTON: code HTML indiquant que vous êtes disponible sur le canal Call
- OFFLINE CALL BUTTON: code HTML indiquant que vous êtes indisponible sur le canal Call

 

7/ Plusieurs boutons fixes d'appel Click to Chat sur une même page gérant les états disponibles et indisponibles

<!-- START IADVIZE HTML CHAT BUTTON 1-->
<div class="idz_btn_fix_chat1">
<div class="idzfonline" style="display: none;"><a href="javascript:void(0);">ONLINE CHAT BUTTON 1</a></div>
<div class="idzfoffline" style="display: none;"><a href="javascript:void(0);">OFFLINE CHAT BUTTON 1</a></div>
</div>
<!-- END IADVIZE HTML CHAT BUTTON 1-->

<!-- START IADVIZE HTML CHAT BUTTON 2-->
<div class="idz_btn_fix_call">
<div class="idzfonline" style="display: none;"><a href="javascript:void(0);">ONLINE CHAT BUTTON 2</a></div>
<div class="idzfoffline" style="display: none;"><a href="javascript:void(0);">OFFLINE CHAT BUTTON 2</a></div>
</div>
<!-- END IADVIZE HTML CHAT BUTTON 2-->

 

Les ID ont été remplacés par des CLASS dans le code HTML des boutons fixes.


Vous devez renseigner les valeurs :
- ONLINE CHAT BUTTON 1 AND 2: code HTML indiquant que vous êtes disponible
- OFFLINE CHAT BUTTON 1 AND 2: code HTML indiquant que vous êtes indisponible

 

8/ Bouton fixe Click to Chat gérant les états disponible, occupé et indisponible

<!-- START IADVIZE HTML CALLBACK -->
<div class="idz_btn_fix">
<div id="idzfonline" style="display: none;"><a href="javascript:void(0)">ONLINE CHAT BUTTON</a></div>
<div id="idzfbusy" style="display: none;"><a href="javascript:void(0)">BUSY CHAT BUTTON</a></div>
<div id="idzfoffline" style="display: none;"><a href="javascript:void(0)">OFFLINE CHAT BUTTON</a></div>
</div>
<!-- END IADVIZE HTML CALLBACK -->

Vous devez renseigner les valeurs :
- ONLINE CHAT BUTTON: code HTML indiquant que vous êtes disponible sur le canal Chat
- BUSY CHAT BUTTON : code HTML indiquant que vous êtes occupé sur le canal Chat
- OFFLINE CHAT BUTTON: code HTML indiquant que vous êtes indisponible sur le canal Chat

 

Commentaires