Modifica il tema del centro assistenza per nascondere il codice HTML agli utenti in base al ruolo e al gruppo. Se le informazioni che vuoi nascondere sono sensibili, questa potrebbe non essere una soluzione praticabile poiché un utente può visualizzare il codice completo con la funzione Visualizza origine pagina nel proprio browser web.

Avvertenza: Questo articolo viene fornito solo a scopo didattico. Zendesk non fornisce assistenza per il codice e non lo garantisce.

Questo workflow contiene le sezioni seguenti:

  • Opzione 1: Nascondi o mostra il codice HTML in base al ruolo dell'utente
  • Opzione 2: Nascondi o mostra il codice HTML in base al gruppo dell'utente
Importante: Per usare correttamente le funzionalità del codice, usa la versione 2 per la creazione di modelli Guide o versioni successive. Per maggiori informazioni, consulta: Aggiornamento dalla Versione 1 di API per la creazione di modelli.

Opzione 1: Nascondi o mostra il codice HTML in base al ruolo dell'utente

Copia il frammento di codice qui sotto e incollalo direttamente sotto il primo elemento

nel file home_page.hbs. 
<div class="anonymous">
<h1>Welcome Anonymous User!</h1>
</div>
<div class="end_user">
<h1>Welcome End-User!</h1>
</div>
<div class="agent">
<h1>Welcome Agent!</h1>
</div>
<div class="manager">
<h1>Welcome Manager!</h1>
</div>

Inserisci il codice seguente sotto il modello CSS.

div.anonymous, div.end_user, div.agent, div.manager {
width: 100%;
text-align: center;
display: none;
}

Inserisci il codice seguente sotto il modello JS.

const anonymous = document.querySelector(".anonymous")
const end_user = document.querySelector(".end_user")
const agent = document.querySelector(".agent")
const manager = document.querySelector(".manager")

// Show div html based on role
if (HelpCenter.user.role=="anonymous"){
 anonymous.style.display = "block";
}

if (HelpCenter.user.role=="end_user"){
 end_user.style.display = "block";
}

if (HelpCenter.user.role=="agent"){
 agent.style.display = "block";
}

if (HelpCenter.user.role=="manager"){
 manager.style.display = "block";
}

Opzione 2: Nascondi o mostra il codice HTML in base al gruppo dell'utente

Copia il frammento di codice qui sotto e incollalo direttamente sotto il primo elemento

nel file home_page.hbs. 
const user_group = document.querySelector(".user_group")

<div class="user_group">
  <h1>Welcome to L2 Support!</h1>
</div>

Inserisci il codice seguente sotto il modello CSS.

div.user_group {
  width: 100%;
  text-align: center;
  display: none;
}

Inserisci il codice seguente sotto il modello JS. In questo esempio, sostituisci 'L2 Support' con il tuo gruppo di utenti.

const groups = HelpCenter.user.groups;

for (let i = 0; i < groups.length; i++) {
    if (groups[i].name == 'L2 Support' && groups[i].isActive == true) {
    user_group.style.display = "block";
  }
}
Nota: jQuery non è fornito per impostazione predefinita. Assicurati di importare una libreria jQuery se vuoi usare istruzioni jQuery in un tema al posto di JavaScript standard. Per ulteriori informazioni, leggi l’articolo: Importazione o aggiornamento di jQuery

Per ulteriori informazioni, leggi l’articolo: Personalizzazione del tema del centro assistenza.

Powered by Zendesk