/* * These styles apply ONLY to the header and footer assets. */ .xf-footer-general__logo { padding-left: .4rem; padding-right: .4rem } @media(min-width:769px)and (max-width:1200px) { .xf-footer-general__logo { padding-left: .8rem; padding-right: .8rem } } @media(min-width:1201px) { .xf-footer-general__logo { padding-left: 1.2rem; padding-right: 1.2rem } } .cmp-container--in-grid { padding-left: 1.2rem; padding-right: 1.2rem } @media(min-width:769px)and (max-width:1200px) { .cmp-container--in-grid { padding-left: 2.2rem; padding-right: 2.2rem } } @media(min-width:1201px) { .cmp-container--in-grid { padding-left: 4.8rem; padding-right: 4.8rem } } @media(min-width:1440px) { .cmp-container--in-grid { clear: both!important; float: none!important; margin-left: auto!important; margin-right: auto!important; max-width: 134.4rem } } .cmp-container--fullwidth { margin-left: 0!important; margin-right: 0!important; padding-left: 0; padding-right: 0 } .cmp-container--spacing-bottom { margin-bottom: 8rem } @media(min-width:769px) { .cmp-container--spacing-bottom { margin-bottom: 12rem } } @media(min-width:1201px) { .cmp-container--spacing-bottom { margin-bottom: 16rem } } .cmp-container--half-spacing-bottom { margin-bottom: 2.4rem } @media(min-width:1201px) { .cmp-container--half-spacing-bottom { margin-bottom: 3.2rem } } .cmp-container--background-light>.cmp-container { background-color: #f7f7f7 } .cmp-container--background-dark>.cmp-container { background-color: #050a52; color: #fff } .cmp-container--background-dark>.cmp-container a, .cmp-container--background-dark>.cmp-container h1, .cmp-container--background-dark>.cmp-container h2, .cmp-container--background-dark>.cmp-container h3, .cmp-container--background-dark>.cmp-container h4, .cmp-container--background-dark>.cmp-container h5 { color: inherit } .cmp-container--border>.cmp-container { border-radius: .8rem } .cmp-container--in-grid .cmp-container--background>.cmp-container { margin-left: .4rem; margin-right: .4rem; padding: 1.2rem .8rem } @media(min-width:769px)and (max-width:1200px) { .cmp-container--in-grid .cmp-container--background>.cmp-container { margin-left: .8rem; margin-right: .8rem } } @media(min-width:1201px) { .cmp-container--in-grid .cmp-container--background>.cmp-container { margin-left: 1.2rem; margin-right: 1.2rem } } @media(min-width:769px)and (max-width:1200px) { .cmp-container--in-grid .cmp-container--background>.cmp-container { padding: 2.2rem 1.4rem } } @media(min-width:1201px) { .cmp-container--in-grid .cmp-container--background>.cmp-container { padding: 4.8rem 3.6rem } } @media(min-width:1440px) { .cmp-container--in-grid .cmp-container--background>.cmp-container { margin-left: 1.2rem!important; margin-right: 1.2rem!important } } .cmp-container--background>.cmp-container--fullwidth { padding-bottom: 1.2rem; padding-top: 1.2rem } @media(min-width:769px)and (max-width:1200px) { .cmp-container--background>.cmp-container--fullwidth { padding-bottom: 2.2rem; padding-top: 2.2rem } } @media(min-width:1201px) { .cmp-container--background>.cmp-container--fullwidth { padding-bottom: 4.8rem; padding-top: 4.8rem } } .xf-footer-general__content { background-color: #050a52; padding-bottom: 2rem; padding-top: 4.8rem } .xf-footer-general__content>.cmp-container { position: relative } .xf-footer-general__primary-content { padding-left: .4rem; padding-right: .4rem } @media(min-width:769px)and (max-width:1200px) { .xf-footer-general__primary-content { padding-left: .8rem; padding-right: .8rem } } @media(min-width:1201px) { .xf-footer-general__primary-content { padding-left: 1.2rem; padding-right: 1.2rem } } @media(min-width:1400px) { .xf-footer-general__primary-content>.cmp-container { display: grid; grid-template: 5.7rem auto/1fr 2fr; grid-template-areas: "logo sitemap" "regionselector sitemap" } .xf-footer-general__primary-content { padding-top: 1.6rem } } .xf-footer-general__logo { margin-bottom: 3.2rem; padding: 0 } .xf-footer-general__logo .cmp-image__image { border-radius: unset; height: 1.5rem; width: auto } .xf-footer-general__logo .cmp-image__link { display: block } @media(min-width:1400px) { .xf-footer-general__logo { grid-area: logo } } .xf-footer-general__regionselector .cmp-regionselector-trigger { align-items: center; background: unset; border: unset; color: #fff; cursor: pointer; display: flex; font-size: 14px; font-weight: 700; padding: 0 } .xf-footer-general__regionselector .cmp-regionselector-trigger__icon { stroke: currentColor; height: 2.4rem; margin-right: .8rem; width: 2.4rem } .xf-footer-general__regionselector .cmp-regionselector-trigger__icon path { stroke-width: 5 } .xf-footer-general__regionselector .cmp-regionselector-trigger__label { align-items: center; display: flex } .xf-footer-general__regionselector .cmp-regionselector-trigger__label:after { border-bottom: .2rem solid #fff; border-right: .2rem solid #fff; content: ""; display: inline-block; height: .8rem; margin-left: .8rem; transform: rotate(45deg) translateY(-.4rem); width: .8rem } @media(min-width:1400px) { .xf-footer-general__regionselector { grid-area: regionselector } } .xf-footer-general__sitemap { padding-top: 1.2rem } .xf-footer-general__sitemap .cmp-sitemap { font-size: 14px } .xf-footer-general__sitemap .cmp-sitemap__group { grid-column-gap: .5rem; display: grid; grid-template-columns: 1fr 1fr } @media(min-width:769px) { .xf-footer-general__sitemap .cmp-sitemap__group { grid-gap: 4rem 1.6rem; grid-template-columns: repeat(4, 1fr) } } .xf-footer-general__sitemap .cmp-sitemap__item-label { color: #fff; display: block; font-weight: 700; margin-top: 4rem; text-decoration: none } @media(min-width:1400px) { .xf-footer-general__sitemap .cmp-sitemap__item-label { margin-top: 0 } } .xf-footer-general__sitemap .cmp-sitemap__linkicon { fill: currentColor; flex-shrink: 0; height: 1.2em; margin-top: .2em; opacity: 0 } @media(max-width:768px) { .xf-footer-general__sitemap .cmp-sitemap__linkicon { display: none } } .xf-footer-general__sitemap .cmp-sitemap__listitem-link { grid-gap: .8rem; color: #c4c4c4; display: flex; padding-bottom: .6rem; padding-top: .6rem; text-decoration: none } .xf-footer-general__sitemap .cmp-sitemap__listitem-link:hover { color: #fff } .xf-footer-general__sitemap .cmp-sitemap__listitem-link:hover .cmp-sitemap__linkicon { opacity: 1 } @media(min-width:1400px) { .xf-footer-general__sitemap { grid-area: sitemap; padding-top: 0 } } .xf-footer-general__social-content { margin-top: 4.8rem; padding-left: .4rem; padding-right: .4rem } @media(min-width:769px)and (max-width:1200px) { .xf-footer-general__social-content { padding-left: .8rem; padding-right: .8rem } } @media(min-width:1201px) { .xf-footer-general__social-content { padding-left: 1.2rem; padding-right: 1.2rem } } .xf-footer-general__social-content>.cmp-container { grid-gap: .8rem; display: flex } .xf-footer-general__social-icon { padding: 0 } .xf-footer-general__social-icon .cmp-image__link { align-items: center; background-color: hsla(0, 0%, 100%, .1); border-radius: .8rem; box-sizing: border-box; display: flex; height: 2.5rem; justify-content: center; padding: .6rem; width: 2.5rem } .xf-footer-general__social-icon .cmp-image__link:hover { background-color: hsla(0, 0%, 100%, .2) } .xf-footer-general__social-icon .cmp-image__image { border-radius: unset; height: auto; max-height: 100%; max-width: 100%; width: auto } .xf-footer-general__legal-content { border-top: .1rem solid #1f38b0; box-sizing: border-box; font-size: 14px; margin-left: .4rem; margin-right: .4rem; margin-top: 4.8rem; padding-top: 2rem } @media(min-width:769px)and (max-width:1200px) { .xf-footer-general__legal-content { margin-left: .8rem; margin-right: .8rem } } @media(min-width:1201px) { .xf-footer-general__legal-content { margin-left: 1.2rem; margin-right: 1.2rem } } @media(min-width:1400px) { .xf-footer-general__legal-content { margin-top: 0rem } } .xf-footer-general__legal-navigation { color: #c4c4c4 } @media(min-width:769px) { .xf-footer-general__legal-navigation, .xf-footer-general__legal-navigation .cmp-navigation__group { grid-gap: 1.8rem; display: flex } } .xf-footer-general__legal-navigation .cmp-navigation__cookiesetting, .xf-footer-general__legal-navigation .cmp-navigation__item-link { color: inherit; display: block; padding-bottom: .6rem; padding-top: .6rem; text-decoration: none } .xf-footer-general__legal-navigation .cmp-navigation__cookiesetting:hover, .xf-footer-general__legal-navigation .cmp-navigation__item-link:hover { color: #fff } .xf-footer-general__legal-text { color: #c4c4c4; font-size: 14px; padding: 2rem 0 .8rem } .xf-footer-general__legal-text a { color: inherit } .xf-footer-general { bottom: 0; position: absolute; top: 100%; width: 100% } .xf-footer-general__primary-content--campaign { padding-top: unset } @media(min-width:769px) { .xf-footer-general__social-content--campaign { margin-top: 0; padding: 0; position: absolute; right: 3rem; top: 0 } } @media(min-width:1201px) { .xf-footer-general__social-content--campaign { right: 6rem } } .xf-footer-general__primary-content--campaign-minified { margin-top: -1.6rem; padding-top: unset } @media(min-width:769px) { .xf-footer-general__legal-content--campaign-minified { margin-top: 3rem; padding-top: 1.4rem } .xf-footer-general__social-content--campaign-minified { margin-top: 0; padding: 0; position: absolute; right: 3rem; top: -.8rem } } @media(min-width:1201px) { .xf-footer-general__social-content--campaign-minified { right: 6rem } } @media(min-width:1400px) { .xf-footer-general__legal-content--campaign-minified, .xf-footer-general__primary-content--campaign-minified { float: left } .xf-footer-general__primary-content--campaign-minified>.cmp-container { display: block } .xf-footer-general__legal-content--campaign-minified { border-top: unset; margin-bottom: .4rem; margin-left: 5.6rem; margin-top: -2.1rem; padding-top: unset } .xf-footer-general__social-content--campaign-minified { top: -2.4rem } } .xf-footer-general--campaign { bottom: 0; position: absolute; top: 100%; width: 100% } .xf-footer-general__content { box-sizing: border-box; font-family: inherit; min-height: 8.8rem } .xf-footer-general__content ul { list-style: none; margin: 0; padding: 0 } @media(min-width:769px) { .xf-footer-general__primary-content--campaign-minified { min-height: 2.4rem } } .xf-footer-general__regionselector .cmp-regionselector, .xf-footer-general__regionselector .cmp-regionselector-trigger { display: none }

Autres produits

Plugins - Webchat

Chemin de navigation : Plugins > Webchat

Après avoir créé un nouveau plugin de webchat ou modifié celui qui existe déjà, vous vous retrouvez à l'écran suivant :

Onglet : Personnaliser

Chat

Utilisez notre éditeur visualisé pour ajouter un titre de chat, une description de bienvenue, des boutons de chat et l'indication du champ de saisie. Les boutons de chat peuvent déclencher des flux.

Style

Modifiez les couleurs du chat en fonction de celles de votre entreprise et positionnez le cercle du chat en bas à droite ou en bas à gauche. Cliquez sur Avancé et faites référence à une URL CSS personnalisée pour ajouter d'autres personnalisations.

Paramètres avancés

En passant par Advanced, les options suivantes apparaissent :

Identifiant de visiteur basé sur la session : L'identifiant du visiteur est désormais basé sur la session, ce qui signifie que lorsque l'utilisateur ferme l'onglet du navigateur, un nouvel identifiant lui est attribué.
Ajout automatique de HTML : Il suffit d'insérer l'extrait de JavaScript, le HTML est automatiquement ajouté.
Déclencher un formulaire dès qu'un client est marqué comme terminé
Bouton de masquage (le chat peut être ouvert en utilisant l'API)
Masquer le statut en ligne de l'agent dans l'en-tête : Cache le statut en ligne actuel de l'agent dans l'en-tête de la discussion.

Onglet : Disponibilité

Dans Disponibilité, vous trouverez trois options standard pour définir à quelles heures le chat sera visible pour vos clients.

Toujours - chat visible 24/7, les clients peuvent vous envoyer des SMS à tout moment
Un agent est en ligne
Pendant les heures d'ouverture - définissez vos heures d'ouverture, le chat ne sera visible qu'à ce moment-là.

Un agent est en ligne

Grâce au bouton "Go online" situé en haut à droite de la plateforme TeamViewer Engage, les agents peuvent se mettre en ligne ou hors ligne. Les agents dont l'état est "en ligne" peuvent être spécifiquement ciblés par des messages entrants à l'aide de règles de routage.

Continuer la lecture ici

Plugins - 03 Co-Browsing