Allow editing of "Your email address" text description on "Submit a request"

Answered

25 Comments

  • Vlad
    Community Moderator

    Hi Stephen, you are right, there is no native option to edit this label.
    But you can edit this text with little JS code. 

    • go to https://YOUR_ZD_SUBDOMAIN.zendesk.com/theming/workbench
    • Edit your theme
    • on the left side choose the New request page
    • paste this code on the very bottom

    <script>
    $('.form-field.string.required.request_anonymous_requester_email label').text('Your university-provided email address');
    </script>
    • Save
    • Publish

    Hope this helps!

    2
  • DS RF

    Hi, how would you do this for the "Attachments" label?

    The URL from your original post is outdated, but I found new_request_page.hbs in the theme editor.

    <script>
    $('.form-field.string.required.request_anonymous_requester_email label').text('your custom email address tag');
    </script>

    That worked for the email address, but I can't figure out the correct attribute to target attachments.  "$('.form-field label').text('my custom attachments text');" works, except that it changes every form label :)

    0
  • Vlad
    Community Moderator

    Hey hey, this one should do the trick :)

    <script>
    $('label[for="request-attachments"]').text('your custom attachment label');
    </script>

     

     

    0
  • DS RF

    Awesome, worked great, thank you!

    1
  • Timo Tolonen

    Does the above code accept dynamic content? If so, how would I go about using that so we can have this localised for all languages? 

    0
  • Danny Koss

    Is it possible to re-order the email field (ie push lower down on the page) on the new request page?

    0
  • Vlad
    Community Moderator

    Hey Timo, Yes, the code I provided will work with a DC item as well. You just need to create a DC item first with all versions and then insert his DC placeholder instead of the text I put there. 

     

    Danny, yes, that is possible but will require some JS coding. If you have a JS dev in your team, it should be pretty straightforward to him. 

    0
  • Kristen

    Hello! Thank you in advance for the help!

    1. Do we know if it is possible to regex with the out-of-box "Your email address" field that Zendesk gives with their webform. Ideally, we'd be able to prevent spaces, look for .com or .org, etc to help prevent typos. 

    2. I'm trying to add this script to add a description to the email:

    <script>
    $('.form-field.string.required.request_anonymous_requester_email label').text('TESTING TEXT');
    </script>

    However, this doesn't seem to have any effect and is not showing up at all on the webform. What am I doing wrong?

    0
  • Vlad
    Community Moderator

    Hey Kristen, I'm not sure would that be necessary at all, cause ZD already has some kind of checking.

    Example: 

     

    In any case, if you want to create something on your own, you can take the code from here: 

    https://stackoverflow.com/questions/46155/how-to-validate-an-email-address-in-javascript 

    So, on click on the "Submit" button on ZD's form, this function should be called.

    Eg: if email format is not correct, scroll to the email field and show some kind of error text, eg "Your email is not good, please check".

    Hope this helps!

    1
  • Jonathan Cavey

    @... Is this still the correct process for this solution? I keep getting an error saying 'this page doesn't exist' 
    TIA

    0
  • Vlad
    Community Moderator

    Hey Jonathan, do you mean on the Email address field validating? Yes, it is the correct way, but first of all, I'm not sure what would be the purpose cause ZD in the background already has email address field validation.

     

    0
  • Jonathan Cavey

    @... I had a problem accessing through "https://YOUR_ZD_SUBDOMAIN.zendesk.com/hc/admin/appearance#editor"
    I solved by using the new_request_page.hbs in the theme editor.

    0
  • Kristen

    @... Thank you for your response above! I was wondering if you also had any guidance towards my second question:

     

    2. I'm trying to add this script to add a description to the email:

    <script>
    $('.form-field.string.required.request_anonymous_requester_email label').text('TESTING TEXT');
    </script>

    However, this doesn't seem to have any effect and is not showing up at all on the webform. What am I doing wrong?

    0
  • Vlad
    Community Moderator

    Hey @..., just to make sure, do you need to edit the label of the email field, or to add a desc under that field?

    0
  • Kristen

    @... Our team is open to either - whichever is easier. I think your top response in this forum was about customizing the description and that label editing wasn't possible, is that right? I tried to implement what you suggested in your first post, but I have a feeling I'm approaching it incorrectly!

    0
  • Vlad
    Community Moderator

    Both are doable. Here is the code that will do the trick:

    <script>
    //edit email label
    $('label[for="request_anonymous_requester_email"]').text('NEW LABEL HERE');

    //add desc text under the email field
    $('.request_anonymous_requester_email').append('<p>ADD DESC TEXT HERE</p>');
    </script>

    This code should be added at the end of the "New Request" template. In case you are using the newest Copenhagen theme, make sure jQuery is imported.

     
    0
  • Kristen

    @... Thank you for posting both of those! Believe it or not, I might need a little bit more guidance. I pasted the description text at the bottom of new_request_page.hbs template. And I think I'm using an older version of Copenhagen, so probably don't need jQuery. Thanks in advance for your help!

     

    0
  • Vlad
    Community Moderator

    Hmm, strange. I would need a URL to that help center, so I can take a closer look. It's hard to sort it out from this perspective. 

    0
  • Ronald

    I was also not seeing the expected change. I had to install jQuery 🤦‍♂️

    It has been many years since I've had to do help center customizations with jQuery and I had totally forgotten that step!

    https://support.zendesk.com/hc/en-us/articles/4408829274906-Importing-or-upgrading-jQuery

    0
  • Rousseau

    Vlad

    It seems when I follow your instruction below:  https://YOUR_ZD_SUBDOMAIN.zendesk.com/hc/admin/appearance#editor

    It says: "Oops this page does not exist". Does that mean there is a different way to access this editor? 

    0
  • Vlad
    Community Moderator

    Yes, it is; do a try with this URL
    https://YOUR_ZD_SUBDOMAIN.zendesk.com/theming/workbench
    edit the theme you want
    and follow the next steps. 

    0
  • Rousseau

    Vlad

    Do I need certain permissions to access the above pages? I get the oops message again.

    0
  • Dave Dyson
    Zendesk Community Manager
    Hi Rousseau, and welcome to the community!
     
    It looks like you're set to be a Light Agent in your instance, and accessing the Guide Theme editing tools requires Guide Admin access. You'll need to ask one of your Zendesk admins to give you that access (which might require adding an agent seat since you'll need to be made an agent or admin in Support as well, as Light Agents can't be made Guide Admins). For more information, see Understanding Guide roles and privileges and Changing an agent's role to grant Guide admin privileges
     
    0
  • Rousseau

    Vlad and Dave,

    Thanks for your feedback I managed to update my account to an admin account and make the changes that you suggested. Like Ronald and Kristen the changes are not taking effect for me.

    Please see below:

    link.
    link.

    1
  • Dave Dyson
    Zendesk Community Manager
    Hi Rosseau -
     
    As Vlad mentioned when he suggested his solution, if you're using the newest Copenhagen theme or have based your theme on that, you'll need to install jQuery for it to work: Importing or upgrading jQuery
    0

Please sign in to leave a comment.

Powered by Zendesk