Titels en beschrijving van standaardvelden wijzigen

Stef van Doorn
Stef van Doorn
  • Bijgewerkt

In Zendesk Guide kun je de titel of beschrijving van standaardformulier-velden aanpassen via JavaScript. Dit is bijvoorbeeld handig om duidelijke instructies te tonen bij specifieke velden, of om de naam van een veld aan te passen op basis van het type formulier.

De voorbeelden in deze handleiding zijn bedoeld voor gebruik in het bestand new_request_page.hbs, het template dat bepaalt hoe het aanvraagformulier eruitziet voor eindgebruikers.


Stap 1: Een extra beschrijving toevoegen aan een veld

Wil je onder een formulier-veld extra toelichting geven, dan kun je via jQuery een <p>-element toevoegen onder het juiste onderdeel van het formulier.

<script>
$('form#new_request .[VELD-SELECTOR]')
  .parent()
  .append('<p>[Je uitlegtekst hier]</p>');
</script>

Vervang [VELD-SELECTOR] door de class of ID van het gewenste veld, en pas de tekst aan naar wens.


Stap 2: De titel van een veld wijzigen

Je kunt de <label>-tekst van een formulier-veld aanpassen via JavaScript. Dit werkt standaard voor álle formulieren. Wil je het alleen toepassen op een specifiek formulier, dan kun je een extra controle op ticket_form_id toevoegen.

Standaard: voor alle formulieren

<script>
$('#[LABEL-ID]').text("[Nieuwe veldtitel]");
</script>
  • Vervang [LABEL-ID] door het ID van het label dat je wilt aanpassen (bijv. request_description_label).
  • Pas de tekst aan naar de gewenste veldtitel.

Optioneel: alleen voor een specifiek formulier

<script>
if (window.location.href.indexOf("ticket_form_id=[FORMULIER-ID]") > -1) {
  $('#[LABEL-ID]').text("[Nieuwe veldtitel]");
}
</script>
  • Gebruik deze variant als de wijziging alleen moet gelden voor een bepaald formulier.
  • Vervang [FORMULIER-ID] door het ID van dat formulier.

Alternatief: selecteren via class of structuur

<script>
$('.[VELD-CLASS] label').text("[Nieuwe veldtitel]");
</script>

Dit alternatief gebruik je wanneer een label geen ID heeft, maar wel consistent te vinden is via de class van de omliggende <div>.


Veelvoorkomende problemen oplossen

  • Script werkt niet: Zorg ervoor dat je script wordt uitgevoerd nadat de DOM is geladen. Zet het onderaan new_request_page.hbs, of gebruik $(document).ready(...).
  • Verkeerde selector: Gebruik Inspecteren in je browser om te controleren welk ID of welke class je nodig hebt.
  • Verkeerde formulier-ID: Controleer of de URL het juiste ticket_form_id bevat.

Samenvatting

Met behulp van eenvoudige JavaScript-regels in new_request_page.hbs kun je veldtitels en beschrijvingen in Zendesk-formulieren dynamisch aanpassen. Dit zorgt voor duidelijkere formulieren en een betere gebruikerservaring.

Tip: Voeg meerdere if (...)-blokken toe om verschillende formulieren apart te behandelen, of combineer ze in één script met switch of logische condities.