- Pagină de pornire
- /
- Articol
Mulțumim pentru feedback.
Crearea unui aspect desktop personalizat
În acest articol
Feedback?Acest articol ajută la crearea unui aspect personalizat prin editarea unui fișier JSON și oferă exemple de cazuri de utilizare pentru a vă ajuta să începeți cu widgeturi precum widgetul Customer Experience Management Metrics și widgetul Customer Experience Journey. Pentru a lucra eficient cu machete de desktop particularizate, trebuie să aveți o înțelegere solidă a structurii HTML, a modelului arborelui de documente dintr-un browser și a formatului JSON.
Prezentare generală
Caracteristica Desktop Layout vă permite să configurați Webex Contact Center Desktop conform cerințelor afacerii dvs. Puteți personaliza elemente precum sigla, titlul și widgeturile. Puteți să creați un aspect desktop și să îl atribuiți unei echipe. Acest aspect generează experiența agentului pe desktop pentru toți agenții care se conectează ca parte a acelei echipe.
Există două tipuri de machete:
-
Aspect global: Acest aspect este un aspect generat de sistem care este atribuit în mod implicit atunci când creați o echipă. Pentru mai multe informații, consultați Gestionarea echipelor. Atunci când creați o echipă, Aspectul global este setat automat ca aspect desktop pentru echipă. Nu puteți șterge această machetă.
-
Aspect particularizat: Un aspect care oferă o experiență desktop particularizată. Puteți crea un aspect particularizat pentru una sau mai multe echipe.
Dacă atribuiți un nou aspect desktop atunci când un agent este conectat, agentul trebuie să reîncarce pagina pentru a vedea noul aspect.
Webex Contact Center Desktop acceptă trei persoane:
-
Agent
-
Supervizor
-
Supervizor și agent
Fișierul de aspect JSON are secțiuni separate pentru fiecare dintre persoane. Administratorul trebuie să configureze setările pentru fiecare persoană în secțiunea corespunzătoare a fișierului de aspect JSON. Pentru mai multe informații despre un fișier de aspect JSON eșantion, consultați Proprietăți de nivel superior aspect JSON.
Când Cisco adaugă o caracteristică nouă la aspectul desktop, aspectul nemodificat este actualizat automat cu noile caracteristici. Aspectul desktop actualizat este disponibil automat pentru echipele existente care utilizează aspectul desktop nemodificat. Utilizatorii de desktop care utilizează aspectul desktop nemodificat primesc noile caracteristici bazate pe aspect atunci când se conectează sau reîncarcă browserul.
Dacă utilizați fișierul implicit Desktop Layout.json fără nicio modificare, atunci acesta este considerat un aspect nemodificat. Cu toate acestea, dacă descărcați fișierul implicit de Layout.json desktop și îl încărcați din nou, acesta este considerat un aspect modificat, chiar dacă conținutul fișierului sau numele fișierului nu este modificat.
Pentru echipele care utilizează un aspect desktop particularizat, administratorii trebuie să reîmprospăteze periodic definiția aspectului pentru a încorpora caracteristici noi. Atunci când administratorii vizualizează un aspect nemodificat sau o echipă care utilizează un aspect nemodificat, se afișează un mesaj care indică faptul că noile caracteristici Desktop sunt aplicate automat.
Pe desktop, există două tipuri de widgeturi - bazate pe iframe și bazate pe componente web. Antetul, navigarea (pagina personalizată), zona persistentă, zona fără cap și panoul auxiliar sunt zona personalizabilă dintr-un desktop. Acestea nu sunt widget-uri.
Următoarea listă detaliază spațiile pe care le puteți configura. Imaginile ilustrează aspectul desktopului:
-
Zona Titlu și siglă: acest spațiu afișează sigla Webex Contact Center și numele (implicit) în colțul din stânga sus al ecranului.
-
Zona antetului orizontal: Acest spațiu are o zonă configurabilă care este populată cu widgeturi personalizate. Aceste widgeturi pot afișa, de exemplu, informații în linie și meniuri derulante. Deoarece înălțimea acestui antet este de numai 64 pixeli, înălțimea widgetului nu poate depăși înălțimea antetului.
-
Zona spațiului de lucru : acest spațiu se modifică conform selecției din bara de navigare sau atunci când un agent interacționează cu clienții. Atunci când un agent se află într-un apel, această zonă afișează panoul de control al interacțiunii și informații auxiliare (care include widgeturi personalizate și widgeturi persistente). Atunci când un agent interacționează prin e-mail, chat sau canale sociale, această zonă afișează zona spațiului de lucru și panoul de informații auxiliare (care include zona widgetului persistent).
Pagina particularizată se afișează pe interfața Desktop din panoul spațiului de lucru. Puteți accesa pagina particularizată prin pictogramele din bara de navigare. Fiecare pagină personalizată poate conține unul sau mai multe widgeturi personalizate.
Custom Widget este o aplicație terță parte care este configurată în aspectul JSON. Puteți plasa widgetul personalizat pe pagina personalizată, personalizat Tab (panoul Informații auxiliare) sau pe antetul orizontal al desktopului.
-
Zona Barei de navigare: Utilizați acest spațiu pentru a adăuga elemente de navigare pentru a accesa pagini personalizate.
Proprietăți de nivel superior ale aspectului JSON
Roluri
Aspectul JSON implicit are următoarele trei roluri.
-
Agent — pentru a seta aspectul desktop care să fie afișat atunci când un agent se conectează la Webex Contact Center Desktop pentru a gestiona activitățile agentului.
-
supervisor—Pentru a seta Aspectul desktop de afișat atunci când un supervizor se conectează la Webex Contact Center Desktop pentru a gestiona numai capacitățile supervizorului.
Atunci când un supervizor se conectează la Desktop, se aplică aspectul desktop specificat pentru echipa principală. Dacă nu furnizați o echipă principală, se aplică aspectul global. În mod implicit, rapoartele APS sunt dezactivate.
-
supervisorAgent — Pentru a seta aspectul desktop care să fie afișat atunci când un supervizor se conectează la Webex Contact Center Desktop pentru a gestiona atât capacitățile supervizorului, cât și activitățile agentului.
Puteți fie să adăugați, fie să modificați widgeturi pentru fiecare rol în persoana corespunzătoare a fișierului de aspect JSON relevant.
Următoarele sunt proprietățile de nivel superior pentru aspectul JSON pe baza rolului:
{ "agent": { "version": "0.1.0", "appTitle": "Webex Contact Center", "logo": "", "taskPageIllustration": "https://www.abc.com/image/logo.jpg", "stopNavigateOnAcceptTask": false, "dragDropEnabled": false, "notificationTimer": 8, "maximumNotificationCount": 3, "browserNotificationTimer": 8, "wxmConfigured": false, "desktopChatApp": { "webexConfigured": false, } "headerActions": ["outdial", "notification"], "area": { "advancedHeader": { ... }, "panou": { ... }, "navigare": { ... }, "persistent": { ... }, "fără cap": { ... } }, }, "supervisor": { "version": "0.1.0", "appTitle": "Webex Contact Center", "logo": "", "taskPageIllustration": "https://www.abc.com/image/logo.jpg", "stopNavigateOnAcceptTask": false, "dragDropEnabled": false, "notificationTimer": 8, "maximumNotificationCount": 3, "browserNotificationTimer": 8, "wxmConfigured": false, "desktopChatApp": { "webexConfigured": false, } "headerActions": ["outdial", "notification"], "area": { "advancedHeader": { ... }, "panou": { ... }, "navigare": { ... }, "persistent": { ... }, "fără cap": { ... }, "homePage": { ... } }, } "supervisorAgent": { "version": "0.1.0", "appTitle": "Webex Contact Center", "logo": "", "taskPageIllustration": "https://www.abc.com/image/logo.jpg", "stopNavigateOnAcceptTask": false, "dragDropEnabled": false, "notificationTimer": 8, "maximumNotificationCount": 3, "browserNotificationTimer": 8, "wxmConfigured": false, "desktopChatApp": { "webexConfigured": false, } "headerActions": ["outdial", "notification"], "area": { "advancedHeader": { ... }, "panou": { ... }, "navigare": { ... }, "persistent": { ... }, "fără cap": { ... } }, } },- Modificările efectuate la proprietățile aspectului JSON au efect atunci când browserul desktop este reîmprospătat.
- Dacă o caracteristică pe care ați activat-o în aspectul JSON nu este disponibilă pe desktop, contactați Cisco Support pentru a activa caracteristica.
- Toate proprietățile din aspectul JSON sunt sensibile la litere mari și mici.
appTitle
Pentru a specifica un titlu în antetul orizontal al desktopului. Titlul implicit este Webex Contact Center.
Exemplu:
"appTitle": "Webex Contact Center"Titlul implicit al aplicației este schimbat din Contact Center Desktop în Webex Contact Center. Nu există niciun impact asupra aspectelor particularizate existente care utilizează vechiul titlu implicit al aplicației (Desktop centru de contact). Pentru a utiliza noul appTitle, trebuie să modificați aspectul particularizat. Cu toate acestea, noul aspect global utilizează appTitle implicit ca Webex Contact Center.
Titlul poate fi text, o imagine sau un șir gol. Textul titlului apare pe două rânduri. Dacă textul se extinde dincolo de al doilea rând, se afișează o pictogramă puncte de suspensie și sfatul ecran afișează titlul complet. Stilurile nu pot fi aplicate titlului.
Puteți fie să utilizați URI-uri de date (Uniform Resource Identifier), fie să găzduiți o imagine titlu personalizată într-o rețea de livrare a conținutului (CDN), într-o găleată Amazon Web Services (AWS) Simple Storage Service (S3) sau într-un serviciu de găzduire similar, apoi să specificați adresa URL a imaginii găzduite. Formatele de imagine de titlu acceptate sunt PNG, JPG, JPEG, GIF, SVG și WebP. Dimensiunea acceptată a imaginii titlului este de 184 x 32 pixeli (lățime x înălțime).
siglă
Pentru a specifica un URL pentru sigla companiei. Dacă nu furnizați o adresă URL, sigla Webex Contact Center apare în mod prestabilit.
Exemplu:
"logo": "https://my-cdn.com/logo.png"Puteți găzdui o imagine logo personalizată pe o găleată CDN, Amazon Web Services (AWS) Simple Storage Service (S3) sau pe un serviciu de găzduire similar, apoi specificați adresa URL a imaginii găzduite. Formatele de imagine cu siglă acceptate sunt PNG, JPG, JPEG, GIF, SVG și WebP. Dimensiunea acceptată a imaginii siglei este de 96 x 32 pixeli (lățime x înălțime).
| Condiție | Exemplu | appTitle | siglă |
|---|---|---|---|
| Dacă appTitle și sigla nu sunt configurate |
|
Fără titlu | Siglă implicită |
| Dacă appTitle și sigla sunt configurate |
|
Text configurat | Siglă configurată |
| Dacă appTitle este configurat și sigla nu este configurată |
|
Text configurat | Siglă implicită |
|
Dacă appTitle nu este configurat și sigla este configurată
|
|
Fără titlu | Siglă configurată |
| Dacă appTitle este configurat și sigla nu este preferată |
|
Text configurat | Fără logo |
|
Dacă appTitle nu este configurat și sigla nu este preferată
|
|
Fără titlu | Fără logo |
| Dacă appTitle este adăugat ca imagine și sigla este configurată |
|
Imagine configurată | Siglă configurată |
|
Dacă appTitle este adăugat ca imagine și sigla nu este configurată
|
|
Imagine configurată | Siglă implicită |
|
Dacă appTitle este adăugat ca imagine și sigla nu este preferată
|
|
Imagine configurată | Fără logo |
- Dimensiunea personalizată a imaginii este ajustată pe baza raportului de aspect. Textul titlu particularizat care este configurat mai devreme poate apărea acum în două rânduri pe desktop. Pentru a evita acest lucru, puteți modifica textul titlului personalizat.
- Dacă titlul și sigla nu sunt configurate în antetul orizontal al desktopului, acel spațiu este utilizat de widgeturile antetului. Widgeturile antetului trebuie să fie configurate corect pentru a utiliza titlul și spațiul siglei.
- Titlul și sigla împreună nu pot depăși lățimea maximă de 304 pixeli (inclusiv umplutura). Dacă lățimea siglei este mai mică de 96 pixeli, lățimea rămasă poate fi utilizată pentru titlu.
- Dacă dimensiunea personalizată a imaginii este mai mare decât dimensiunea acceptată, dimensiunea imaginii este ajustată pe baza raportului de aspect din antetul orizontal. Dacă dimensiunea personalizată a imaginii este mai mică decât dimensiunea acceptată, dimensiunea reală a imaginii este păstrată în antetul orizontal.
taskPageIlustrație
Pentru a specifica o ilustrație particularizată pentru pagina de activități pe baza preferințelor organizației și a alinierii mărcii. Când un agent se conectează, pagina de activități afișează ilustrația configurată ca fundal. În mod implicit, pagina de activități apare fără ilustrație.
Exemplu:
"taskPageIllustration": "https://www.abc.com/image/logo.jpg",Puteți fie să utilizați URI-uri de date, fie să găzduiți o ilustrație personalizată într-o rețea de livrare a conținutului (CDN), într-o găleată Amazon Web Services (AWS) Simple Storage Service (S3) sau într-un serviciu de găzduire similar, apoi să specificați adresa URL ilustrației găzduite. Ilustrația poate fi configurată la nivel global sau de echipă pe baza definiției aspectului. Asigurați-vă că configurați URL-ul corect pentru a împiedica afișarea imaginii rupte pe desktop.
Formatele acceptate de ilustrare a paginii de activități sunt PNG, JPG, JPEG, GIF, SVG și WebP. Dimensiunea recomandată a ilustrației este de 400 x 400 pixeli (lățime x înălțime). Dacă dimensiunea ilustrației particularizate este mai mare decât dimensiunea recomandată, dimensiunea ilustrației este ajustată pe baza raportului de aspect din pagina de activități. Dacă dimensiunea ilustrației particularizate este mai mică decât dimensiunea recomandată, dimensiunea reală a ilustrației este păstrată în pagina de activități.
stopNavigateOnAcceptTask
Pentru a determina dacă să deplaseze focalizarea pe o activitate nou acceptată, atunci când agentul acceptă noua activitate în timp ce lucrează la o activitate anterioară. Valoarea implicită este false.
Exemplu:
"stopNavigateOnAcceptTask": falsDacă valoarea este setată ca true, atunci când utilizatorul acceptă o nouă activitate pe desktop, accentul este păstrat pe sarcina anterioară și nu trece la sarcina nou acceptată. Această setare împiedică utilizatorul să piardă date atunci când acceptă o nouă solicitare.
De exemplu, luați în considerare faptul că Agentul 1 este pe chat cu Clientul 1 și simultan într-un apel vocal cu Clientul 2. În timpul apelului vocal, Agentul 1 actualizează detaliile clientului 2 în panoul Control interacțiune. În prezent, Agentul 1 are două activități active în panoul Listă activități, iar accentul se pune pe panoul Control interacțiune. Atunci când Agentul 1 acceptă o nouă solicitare de chat de la Clientul 3, accentul rămâne pe panoul Control interacțiune cu Clientul 2 și nu trece la solicitarea de chat nou acceptată.
Pentru a păstra focalizarea pe activitatea anterioară și a nu trece la activitatea nou acceptată, selectați aspectul particularizat cu valoarea proprietății stopNavigateOnAcceptTask setată la true.
Dacă valoarea proprietății stopNavigateOnAcceptTask nu este introdusă în aspectul JSON, desktopul mută focalizarea pe activitatea nou acceptată. Comportamentul este similar cu atunci când valoarea proprietății stopNavigateOnAcceptTask este setată la false.
- Setarea se aplică tuturor activităților (voce și canale digitale) efectuate pe desktop, cum ar fi acceptarea unei activități, a unei conferințe, a unei consultări sau a unui transfer, precum și pentru apelurile de ieșire, apelurile de campanie de ieșire, încheierea automată etc.
- Setarea nu se aplică dacă utilizatorul Desktop se află pe pagina Home, fără nicio activitate activă în panoul Listă activități. Într-un astfel de caz, atunci când este acceptată o activitate nouă, focalizarea este mutată de la pagina Home la sarcina nou acceptată.
dragDropEnabled
Pentru a activa glisarea și plasarea și redimensionarea widgeturilor din paginile personalizate, setați valoarea la true. Valoarea implicită este false.
Exemplu:
"dragDropEnabled": falsPentru informații suplimentare despre activarea caracteristicii de glisare și fixare pentru filele din panoul Informații auxiliare, consultați Panoul de informații auxiliare.
Temporizator notificare
Pentru a seta durata (în secunde) după care notificările desktop de pe desktop sunt închise automat. Notificarea apare în colțul din dreapta sus al Desktopului. Valoarea implicită de expirare este de 8 secunde. Intervalul valid pentru valorile de expirare este de 1-10 secunde. Pentru ca modificările de expirare să aibă efect, browserul trebuie să fie reîmprospătat după efectuarea modificărilor.
Exemplu:
"notificationTimer": 8maximumNotificationCount
Pentru a seta numărul de notificări desktop care vor fi afișate simultan pe desktop. Valoarea implicită este 3. Intervalul pentru notificările desktop este de la 1 la 10. Notificările desktop sunt suprapuse. Dacă există multe notificări, acestea apar cu o ușoară întârziere, în funcție de setările timerului de notificare.
Exemplu:
"maximumNotificationCount": 3browserNotificationTimer
Pentru a seta durata (în secunde) după care notificările de prăjitor de pâine ale browserului de pe desktop sunt închise automat. Toaster este o notificare nativă de browser care apare numai dacă desktopul nu este fereastra activă a browserului sau Tab. Fereastra browserului desktop sau Tab este inactivă atunci când
-
Lucrați cu alte ferestre sau file de browser.
-
Lucrați cu alte aplicații.
-
Ați minimizat fereastra browserului desktop.
Notificarea apare în colțul din dreapta sus al Desktopului. Valoarea implicită de expirare este de 8 secunde. Intervalul recomandat pentru valorile de expirare este de 5-15 secunde. Pentru ca modificările de expirare să aibă efect, browserul trebuie să fie reîmprospătat după efectuarea modificărilor.
Exemplu:
"browserNotificationTimer": 8Expirarea configurată pentru notificările browserului depinde de sistemul de operare și de setările browserului. Valoarea de expirare este respectată în browser-ul Chrome pentru Windows OS, Chrome OS și macOS. Cu toate acestea, celelalte browsere compatibile nu respectă în mod consecvent valoarea configurată de expirare a notificării .
wxmConfigurat
(Opțional) Pentru a configura Webex Experience Management, setați valoarea la true. Valoarea implicită este false.
Exemplu:
"wxmConfigured": adevăratdesktopChatApp
Pentru a configura mai multe aplicații de chat oferite de Cisco, cum ar fi aplicația Webex.
webexConfigurat
Aplicația Webex împreună cu funcționalitățile sale de mesagerie și întâlnire pot fi configurate pe desktop. Această configurație permite agenților să colaboreze cu alți agenți, supraveghetori și experți în domeniu (IMM-uri) din organizația lor fără a naviga departe de desktop.
- Administratorul site-ului gestionează utilizatorii Webex Meeting și atribuie privilegii numai dacă utilizatorii au Webex Enterprise Edition. Pentru mai multe informații, consultați Gestionarea utilizatorilor Webex Meetings în Cisco Webex Control Hub.
- Supraveghetorii și IMM-urile trebuie să descarce clientul Webex pe sistemul lor (dispozitivul personal) sau să acceseze aplicația Webex folosind Webex App for Web ( https://web.webex.com/). Pentru mai multe informații, consultați Descărcarea aplicației.
- Puteți accesa aplicația Webex din Agent Desktop pentru a colabora cu alți agenți, supraveghetori și experți în domeniu (IMM-uri) din organizația dvs. fără a naviga departe de Agent Desktop. Caracteristica de control al apelurilor nu este disponibilă. Pentru a primi și a efectua apeluri, aveți nevoie de aplicația Webex externă, neîncorporată. Pentru mai multe informații, consultați Aplicații de Apelare.
Pentru a configura aplicația Webex pe desktop:
-
În Cisco Webex Control Hub, când adăugați servicii pentru un utilizator, bifați caseta de selectare Mesagerie complexă (). Pentru mai multe informații, consultați Gestionarea conturilor de utilizator în Cisco Webex Administrarea site-ului.
-
În Aspect desktop particularizat, setați
valoarea proprietății webexConfiguredlatrue.Exemplu:
"desktopChatApp": { "webexConfigured": adevărat },Valoarea implicită a
proprietății webexConfiguredestefalse.Aplicația Webex este disponibilă pentru rolurile agent, supervizor și supervizorAgent numai dacă setați
valoarea proprietății webexConfiguredlatruepentru fiecare dintre aceste roluri. Agentul, supervizorul sau supervizorulAgent nu se poate deconecta de la aplicația Webex.Pentru a afișa
(Webex) din antetul orizontal al desktopului, introduceți valoarea Webexînproprietatea headerActions. Pentru mai multe informații, consultați headerActions.Pentru a activa aplicația Webex pentru o anumită echipă, selectați aspectul personalizat cu
valoarea proprietății webexConfiguredsetată latrue. Pentru mai multe informații, consultați Crearea unei echipe.
Puteți configura aplicația Webex în panoul Informații auxiliare, pagina personalizată și, de asemenea, widgetul personalizat. Pentru informații suplimentare, consultați Panoul de informații auxiliare.
Webex Notificare aplicație
Valorile specificate utilizând proprietățile notificationTimer și browserNotificationTimer pentru cronometrul de notificare sunt aplicabile pentru aplicația Webex. Valoarea implicită de expirare este de 8 secunde pentru aceste proprietăți. Pentru informații suplimentare, consultați orderTimer și browserNotificationTimer.
headerActions
Pentru a modifica ordinea pictogramelor din antetul orizontal al desktopului. Ordinea implicită este următoarea:
-
(Webex)
-
(Apel de apelare) -
(Centrul de notificări)
Setați valoarea proprietății headerActions după cum urmează:
|
Nume pictogramă |
Valoarea proprietății headerActions |
|---|---|
|
Webex App |
webex |
|
Apelare Externă |
apelare |
|
Centrul de Notificări |
notificare |
Exemplu:
"headerActions": ["Webex", "outdial", "notification"],
Valoarea proprietății headerActions este sensibilă la litere mari și mici.
Pentru a modifica ordinea implicită a pictogramelor, introduceți proprietatea headerActions și valorile din aspectul particularizat în consecință.
Exemplu:
"headerActions": ["notificare", "outdial", "Webex"],
- Dacă nu introduceți
proprietatea și valorile headerActionsîn aspectul particularizat, pictogramele sunt afișate în ordinea implicită. - Pentru a elimina pictogramele de antet și funcționalitățile asociate de pe desktop, setați o valoare goală pentru
proprietatea headerActions ("headerActions": []). Cu toate acestea, dacă ați adăugat aplicația Webex la panoul Informații auxiliare sau la o pagină particularizată sau ca widget personalizat, agentul poate accesa în continuare aplicația Webex, deși aplicația Webex nu este disponibilă în antetul orizontal al desktopului. -
Dacă valoarea proprietății webexConfiguredeste setată cafalse, pictograma Webex App nu este afișată în antetul orizontal al desktopului, chiar dacăvaloarea Webexeste adăugată înproprietatea headerActions. Pentru mai multe informații, consultați webexConfigured.
zonă
Proprietatea zonă este secțiunea centrală a Aspect desktop. Puteți defini aspectul conform zonei.
"area": { "header": { ... }, "advancedHeader: { { "comp": "widget-1", "atribute": { ... }, "script": .... } }, "panou": { ... }, "navigare": { ... }, "persistent": { ... }, "fără cap": { ... } },Puteți configura următoarele obiecte de zonă :
-
Panou: Reprezintă al doilea panou sau panoul cel mai din dreapta din panoul Informații auxiliare.
-
Navigare: Reprezintă paginile personalizate și elementele lor de navigare care sunt corelate cu paginile.
-
Persistent: Reprezintă widgeturile la nivel de pagină care sunt persistente și se afișează pe toate paginile de pe desktop.
-
Fără cap: Reprezintă widgeturile care nu au o interfață vizuală, dar execută logica în fundal.
Dacă este configurată proprietatea advancedHeader, proprietățile header și headerActions trebuie eliminate.
advancedHeader
Pentru a personaliza vizibilitatea și a schimba ordinea pictogramelor din antetul orizontal al desktopului. Ordinea implicită este următoarea:
-
(Webex)
-
(Apel de apelare)
-
(Centrul de notificări)
-
(Selector stare agent)
Setați valoarea proprietății advancedHeader după cum urmează:
|
Nume pictogramă |
Valoarea proprietății headerActions |
|---|---|
|
Webex App |
agentx-webex |
|
Apelare Externă |
Apelare AgentX |
|
Centrul de Notificări |
AgentX-Notificare |
|
Selector stare agent |
agentx-stare-selector |
Exemplu:
"advancedHeader": [ { "comp": "agentx-webex" }, { "comp": "agentx-outdial" }, { "comp": "agentx-notification" }, { "comp": "agentx-state-selector" } { "comp": "widget-1", "atribute": { ... }, "script": .... } ]Valoarea proprietății advancedHeader este sensibilă la litere mari și mici.
Pentru a modifica ordinea implicită a pictogramelor, introduceți proprietatea advancedHeader și valorile din aspectul particularizat în consecință.
Widget-urile curg în meniul derulant de la stânga la dreapta.
-
Dacă nu introduceți
proprietatea advancedHeaderîn aspectul particularizat, se afișează antetul implicit. -
Când antetul avansat este activat, ar trebui să mutați widgeturile din antetul existent în antetul avansat, conform exemplului.
-
Când antetul avansat este activat, antetul vechi nu va fi afișat.
-
Fiecare pictogramă widget are o căptușeală și o margine implicite care sunt definite prin CSS și nu pot fi personalizate prin desktop.
-
Locația siglei, a titlului și a pictogramelor de profil este fixă și nu poate fi personalizată.
-
Pentru a elimina pictogramele de antet și funcționalitățile asociate de pe desktop, setați o valoare goală pentru componenta asociată în
proprietatea advancedHeader("advancedHeader": []).Dacă ați adăugat aplicația Webex la panoul Informații auxiliare sau la o pagină particularizată sau ca widget personalizat, agentul poate accesa în continuare aplicația Webex, deși aplicația Webex nu este disponibilă în antetul orizontal al desktopului.
-
Dacă adăugați un widget cu o etichetă lungă, se afișează un nume de etichetă trunchiat în funcție de spațiul disponibil.
Puteți utiliza atributul
textContentpentru a adăuga o etichetă la un widget.Exemplu:
{ "comp": "temporizator-widget", "atribute": { "durată": "08:00:00" }, "textContent": "Count Down Timer for Current Shift", "script": "https://wxcc-demo.s3.amazonaws.com/widgets/timer-widget.js" }Eticheta "Count Down Timer for Current Shift" va fi trunchiată și afișată în funcție de spațiul disponibil.
-
Evitați adăugarea de widgeturi cu o etichetă lungă.
-
Când un widget curge în meniul derulant, se poate face clic numai pe pictograma widgetului.
-
-
Dacă valoarea proprietății webexConfiguredeste setată cafalse, pictograma Webex App nu este afișată în antetul orizontal al desktopului, chiar dacăvaloarea Webexeste adăugată înproprietatea advancedHeader. Pentru mai multe informații, consultați webexConfigured.
Home Pagină
Când vă conectați la Desktop, ajungeți pe pagina Home.
Pagina Home este aplicabilă numai persoanelor Supervisors și SupervisorAgent.
Puteți vizualiza următoarele widgeturi pe pagina Home. Widgeturile Analizator sunt furnizate în mod implicit, dar administratorul poate configura, de asemenea, widgeturi persistente și personalizate. Pentru mai multe informații, consultați Proprietățile de nivel superior ale aspectului JSON.
Widget-uri analizor
În mod implicit, widgetul Analizator se afișează pe pagina Home Desktop.
Home Configurarea machetei paginii
Puteți configura pagina Home de pe desktop pentru a afișa aspectul bazat pe preferințele organizației dvs. și pe alinierea mărcii. Editați câmpul Homepage pentru a configura pagina Home. Puteți configura următoarele componente pentru a fi afișate în pagina Home atunci când un utilizator se conectează la desktop:
-
Un mesaj de bun venit
-
Pictograma Activitate din bara de navigare pentru a naviga la panoul Activități. Pictograma Activitate este afișată pentru rolul Supervizor și Supervizor și Agent, cu caracteristica de monitorizare a apelurilor activată. Panoul de activități afișează solicitările primite de la clienți, interacțiunile active și anterioare cu clienții și solicitările de monitorizare activă.
-
Filtrați secțiuni precum Nume coadă, Tip canal și Echipe gestionate.
Următorul tabel descrie proprietățile paginii necesare pentru configurarea paginii Home:
|
Proprietate |
Descriere și cod |
|---|---|
|
Pagina > useFlexLayout |
Aspectul flexibil este o componentă web nouă. Nu schimbă widgeturile existente. Noul aspect flexibil utilizează același format de configurare a aspectului într-un mod simplificat. Este compatibil cu versiunile anterioare și nu afectează widgeturile existente. Trebuie să configurați aspectul JSON. Pentru a configura aspectul JSON, furnizați înălțimea și lățimea widgetului. Widgetul este randat în aceeași secvență în care este configurat în interiorul aspectului JSON. Widgeturile au o marjă implicită de 8 px. Aspectul JSON se bazează pe dimensiunile (lățime x înălțime) și coordonatele (X, Y și Z) widgeturilor. Aspectul flexibil acceptă capabilități precum redimensionarea widgeturilor individuale, maximizarea widgeturilor și așa mai departe. Înălțimea widgeturilor individuale este măsurată în pixeli. 1 unitate de înălțime = 40 pixeli. Lățimea widgetului depinde de numărul de coloane din container și de numărul de coloane care se modifică în funcție de lățimea containerului. Widgeturile sunt afișate de la stânga la dreapta. Motorul avansat de aspect utilizează logica personalizată pentru a aplica ajustarea spațiului orizontal și vertical al widgeturilor. Inițial, aspectul se încarcă orizontal. După încărcarea orizontală, widgetul se încarcă vertical și asigură utilizarea optimă a spațiului. Configurați widgeturile pe baza dimensiunii ecranului. Puteți mări sau micșora lățimea widgeturilor, în funcție de dimensiunea ecranului. Acest lucru face widget-urile mai lizibile și mai ușor de utilizat. Dispunerea flexibilă oferă puncte de întrerupere standard, cum ar fi mare, mediu, mic și foarte mic.
Acești pixeli pot varia în funcție de sistemul de operare și de browser. |
|
Pagina > comp |
Asigurați-vă că furnizați o componentă particularizată unică. Componenta |
|
Pagină > pageHeader |
Asigurați-vă că specificați un șir de titlu care poate fi static, dinamic sau ambele. Componenta
|
|
Pagină > paginăSubHeader |
Asigurați-vă că adăugați un subantet care se afișează pe desktop. Utilizatorul poate adăuga Go to Analyzer în subantet.
|
Navigare (pagini personalizate)
În această secțiune, puteți adăuga pagini care apar în bara de navigare din stânga. Specificați o pictogramă de navigare și un URL unic pentru ca widgetul să apară pe bara de navigare. Vă recomandăm să utilizați un anumit prefix pentru adresa URL pentru a evita conflictele. Pentru mai multe detalii, consultați secțiunea de proprietăți nav.
De asemenea, puteți avea o colecție de widgeturi care se pot afișa pe această pagină. Pagina poate avea un singur widget care apare pe ecran sau o colecție de widgeturi într-o grilă. Pentru mai multe detalii despre aranjarea grilei, consultați secțiunea de proprietăți de aspect.
Nu este necesar să adăugați un ambalaj cu zonă dinamică la arborele widgeturilor. Aceasta înseamnă că puteți trage și plasa și redimensiona widgeturile pe paginile personalizate atunci când activați această opțiune.
Exemplu:
{ "nav": { "label": "Pagină personalizată", "pictogramă": "stored-info", "iconType": "momentum", "navigateTo": "dynamic-tabs", "align": "top", "isDefaultLandingPage": true }, "page": { "id": "pagina mea - personalizată", "useFlexLayout": true, "widgets": { " comp1": { "comp": "md-tabs", "children": [{ "comp": "md-tab", "textContent": "Shift Timer", "atribute": { "slot": "Tab" } }, { "comp": "md-tab-panel", "atribute": { "slot": "panel" }, "children": [{ "comp": "my - custom - timer", "source": http: my-cdn.com/my-custom-timer.js "wrapper": { "title": "Shift Timer", "maximizeAreaName": "app-maximize-area" }] }] }, { "comp": "md-tab", "textContent": "Bursa de valori", "responsive": "false" "atribute": { "slot": "Tab" }, }, { "comp": "md-tab-panel", "atribute": { "slot": "panel" }, "children": [{ "comp": "agentx-wc-iframe", "responsive": "false" "atribute": { "src": "https://widget-kad.s3.amazonaws.com/Trading.htm" }, "wrapper": { "title": "Bursa de valori", "maximizeAreaName": "app-maximize-area" } }], }, { "comp": "md-tab", "textContent": "Widget3", "atribute": { "slot": "Tab" } }, { "comp": "md-tab-panel", "textContent": "Trei conținut", "atribute": { "slot": "panou" } } ] }, "comp2": { "comp": "my - google - maps - component", "source": "https://my-cdn.com/my-google.maps.js "wrapper": { "title": "Google Map", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "areas": [ ["left", "right"] ], "size": { "cols": [1, 1], "rows": [1] } } },Următorul tabel descrie proprietățile de navigare și de pagină , împreună cu proprietățile fiu:
|
Proprietate |
Descriere și cod |
|---|---|
|
nav > etichetă |
Această proprietate indică identificatorul de navigare în pagină. Cititorul de ecran citește această proprietate și apare în sfatul ecran. Acești parametri sunt necesari pentru a afișa pagina particularizată pe bara de navigare. Proprietatea |
|
nav > iconType |
Această proprietate reprezintă tipul de pictogramă care se afișează în bara de navigare pentru pagina particularizată. Sunt disponibile următoarele tipuri de pictograme:
|
|
nav > pictogramă |
Această proprietate reprezintă numele pictogramei din biblioteca Momentum sau din URL-ul CDN. |
|
nav > aliniere |
Această proprietate vă ajută să aliniați pictograma în partea de sus sau de jos a barei de navigare. În prezent, proprietatea permite doar alinierea superioară. |
|
nav > isDefaultLandingPage | Această proprietate specifică pagina de destinație prestabilită pentru agenții din Agent Desktop. Setați această proprietate la true pentru a face pagina barei de navigare pagina de destinație implicită care apare pentru agenți după conectarea la Agent Desktop. Dacă mai multe pagini din bara de navigare au această proprietate setată la true, sistemul consideră că prima pagină din bara de navigare devine pagina de destinație implicită. Dacă nicio pagină din bara de navigare nu are această proprietate setată la true, pagina Home acționează ca pagină de destinație prestabilită. Nu puteți seta rapoartele Statistici performanță agent ca pagină de destinație prestabilită. |
|
nav > navigateTo |
Această proprietate specifică numele paginii particularizate. Acest nume apare în bara de adrese atunci când agentul navighează. Navigarea către nu trebuie să includă următoarele valori: imagini, fonturi, css, build_info, ajutor, aplicație, i18n, pictograme, imagini-mfe-wc și sunete. |
|
Proprietate |
Descriere și cod |
|---|---|
|
ID > pagina |
În Unitatea |
|
pagina > utilizareFlexLayout |
Aspectul flexibil este o componentă web nouă. Nu schimbă widgeturile existente. Noul aspect flexibil utilizează același format de configurare a aspectului într-un mod simplificat. Este compatibil cu versiunile anterioare și nu afectează widgeturile existente. Trebuie să configurați aspectul JSON. Pentru a configura aspectul JSON, furnizați înălțimea și lățimea widgetului. Widgetul este randat în aceeași secvență în care este configurat în interiorul aspectului JSON. Widgeturile au o marjă implicită de 8 px. Aspectul JSON se bazează pe dimensiunile (lățime x înălțime) și coordonatele (X, Y și Z) widgeturilor. Aspectul flexibil acceptă capabilități precum redimensionarea widgeturilor individuale, maximizarea widgeturilor și așa mai departe. Înălțimea widgeturilor individuale este măsurată în pixeli. 1 unitate de înălțime = 40 pixeli. Lățimea widgetului depinde de numărul de coloane din container și de numărul de coloane care se modifică în funcție de lățimea containerului. Widgeturile sunt afișate de la stânga la dreapta. Motorul avansat de aspect utilizează logica personalizată pentru a aplica ajustarea spațiului orizontal și vertical al widgeturilor. Inițial, aspectul se încarcă orizontal. După încărcarea orizontală, widgetul se încarcă vertical și asigură utilizarea optimă a spațiului. Configurați widgeturile pe baza dimensiunii ecranului. Puteți mări sau micșora lățimea widgeturilor, în funcție de dimensiunea ecranului. Acest lucru face widget-urile mai lizibile și mai ușor de utilizat. Dispunerea flexibilă oferă puncte de întrerupere standard, cum ar fi mare, mediu, mic și foarte mic.
Acești pixeli pot varia în funcție de sistemul de operare și de browser. |
|
page > widget-uri pagină > comp |
Vă ajută să definiți widgeturile personalizate. Pentru a plasa mai multe widgeturi, specificați opțiunile widgetului în ordine. Asigurați-vă că dați fiecărui widget un nume unic de zonă. Utilizați-l mai târziu în secțiunea de aspect. Această proprietate reprezintă numele elementului HTML particularizat (cunoscut sub numele de componentă web sau orice alt element - dacă doriți să îl utilizați ca ambalaj). Pentru mai multe informații, consultați exemple de cazuri de utilizare. Introduceți aici numele elementului particularizat, fără paranteze unghiulare ("<" sau ">"). De exemplu, "elementul meu personalizat". Fiecare intrare din secțiunea widgeturi acceptă următorul format: |
|
pagină > script |
(Opțional) Această proprietate este necesară numai atunci când încărcați widgetul sau componenta dintr-o locație la distanță, cum ar fi un CDN. Nu modificați URL-ul scriptului pentru aceeași componentă. Dacă trebuie să modificați URL-ul scriptului pentru aceeași componentă, efectuați una dintre următoarele acțiuni:
|
|
Proprietățile > pagină |
Aveți posibilitatea să specificați proprietățile pe care trebuie să le transmiteți pentru componenta web. |
|
Adaptabil la > pagină |
Determină dacă o componentă web sau un widget bazat pe iFrame care este adăugat în aspectul personalizat la nivel de Configurați această proprietate cu una dintre următoarele valori:
Widgeturile care nu răspund nu pot asigura cea mai bună experiență a utilizatorului și nu sunt afișate în vizualizarea mai mică. Agentul trebuie să mărească dimensiunea ferestrei browserului pentru a vizualiza orice widgeturi care sunt configurate ca nonresponsive. |
|
atribute > pagină |
Puteți specifica atributele componentei Web în această secțiune. |
|
Vizibilitatea paginii > |
Specifică dacă widgeturile oferite de Cisco, adăugate în aspectul personalizat la nivel de Widgeturile oferite de Cisco sunt Istoric contacte, Transcriere Cisco Webex Experience Management, IVR, Previzualizare ghid apeluri campanie și Ecran pop-up.
|
|
Pagina > copii |
Această proprietate este partea centrală a aspectului. În Pentru a afla despre transmiterea valorilor STORE ca proprietăți, consultați Partajarea datelor de pe desktop în widgeturi. Avantajul secțiunii de matrice "copii" este că puteți utiliza componentele web existente în specificațiile aspectului dvs., care fac deja parte din pachetul Desktop. Câteva dintre componentele web ale pachetului desktop includ:
Pentru mai multe informații despre atributele pentru Tab persistente, consultați Atribute pentru filele persistente. |
|
page > textContent |
Vă ajută să adăugați conținut text. |
|
stil > pagină |
Vă ajută să atribuiți un anumit stil CSS componentei dvs. |
|
pagina > wrapper |
Învelișul widgetului vă permite să adăugați o bară de instrumente deasupra widgetului. Bara de instrumente poate conține un titlu și Asigurați-vă că utilizați valoarea prestabilită ca "app-maximize-area". În prezent, este disponibilă numai valoarea implicită. |
|
ID pagină > înveliș> |
(Opțional) Ambalajul widgetului componentei web vă permite să actualizați titlul widgetului dinamic utilizând un identificator unic. Introduceți valoarea proprietății ID Asigurați-vă că utilizați același identificator unic pentru JavaScript CustomEvent. Pentru mai multe informații, consultați secțiunea Evenimente asincrone din capitolul Modul de contact agent din Cisco Webex Contact Center Desktop Developer. Pentru a actualiza titlul widgetului bazat pe iFrame, utilizați conținutul iFrame din același domeniu. Următorul este un exemplu de exemplu: |
|
pagina > agentx-wc-iframe |
Vă permite să încorporați o pagină web într-un iFrame care apare ca widget pe desktop. Puteți utiliza widgetul iFrame numit "agentx-wc-iframe". |
|
aspect pagină > | Vă permite să aranjați widgeturile pe o pagină. Următorul format reprezintă un aspect de grilă: Aici puteți defini grila cu numele zonelor pe care le-ați definit în secțiunea widget-uri . Următorul exemplu arată cum este specificat aspectul a trei rânduri și trei coloane:  În secțiunea de dimensiuni, numerele reprezintă fracțiunea de spațiu pe care un widget o poate ocupa, în raport cu celelalte widgeturi. Toate cele trei coloane ocupă 1 fracțiune egală de spațiu. Cu o lățime disponibilă de 100%, fiecare widget ocupă 33,33% din spațiul orizontal.  Un alt exemplu de caz de utilizare, dacă setați ca "cols": [1, 2, 2], înseamnă că spațiul total este împărțit la 5 (1 + 2 + 2) și primul widget ocupă 20% din spațiul orizontal. Al doilea și al treilea widget iau 40% fiecare. Pentru mai multe informații, consultați Concepte de bază ale aspectului grilei.  |
|
pagină > RĂDĂCINĂ |
Imbricarea machetelor se numește sublayout. În cazul în care aveți machete imbricate în configurația machetei, trebuie să aveți un singur obiect "ROOT" ca părinte pentru submachete. În caz contrar, configurația aspectului poate fi plată dacă nu este necesară imbricarea. Acest subaspect oferă mai mult control asupra comportamentului de redimensionare a aspectului. Proprietatea machetă pagină trebuie să fie de tip Înregistrare<șir, Aspect>. Proprietatea machetă vă permite să aranjați widgeturile pe o pagină. Această instalare creează o grilă în aspectul ROOT cu două subgrile pe care le puteți redimensiona independent.  Redimensionarea unei componente afectează componentele din acel subaspect.  Fiți conștienți de următoarele cazuri: Buclă infinită: Dacă includeți aspectul ROOT ca subaspect al ROOT, acesta provoacă o eroare "stiva de apeluri a depășit" și rulează într-o buclă infinită.  Același subaspect (N) ori: dacă includeți subaspectul în grilă de mai multe ori cu același nume și dacă redimensionați unul dintre ele, toate subaspectele sunt redimensionate automat. Dacă acesta nu este comportamentul dorit, redenumiți fiecare dintre subaspecte cu un nume unic.  |
(Atribute pentru filele persistente
Pentru a seta filele din paginile personalizate și widgeturile personalizate ca persistente, introduceți atributele pentru md-tabs în aspectul personalizat.
Exemplu: Setați filele ca persistente
{ "comp": "md-tabs", "atribute": { "persist-selection": true, "tabs-id": "unique-id pentru toate filele împreună în container" }, }|
Proprietate |
Descriere |
|---|---|
|
persistență-selecție |
Pentru a seta |
|
File-ID |
Identificare unică pentru toate filele împreună în container. |
Când setați md-tab-urile să fie persistente (persist-selection: true), Agent Desktop păstrează selecția Tab chiar dacă un agent comută între pagini sau widgeturi de pe desktop.
- Proprietatea
persist-selectionnu este aplicabilă filelor din panoul Informații auxiliare și din pagina Statistici performanță agent, deoarece comportamentul persistent Tab este deja setat pe desktop. - Selecția Tab este resetată la Tab implicit atunci când vă deconectați de la desktop, reîncărcați/reîmprospătați browserul sau goliți memoria cache a browserului.
Configurare widgeturi persistente
Puteți configura orice widget personalizat pentru a fi persistent. Widgeturile persistente se afișează pe toate paginile desktopului. Widgeturile persistente se afișează ca Tab nou în panoul Informații auxiliare numai atunci când aveți o solicitare de contact sau o conversație activă. De exemplu, Exemplu de widget persistent.
Widgeturile persistente nu se afișează pe pagina Home în modul în care se afișează pe celelalte pagini. Totuși, dacă aveți o interacțiune activă, widgeturile persistente se afișează în pagina Home ca parte a panoului Informații auxiliare. De exemplu, când ați răspuns la un apel, se afișează panoul Control interacțiune, iar widgetul Eșantion persistent se afișează ca parte a panoului Informații auxiliare.
Exemplu:
"area": { "persistent": [{ "comp": "md-tab", "atribute": { "slot": "Tab" }, "copii": [{ "comp": "md-icon", "atribute": { "name": "emoticons_16" } }, { "comp": "span", "textContent": "Custom Page Widget" } ] }, { "comp": "md-tab-panel", "atribute": { "slot": "panel" }, "children": [{ "comp": "dynamic-area", "properties": { "area": { "id": "dw-panel-two", "widgets": { "comp1": { "comp": "agentx-wc-iframe", "atribute": { "src": "https://blog.logrocket.com/the-ultimate-guide-to-iframes/" }, "wrapper": { "title": "AgentX iFrame", "maximizeAreaName": "app-maximize-area" } }, "comp2": { "comp": "uuip-widget-two", "script": "./dynamic-widgets/widget-two.js", "atribute": { "title": "conținut WIDGET 2" }, "wrapper": { "title": "Widget 2 title", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "areas": [ ["comp1", "comp2"] ], "size": { "cols": [1, 1], "rows": [1] } } } }] }Când personalizezi un widget, poți alege oricare dintre opțiuni:
-
Găzduiți o aplicație pe o pagină web care poate fi încorporată într-un iframe.
-
Creați un widget personalizat.
Cerințele tehnice pentru widgeturi sunt descrise în Documentația de dezvoltare a widgeturilor pentru desktop. Ca editor de aspect, asigurați-vă că aveți aceste detalii:
-
Care este numele elementului HTML particularizat (cunoscut sub numele de componentă web)?
-
Care este adresa URL către sursa rețelei de difuzare a conținutului (CDN) care găzduiește pachetul JavaScript?
Widget-uri antet
Antetul este utilizat pentru a afișa informații în linie, pentru a adăuga meniuri verticale și așa mai departe. Deoarece containerul antet are spațiu vertical limitat, înălțimea totală a antetului este de numai 64 pixeli. Pentru mai multe informații despre alinierea aspectului, consultați secțiunea de proprietăți a aspectului .
Exemplu:
"header":{ "id":"header", "widgets":{ "head1":{ "comp":"header-widget-one", "script":"https://my-cdn.com/dynamic-widgets/header-widget-one.js", }, "head2":{ "comp":"header-widget-two", "script":"https://my-cdn.com/dynamic-widgets/header-widget-two.js", } }, "layout":{ "areas":[[ "head1", "head2" ]], "size": { "cols": [1, 1], "rows": [1] } } }
Pentru a adăuga un sfat ecran pentru un widget antet, încadrați componenta cu md-tooltip. Introduceți informațiile despre sfatul ecran în proprietatea mesajului .
Exemplu:
"header": { "id": "dw-header", "widgets": { "head1": { "comp": "md-tooltip", "attributes": { "message": "Netlify" }, "children": [{ "comp": "agentx-wc-iframe", "attributes": { "src": "https://keen-jackson-8d352f.netlify.app" }] }, }, }Trebuie să adăugați atributele de stil, afișare și înălțime pentru a configura orice widget prin iFrame în zona widgetului personalizabil din antet. Valoarea celei mai potrivite pentru atributul înălțime este de 64 pixeli.
Asigurați-vă că adăugați atributele de stil la widgeturile de antet existente pentru ca acestea să se încarce conform așteptărilor în iFrame.
Exemplu:
"head1": { "comp": "agentx-wc-iframe", "atribute": { "src": "https://widget-kad.s3.amazonaws.com/Headers/Timer/Timer.htm", "style": "height:64px; display:flex;" } },Vă recomandăm să utilizați un singur rând cu mai multe coloane pentru antet, deoarece înălțimea antetului este de numai 64 de pixeli. Pentru mai multe informații despre aliniere, consultați secțiunea de proprietăți a aspectului .
Panou Informații Auxiliare
Panoul Informații auxiliare de pe desktop afișează filele care includ widgeturile (implicite) și widgeturile personalizate oferite de Cisco. Următoarele widgeturi oferite de Cisco apar în filele predefinite:
-
Istoric contacte
-
Transcriere IVR
-
Călătoria experienței clienților
-
Fereastră Pop
Puteți utiliza panoul Informații auxiliare pentru:
-
Adăugarea filelor
-
Modificarea ordinii Tab
-
Eliminarea filelor predefinite
-
Marcarea filelor particularizate ca glisabile
-
Adăugarea sfaturilor ecran la filele particularizate
-
Adăugați opțiunea Resetare comandă Tab
Exemplu:
"panel": { "comp": "md-tabs", "atribute": { "class": "widget-tabs" }, "children": [{ "comp": "md-tab", "attributes": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "attributes": { "name": "CONTACT_HISTORY_TAB" }] }] }, { "comp": "md-tab-panel", "attributes": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "attributes": { "name": "CONTACT_HISTORY" }] }] }, { "comp": "md-tab", "attributes": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "md-icon", "attributes": { "name": "pop-out_16" } }, { "comp": "span", "textContent": "Screen Pop" } ], "visibility": "SCREEN_POP" }, { "comp": "md-tab-panel", "attributes": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "#SCREEN_POP" }], }, { "comp": "md-tab", "attributes": { "slot": "Tab" }, "children": [{ "comp": "md-icon", "attributes": { "name": "emoticons_16" }, { "comp": "span", "textContent": "Widget personalizat" } ] }, { "comp": "md-tab-panel", "atribute": { "slot": "panel" }, "copii": [{ "comp": "dynamic-area", "properties": { "area": { "id": "dw-panel-two", "widgets": { "comp1": { "comp": "agentx-wc-iframe", "attributes": { "src": "https://blog.logrocket.com/the-ultimate-guide-to-iframes/" }, "wrapper": { "title": "AgentX iFrame", "maximizeAreaName": "app-maximize-area" } }, "comp2": { "comp": "widget-one", "script": "https://my-cdn.com/dynamic-widgets/widget-one.js", "wrapper": { "title": "Titlul widgetului", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "areas": [ ["comp1"], ["comp2"] ], "size": { "cols": [1], "rows": [1, 1] } } } } }] } ] },Puteți configura widgetul Customer Experience Journey după ce activați Customer Experience Management Metrics pe Portalul de management.
În panoul Informații auxiliare, adăugați file noi pentru a plasa widgeturile personalizate. Nu se aplică reguli speciale aici, iar componenta de cuibărire este așa cum era de așteptat și descrisă în secțiunea pentru copii . Pentru mai multe informații, consultați proprietatea Copiii a paginii.
Următoarele sunt exemple specifice pentru a vă personaliza anteturile Tab:
Exemplu de plasare a pictogramelor și etichetelor în proprietatea copiilor
{ "comp": "md-tab", "atribute": { "slot": "Tab", "class": "widget-pane-tab" }, "copii": [{ "comp": "md-icon", "atribute": { "name": "transcript_16" } }, { "comp": "span", "textContent": "Widgetul meu Tab" } ], },Exemplu de plasare a imaginii (cu CSS) și a etichetelor în proprietatea copiilor
{ "comp": "md-tab", "atribute": { "slot": "Tab" }, "copii": [{ "comp": "span", "atribute": { "style": "align-items: center; display: flex;" }, "children": [{ "comp": "img", "attributes": { "src": "http: //my-cdn.com/icon.svg", "width": 16, "height": 16, "style": "margin-right: 0.5rem;" } }, { "comp": "span", "textContent": "My Widget Tab" } ] }], },Lista verticală Mai multe file apare automat când panoul Informații auxiliare conține mai multe file.
Trebuie să adăugați un sfat ecran Tab personalizat pentru lizibilitate și accesibilitate. Pentru a adăuga un sfat ecran pentru un Tab personalizat, înfășurați componenta cu md-tooltip. Introduceți informațiile despre sfatul ecran în proprietatea mesajului și aplicați valorile proprietății de stil așa cum se arată în exemplul următor.
"comp": "md-tooltip", "atribute": { "class": "widget-tabs", "message": "Sample Tab 1", "style": "max-width: 252px; lățime min: 110px; preaplin: ascuns; supraîncărcare text: puncte de suspensie; spațiu alb: nowrap; afișaj: bloc în linie; margine-jos: -10px;" },Pentru un Tab personalizat, vă recomandăm o lățime maximă de 252 pixeli și o lățime minimă de 110 pixeli.
Pentru a activa funcția de glisare și plasare din Tab personalizat, adăugați următoarea proprietate în cadrul atributelor:
"comp": "md-tabs", "atribute": { "class": "widget-tabs", "draggable": true, "comp-unique-id": "sample-dynamic-custom-tabs" },-
tragebil:setați valoarea proprietății glisabilela true. -
comp-unique-id: introduceți o valoare unică pentru a identifica componenta.Exemplu:
"comp-unique-id": "sample-dynamic-custom-tabs"
Dacă activați glisarea și fixarea pentru un Tab personalizat, agentul poate glisa și fixa Tab în poziția dorită din panoul Informații auxiliare. Pentru a reseta filele la ordinea Tab implicită, adăugați următoarea proprietate:
"comp": "agentx-wc-more-actions-widget", "atribute": { "slot": "setări", "class": "widget-pane", "tabs-unique-id": "sample-dynamic-custom-tabs" },-
agentx-wc-more-actions-widget: Introduceți componenta care se afișează ca Mai multe acțiuni (
) din panoul Informații auxiliare. -
slot="settings": Introduceți un atribut în cadrul componentei care este afișat ca opțiunea Resetare comandă Tab în lista verticală Mai multe acțiuni . Agenții pot reseta filele din panoul Informații auxiliare la ordinea implicită, făcând clic pe pictograma > Resetați ordinea Tab. -
tabs-unique-id: introduceți aceeași valoare unică definită pentruproprietatea comp-unique-idpentru a mapa și resetacomponentele md-tabs.
Următorul exemplu de cod utilizează funcțiile Mai multe acțiuni și Resetare Tab Comandă .
"comp": "agentx-wc-more-actions-widget", "atribute": { "slot": "setări", "class": "widget-pane", "tabs-unique-id": "sample-dynamic-custom-tabs" }, "children": [{ "comp": "div", "atribute": { "textContent": "acțiune personalizată", "slot": "custom-action" }, "children": [{ "comp": "agentx-wc-notes-header-widget" }, { "comp": "agentx-wc-menu-notification" } ] }], }
În mod implicit, sunt definite sfatul ecran, pictograma puncte de suspensie și resetarea ordinii Tab pentru filele predefinite.
Lista derulantă Mai multe acțiuni poate fi extinsă pentru a adăuga componente sau widgeturi personalizate suplimentare după opțiunea Resetare comandă Tab. Următorul este un set eșantion de valori ale proprietăților stilului care pot fi aplicate componentelor suplimentare.
"comp": "md-tooltip", "atribute": { "class": "widget-tabs", "message": "Sample Element", "style": "max-width: 252px; lățime min: 110px; preaplin: ascuns; supraîncărcare text: puncte de suspensie; spațiu alb: nowrap; afișaj: bloc în linie; margine-jos: -10px;" },
Caracteristica tragere și fixare nu este acceptată pentru componentele sau widgeturile particularizate suplimentare care sunt adăugate la lista verticală Mai multe acțiuni .
Widget-uri fără cap
În secțiunea headless, puteți adăuga widget-uri care sunt ascunse și nu apar pe Agent Desktop. Aceste widgeturi sunt utilizate pentru a executa logica în fundal. Această secțiune este utilă pentru a declanșa evenimente care apar pe desktop și pentru a executa logica specifică widgetului. De exemplu, deschiderea unui ecran pop-up CRM personalizat pentru un SMS la sosirea acestuia.
Exemplu:
"headless":{ "id":"headless", "widgets":{ "comp1":{ "comp":"headless-widget-one", "script":"https://my-cdn.com/dynamic-widgets/headless-widget-one.js", }, "comp2":{ "comp":"headless-widget-two", "script":"https://my-cdn.com/dynamic-widgets/headless-widget-two.js", } }, "layout":{ "areas":[[ "comp1", comp2" ]], "size": { "cols": [1, 1], "rows": [1] } } } }
Partajarea datelor de pe desktop pe widgeturi
Pentru a primi date în timp real prin proprietăți sau atribute într-un widget personalizat, atribuiți valorile STORE corespunzătoare în configurația JSON a aspectului.
În plus, pentru a accesa datele prin intermediul abonaților JavaScript SDK, puteți, de asemenea, să transmiteți datele prin proprietăți sau atribute. În cazul în care componenta este construită pentru a reacționa la modificările proprietăților sau atributelor, obțineți actualizări de date în timp real de la Agent Desktop, care se numește furnizor de date.
În prezent, avem un singur furnizor de date sub un MAGAZIN cheie. Pentru mai multe informații, consultați secțiunea Furnizor de date - Proprietăți și atribute widget din Cisco Webex Contact Center Ghidul dezvoltatorului desktop.
Previzualizare apel campanie
Administratorul creează campanii, configurează modul de apelare (previzualizare) și atribuie campaniile echipelor. Dacă un agent face parte dintr-o echipă căreia îi sunt atribuite campanii, agentul poate efectua un apel de campanie de previzualizare de ieșire. Pentru informații suplimentare, consultați Configurarea modurilor campaniilor de ieșire vocală în Webex Contact Center.
Administratorul configurează următoarele în aspectul personalizat pentru a activa previzualizarea persoanei de contact a campaniei pentru un agent.
Contact campanie
Administratorul adaugă widgetul Contact campanie în containerul antet al aspectului personalizat. Contactul de campanie afișează informațiile de contact ale clientului pe baza proprietăților definite. Pentru mai multe informații despre alinierea aspectului, consultați rândul de proprietăți aspect al tabelului Detalii proprietate pagină.
Exemplu:
"advancedHeader": [ { "comp": "agentx-preview-campaign", "properties": { "isCampaignManagementEnabled": "$STORE.agent.isCampaignManagementEnabled", "agentDbId": "$STORE.agent.acqueonAgentId", "lcmUrl": "$STORE.agent.lcmUrl", "isCallInProgress": "$STORE.agentContact.isActiveCall", "outdialEntryPointId": "$STORE.agent.outDialEp", "teamId": "$STORE.agent.getAcqueonTeamId", "campaignManagerAdditionalInfo": "$STORE.agent.campaignManagerAdditionalInfo", "orgId": "$STORE.agent.orgId", "dialerProxyHost": "$STORE.envVaribles.serviceUrls.dialerProxyHost", "isProgressiveCampaignEnabled": "$STORE.app.featuresFlags.isProgressiveCampaignEnabled" } }, { "comp": "agentx-webex" }, { "comp": "agentx-outdial" }, { "comp": "agentx-notification" }, { "comp": "agentx-state-selector" } ] Ghid de apeluri
Widgetul Ghid de apeluri se afișează în panoul Informații auxiliare de pe desktop. Ghidul de apeluri afișează întrebările și răspunsurile la nivel de campanie. Agentului i se solicită să citească setul de întrebări din ghidul de apeluri și să trimită răspunsurile.
Exemplu:
"panel":{ "comp":"md-tabs", "attributes":{ "class":"widget-tabs" }, "children":[ { "comp":"md-tab", "attributes":{ "slot":"Tab", "class":"widget-pane-tab" }, "children":[ { "comp":"md-icon", "attributes":{ "name":"icon-note_16" } }, { "comp":"span", "textContent":"Call Guide" } ], "visibility":"CALL_GUIDE" }, { "comp":"md-tab-panel", "attributes":{ "slot":"panel", "class":"widget-pane" }, "children":[ { "comp": "acqueon-call-guide", "script": "http://localhost:5555//index.js", // include CDN link aici "wrapper":{ "title":"Call Guide", "maximizeAreaName":"app-maximize-area" }, "properties":{ "lcmKey":"$STORE.agentContact.getCallGuideProps.LCMKey", "agentDbId":"$STORE.agent.acqueonAgentId", "lcmUrl":"$STORE.agent.lcmUrl", "campaignManagerAdditionalInfo":"$STORE.agent.campaignManagerAdditionalInfo" "orgId": "$STORE.agent.orgId", "dialerProxyHost": "$STORE.envVaribles.serviceUrls.dialerProxyHost", "isProgressiveCampaignEnabled": "$STORE.app.featureFlags.isProgressiveCampaignEnabled" } } ], "vizibilitate":"CALL_GUIDE" } ] }- Următoarele
referințe de proprietăți comps-au modificat.agentxdin valoarea proprietății se înlocuiește cuacqueon:agentx-preview-campaigneste redenumit acqueon-preview-campaignagentx-call-guideeste redenumit acqueon-call-guide
- Trebuie să găzduiți List and Campaign Manager (LCM) pe un CDN, apoi să specificați adresa URL în proprietatea scriptului
.
Fereastră Pop
În Aspect desktop, puteți configura ecranul pop-up într-unul din următoarele moduri:
-
Ca pagină particularizată
-
Ca unul dintre widget-uri în pagina particularizată
-
Ca Tab în panoul Informații auxiliare
Ecranul pop-up este afișat pe desktop pe baza următorilor factori:
Pentru canalul de voce:
-
Configurația definită în Aspect desktop
-
Activitatea ferestrelor pop-up pe ecran definită în Designerul de flux
Pentru noile canale digitale:
-
Configurația definită în Aspect desktop
-
Nodul pop-up pe ecran definit în Generatorul de flux de conectare
Pentru mai multe informații despre configurarea ferestrei pop-up pe ecran, consultați Fereastră pop-up pe ecran.
Configurarea ferestrei pop-up pe ecran în bara de navigare
Puteți configura ecranul pop-up ca pagină personalizată sau ca unul dintre widgeturile dintr-o pagină personalizată. Pentru a accesa pagina particularizată Fereastră pop-up pe ecran, faceți clic pe pictograma Fereastră pop-up pe ecran din bara de navigare. Pentru a accesa widgetul Fereastră pop-up pe ecran din pagina particularizată, faceți clic pe pictograma particularizată din bara de navigare. Pentru informații suplimentare despre proprietățile de navigare , consultați Navigarea (pagini particularizate).
Exemplu: ecran pop-up ca pagină particularizată
{ "nav": { "label": "Screen Pop", "icon": "pop-out", "iconType": "momentum", "navigateTo": "/screenpop", "align": "top" }, "page": { "id": "agentx-wc-screen-pop", "widgets": { "comp1": { "comp": "agentx-wc-screen-pop", "properties": { "screenPopUrl": "$STORE.session.screenpop.screenPopSelector" } } }, "layout": { "areas": [ ["comp1"] ], "size": { "cols": [1], "rows": [1] } }, "visibility": "SCREEN_POP" }Exemplu: ecran pop-up ca widget în pagina personalizată
"comp1": { "comp": "agentx-wc-screen-pop", "properties": { "screenPopUrl": "$STORE.session.screenpop.screenPopSelector" }Dacă ecranul pop-up nu este configurat în Designerul de flux, pagina particularizată apare necompletată. Pentru mai multe informații despre configurarea ferestrei pop-up pe ecran în Designerul de flux, consultați Fereastră pop-up pe ecran.
Configurarea ferestrei pop-up pe ecran în panoul de informații auxiliare
Puteți configura ecranul pop-up să apară ca Tab în panoul Informații auxiliare.
În mod implicit, Fereastră pop-up pe ecran apare ca un nou sub Tab în fereastra pop-up pe ecranTab a panoului Informații auxiliare dacă fereastra pop-up este configurată pentru a fi afișată ca În interiorul desktopului în Designerul de flux.
Adăugați următorul atribut în secțiunea panoului pentru a include ecranul pop-up ca Tab în panoul Informații auxiliare. Pentru mai multe informații despre detaliile panoului , consultați Panoul de informații auxiliare.
Exemplu: Ecran pop-up ca Tab în panoul Informații auxiliare
{ "comp":"md-tab", "atribute":{ "slot":"Tab", "class":"widget-pane-tab" }, "copii":[ { "comp": "md-icon", "atribute": { "name": "pop-out_16" }}, { "comp": "span", "textContent": "Screen Pop" }], "vizibilitate": "SCREEN_POP" }, { "comp": "md-tab-panel", "atribute": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "#SCREEN_POP" } ], }Opțiunea de afișare a ecranului pop-up definită în Designerul de flux are prioritate față de configurația definită în Aspect desktop.
De exemplu, să considerăm că ați configurat următoarele setări pentru ecranul pop-pop:
- Designer de flux— Afișați setările ca În noul browser Tab
- Aspect desktop - ca Tab în panoul Informații auxiliare
Când are loc evenimentul pentru care este configurat ecranul pop-up, ecranul pop-up este afișat în afara desktopului - adică într-un browser nou Tab.
Exemple de cazuri de utilizare
-
Configurați și accesați widgetul Customer Experience Management Metrics din bara de navigare
-
Panoul de informații auxiliare implicit cu istoricul contactelor și fereastra pop-up pe ecran
-
Panou de informații auxiliare cu widget Customer Experience Journey
Configurați și accesați widgetul Customer Experience Management Metrics din bara de navigare
Exemplu:
{ "nav": { "label": "Customer Experience Management Metrics", "icon": "/app/images/wxm.bcd45cc3.svg", "iconType": "other", "navigateTo": "wxm-metrics", "align": "top" }, "page": { "id": "wxm-metrics", "widgets": { "comp1": { "comp": "agentx-wc-cloudcherry-widget", "attributes": { "metrics": true }, "properties": { "userModel": "$STORE.app.userModel", "spaceId": "", "metricsId": "", "teamId": "$STORE.agent.teamName", "ani": "$STORE.agentContact.taskSelected.ani", "isDarkMode": "$STORE.app. darkMode" }, "wrapper": { "title": "Customer Experience Journey", "maximizeAreaName": "app-maximize-area" } } }, "layout": { "areas": [ ["comp1"] ], "size": { "cols": [1], "rows": [1] } } },Pentru a obține spaceId și metricsId, consultați documentația Webex Experience Management .
Utilizarea filelor din pagina particularizată
Exemplu:
{ "nav": { "label": "File dinamice", "pictogramă": "stored-info", "iconType": "momentum", "navigateTo": "dynamic-tabs", "align": "top" }, "page": { "id": "page-id-tabs", "widgets": { "comp1": { "comp": "md-tabs", "children": [{ "comp": "md-tab", "textContent": "One", "attributes": { "slot": "Tab" } }, { "comp": "md-tab-panel", "atribute": { "slot": "panel" }, "children": [{ "comp": "widget-two", "script": "http:/my-cdn.com/dynamic-widgets/widget-two.js" }] }, { "comp": "md-tab", "textContent": "Două", "atribute": { "slot": "Tab" } }, { "comp": "md-tab-panel", "textContent": "Două conținuturi", "atribute": { "slot": "panel" } } ] }, "comp2": { "comp": "widget-two", "script": " http:/my-cdn.com/dynamic-widgets/widget-two.js" } }, "layout": { "areas": [ ["comp1", "comp2"] ], "size": { "cols": [1, 1], "rows": [1] } } }Panou de informații auxiliare implicit cu istoric contacte și fereastră pop-up pe ecran
Exemplu:
"panel": { "comp": "md-tabs", "attributes": { "class": "widget-tabs" }, "children": [{ "comp": "md-tab", "attributes": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "attributes": { "name": "CONTACT_HISTORY_TAB" }] }] }, { "comp": "md-tab-panel", "attributes": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "attributes": { "name": "CONTACT_HISTORY" }] }, ] }, { "comp": "md-tab", "attributes": { "slot": "Tab", "class": "widget-pane-tab" }, { "comp": "md-tab", "atribute": { "slot": "Tab", "class": "widget-pane-tab" }, "copii": [{ "comp": "slot", "atribute": { "name": "SCREEN_POP_TAB" } }], "vizibilitate": "SCREEN_POP" }, { "comp": "md-tab-panel", "atribute": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "atribute": { "name": "SCREEN_POP" }], "vizibilitate": "SCREEN_POP" }},Panou de informații auxiliare cu widget Customer Experience Journey
Exemplu:
"panel": { "comp": "md-tabs", "atribute": { "class": "widget-tabs" }, "children": [{ "comp": "md-tab", "attributes": { "slot": "Tab" }, "children": [{ "comp": "slot", "attributes": { "name": "WXM_JOURNEY_TAB" } }], "visibility": "WXM_JOURNEY" }, { "comp": "md-tab-panel", "attributes": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "agentx-wc-cloudcherry-widget", "properties": { "userModel": "$STORE.app.userModel", "spaceId": "", "metricsId": "", "teamId": "$STORE.agent.teamName", "ani": "$STORE.agentContact.taskSelected.ani", "isDarkMode": "$STORE.app.darkMode" }, "wrapper": { "title": "Customer Experience Journey", "maximizeAreaName": "app-maximize-area" } }], { "comp": "md-tab", "atribute": { "slot": "Tab", "class": "widget-pane-tab" }, "children": { "comp": "md-tab", "attributes": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "attributes": { "name": "CONTACT_HISTORY_TAB" }] }, { "comp": "md-tab-panel", "atribute": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "atribute": { "name": "CONTACT_HISTORY" }] }] }, { "comp": "md-tab", "atribute": { "slot": "Tab", "class": "widget-pane-tab" }, "children": [{ "comp": "slot", "atribute": { "name": "SCREEN_POP_TAB" } }], "vizibilitate": "SCREEN_POP" }, { "comp": "md-tab-panel", "atribute": { "slot": "panel", "class": "widget-pane" }, "children": [{ "comp": "slot", "attributes": { "name": "SCREEN_POP" } }], "vizibilitate": "SCREEN_POP" } "vizibilitate": "SCREEN_POP" }, },Localizare
Următoarele sunt limbile compatibile:
Bulgară, Catalană, Chineză (China), Chineză (Taiwan), Croată, Cehă, Daneză, Olandeză, Engleză (UK), Engleză (US), Finlandeză, Franceză, Germană, Ungară, Italiană, Japoneză, Coreeană, Norvegiană, Poloneză, Portugheză (Brazilia), Portugheză (Portugalia), Română, Rusă, Serbă, Slovacă, Slovenă, Spaniolă, Suedeză și Turcă.
Limba interfeței de utilizare desktop se bazează pe setările preferințelor de limbă din browser. De exemplu, să ne imaginăm că ați selectat limba preferată ca franceză pe browser-ul Firefox. Când lansați desktopul în browserul Firefox, interfața de utilizare desktop apare în Franais (franceză). Cu toate acestea, antetul orizontal, bara de navigare și alte componente adăugate în Aspect desktop nu sunt localizate pe baza setărilor preferințelor de limbă din browser.
Localizați componentele desktopului
Pentru a localiza componentele desktopului,
-
Utilizați cheile de localizare existente setate în
fișierul app.json. Dacă cheile de localizare nu sunt setate, se utilizează limba implicită Engleză (SUA). Puteți trimite o solicitare de serviciu la Cisco Support pentru a adăuga o cheie de localizare lafișierul app.json.Exemplu: cheie de localizare
{ "common": { "buttonTitle": "Stop Timer" } } -
Introduceți următoarea proprietate sensibilă la litere mari și mici în fișierul JSON Aspect desktop pentru a localiza o componentă:
"textContent": "$I 18N.<cheie>",unde <cheie> se referă la cheia de localizare corespunzătoare din
fișierul app.json.
Exemplu: Localizați componenta antetului
"header": { "id": "header", "widgets": { "head1": { "comp": "md-button", "attributes": { "slot": "menu-trigger", "style": "height: 64px" }, "children": [{ "comp": "span", "textContent": "$I 18N.common.buttonTitle", } }, }, }Exemplu: Localizați componenta Tab în panoul Informații auxiliare
"panel": { "comp": "md-tab", "atribute": { "slot": "Tab" }, "copii": [{ "comp": "span", "textContent": "$I 18N.panelTwo.screenPopTitle" }] }
