Puoi personalizzare facilmente l’aspetto di un centro assistenza usando JavaScript e jQuery. Questo ricettario è stato ideato per aiutarti a dare al centro assistenza l’aspetto che desideri.
jQuery non è fornito per impostazione predefinita. Assicurati di importare una libreria jQuery se vuoi usare le istruzioni jQuery in un tema al posto di JavaScript standard. Per maggiori informazioni, consulta Importazione o aggiornamento di jQuery .
Puoi anche personalizzare il centro assistenza usando il linguaggio dei modelli del Centro assistenza o CSS:
Elenco ricette
Aggiungeremo altre ricette nel tempo, ma non possiamo mai sperare di essere esaurienti. Il numero di cose che puoi fare con JavaScript è limitato solo dalla tua immaginazione. Pubblica le tue ricette nella sezione commenti e le aggiungeremo a questo ricettario.
- Cambia il testo del link Le mie attività
- Rinomina le etichette “Oggetto” e “Descrizione” nel modulo di richiesta
- Precompila i campi dei moduli ticket personalizzati
- Cambia l’ordine dei campi personalizzati nel modulo di richiesta
- Aggiungi le intestazioni al modulo di richiesta
- Nasconde una lingua nel menu a discesa delle lingue
- Sostituisci le stringhe di testo nel selettore della lingua con le icone dei flag
- Nascondi la community in base alla lingua selezionata
Cambia il testo del link Le mie attività
Aggiungi la classe Le mie attività al modello header.hbs:
{{link "my_activities" role="menuitem" class='my-activities'}}
Aggiungi la seguente istruzione jQuery a $(document).ready(function()
funzione nel modello JavaScript:
$(' .my-activities').html(' See my requests');
Rinomina le etichette “Oggetto” e “Descrizione” nel modulo di richiesta
Aggiungi le seguenti istruzioni jQuery a $(document).ready(function()
funzione nel modello JavaScript:
$('label[for=request_subject]').html("Custom Subject");
$('label[for=request_description]').html("Custom Description");
Precompila i campi dei moduli ticket personalizzati
Supponiamo di usare un modulo ticket personalizzato nel centro assistenza per consentire agli utenti di registrare i prodotti. Puoi rilevare il modulo e precompilarne i campi quando un utente lo apre nel centro assistenza.
Avrai bisogno dell’ID modulo ticket, che puoi trovare nell’URL del modulo nel centro assistenza. Guarda questo esempio.
L’esempio jQuery seguente precompila il campo Oggetto con “Registrazione prodotto” e il campo Descrizione con “Questa è una nuova registrazione prodotto”. Aggiungi le istruzioni al file $(document).ready(function()
funzione nel modello JavaScript:
var ticketForm = location.search.split('ticket_form_id=')[1];
if(ticketForm == 18570) {
$('section.main-column h1').html('Product Registration');
$('#request_subject').val('Product Registration');
$('#request_description').val('There is a new product registration.');
$('#request_subject').parent('.request_subject').hide(); // Hide subject
$('#request_description').parent('.request_description').hide();
$("<p>Please upload your product receipt here.<p>").insertAfter('label:contains("Attachments")'); // Adds text below "Attachments"
}
Cambia l’ordine dei campi personalizzati nel modulo di richiesta
Ti serviranno gli ID dei campi personalizzati, che puoi trovare nell’interfaccia di Zendesk Support. Guarda questo esempio.
var firstName = $('input#request_custom_fields_22231170').parent();
var lastName = $('input#request_custom_fields_22231180').parent();
firstName.insertBefore($('input#request_subject').parent());
lastName.insertBefore($('input#request_subject').parent());
Aggiungi le intestazioni al modulo di richiesta
Aggiungi le seguenti istruzioni jQuery a $(document).ready(function()
funzione nel modello JavaScript:
$('.form-field.request_anonymous_requester_email').prepend('<h2>Your personal information</h2>')
$('.form-field.request_subject').prepend('<h2>Your issue</h2>');
$('.form-field.request_custom_fields_21875914').prepend('<h2>Your device information</h2>');
$('.form-field.request_custom_fields_22033620').prepend('<h2>Your purchase information</h2>');
$('.form-field > label:contains("Attachments")').prepend('<h2>Support attachments</h2>');
Nasconde una lingua nel menu a discesa delle lingue
Nascondere una lingua nel selettore della lingua può risultare utile se i contenuti in quella lingua non sono pronti per il rilascio. Aggiungi la seguente istruzione jQuery a $(document).ready(function()
funzione nel modello JavaScript:
$("ul.dropdown-panel li a:contains('Français')").hide();
Sostituisci le stringhe di testo nel selettore della lingua con le icone dei flag
Ad esempio, se il centro assistenza fornisce contenuti negli Stati Uniti, inglese e tedesco, potresti visualizzare le bandiere nazionali anziché "US English" e "Deutsch" nel selettore della lingua. Aggiungi la seguente istruzione jQuery a $(document).ready(function()
funzione nel modello JavaScript:
$(function(){
$('a.dropdown-toggle:contains("English (US)")').html('<img src="http://icons.iconarchive.com/icons/gosquared/flag/48/United-States-flat-icon.png" width="48" height="48">');
$('a.dropdown-toggle:contains("Deutsch")').html('<img src="http://icons.iconarchive.com/icons/gosquared/flag/48/Germany-flat-icon.png" width="48" height="48">');
$('a:contains("English (US)")').html('<img src="http://icons.iconarchive.com/icons/gosquared/flag/48/United-States-flat-icon.png" width="48" height="48">');
$('a:contains("Deutsch")').html('<img src="http://icons.iconarchive.com/icons/gosquared/flag/48/Germany-flat-icon.png" width="48" height="48">');
});
Nascondi la community in base alla lingua selezionata
Aggiungi la seguente istruzione jQuery a $(document).ready(function()
funzione nel modello JavaScript:
if (document.location.pathname.match( (/hc\/de/) || (/hc\/es/) )) {
$('.community').hide();
}
Avvertenza sulla traduzione: questo articolo è stato tradotto usando un software di traduzione automatizzata per fornire una comprensione di base del contenuto. È stato fatto tutto il possibile per fornire una traduzione accurata, tuttavia Zendesk non garantisce l'accuratezza della traduzione.
Per qualsiasi dubbio sull'accuratezza delle informazioni contenute nell'articolo tradotto, fai riferimento alla versione inglese dell'articolo come versione ufficiale.