Edit "Your request was successfully submitted" confirmation

Avec réponse

33 Commentaires

  • Vladan Jovic

    Hi Darren, to edit text size//color just add these CSS snippets at the end of your current CSS file:

    span.notification-text {
    font-size: 19px !important;
    color: red !important;
    }

    To edit popup color, use this CSS:

    .notification-notice {
    background: red !important;
    border-color: red !important;
    }

    Hope this helps!

    1
  • Darren Taylor

    Hi Vladan

    Thank you for the quick response.  

     

    This did the job! Awesome. 

     

    0
  • Vladan Jovic

    Hey, is it at the bottom of your CSS? 

    This seems unnecessary https://cl.ly/rEY3

    Could you share with me link to your HC so I can take a look?

    Are you using the Copengahen theme?

    0
  • Darren Taylor

    Yes that was the issue. I removed it and it worked. Cheers!

    Sorry one more thing. Is there a way of also changing the size and color of the X which dismisses the confirmation?

    I thought it might be something like:

     

    .notification-dismiss {
    font-size: 15px;
    color: #FFFFFF;
    }

     

     

    0
  • Vladan Jovic

    Hi Darren, Glad to hear it works! About the X btn, try this one:

    .notification-notice .notification-icon::before {
    border-color: transparent !important;
    font-size: 23px !important;
    color: red;
    }
    1
  • Darren Taylor

    Thank you.

    Tried that and that seems to only change the tick icon.

    0
  • Vladan Jovic

    Ahhh sorry, I missed that you need X icon, so here it is:

    .notification-dismiss::before {
    color: red;
    }
    1
  • Darren Taylor

    That's great! Problem solved.

    Thank you for your help ;)

    0
  • Leon van Klink

    Hi there!

    Is it possible to adjust the "Your request was successfully submitted"-text? Maybe even using Dynamic Content?

    0
  • Leon van Klink

    Anyone? ;)

    0
  • Jessie Schutz

    Hey Leon!

    I pinged out Community Moderators about this yesterday but forgot to include the link! I've re-pinged them, so hopefully one of them will be able to hop over here and help you out!

    0
  • Leon van Klink

    No problem, thanks Jessie!

    0
  • Frankie Snavely

    Hey Leon,

    Not sure if this will work in your particular use case, but I was able to edit the text by putting the following line in my script.js file:

    $(".notification-text").html("Thank you for your request! A coach will be in touch with you shortly.");

    0
  • Vladan Jovic

    Hey Frankie, welcome to the Community!

    Your code will work for sure but note just one thing, this element (.notification-text) in some cases can notify about unsuccessful sending a msg. So, it would be better if in this JS code we have a condition if .notification-text contains "successfully" then -> your code. 

    Hope this helps. 

    if ($('span.notification-text:contains("successfully")').length > 0) {
    $('span.notification-text').text("Your custom text...");
    //any other custom stuff
    }
    0
  • Leon van Klink

    Thanks Frankie!

    Thanks Vladan! I will look into this, but how would this work when supporting multiple languages? Hence my initial question about Dynamic Content.

    0
  • Vladan Jovic

    Hey Leon, sure, here is the code if using a DC item.

    <script>
    if ($('span.notification-text:contains("successfully")').length > 0) {
    $('span.notification-text').text("{{dc 'DC-ITEM-NAME'}}");
    //any other custom stuff
    }
    </script>

    You put this code at the end of your Footer or Header.
    Don't forget to replace the DC item name from my code. ;)
    Let us know how it goes.

    0
  • Leon van Klink

    Looks good, I will look into this with a more tech-savvy colleague after the weekend and let you know if anything comes up. Many thanks Vladan!

    0
  • Vladan Jovic

    You are welcome, Leon! Looking forward to the feedback from you/your team!

    0
  • Frankie Snavely

    Thank you, Vladan! That makes sense and have updated my code accordingly!

    0
  • Caio Germani

    Hello everyone!

    I'm unable to see that pop-up after submitting a ticket. I can't find anything like "notification" inside my script.js and script.css.

    I can't find anything even inside the original Copenhagen theme.

    Can someone please help me?

    All I can find inside style.css is:

    .icon-notification-alert::before {
    content: "\26A0";
    }

    .icon-notification-error::before {
    content: "\00D7";
    }

    .icon-notification-info::before {
    content: "\2139";
    }

    .icon-notification-success::before {
    content: "\2714";
    }
    0
  • Emma MacDonald

    Anyone know if it's possible to change the text of the message and put the person's ticket ID in the text? i.e. "We’ve received your support ticket (#####)!"

    Additionally, is it possible to change the look of the check mark to make it bigger/a different color? 

    0
  • Jessie Schutz

    Hi Emma!

    Provided you're on the Team plan or above, you'll be able to make changes to the Notify Requester of Received Request trigger. You can find out more about modifying your triggers in this article.

    0
  • Vladan Jovic

    Emma meant on the top help center notification, right?

    If yes, that text can be changed, it's doable with a help of Javascript but you will need JS dev for that task.
    But I don't think it's possible to put the ticket ID.

    Color/Size of the icon, just put this at the end of your CSS file and replace "red" with your color.

    .notification-notice .notification-icon::before {
    border-color: red;
    font-size: 30px;
    color: red;
    width: 40px;
    height: 40px;
    line-height: 40px;
    }

    Hope this helps! 

    0
  • Emma MacDonald

    Hi Vladan - thanks, yes that's what I meant! Appreciate the help! 

    1
  • Justin

    Is it possible to customize the confirmation text depending on form(s) and/or ticket field selections?

    0
  • Jessie Schutz

    Hi Justin!

    The confirmation page template isn't available for editing in the Guide editor, but it might be possible to do with Javascript...I'll check with the Community moderators to see if they have any ideas.

    0
  • Vladan Jovic

    Hey Justin, yes that should be doable but some JS coding is needed.

    One way how that can be achieved:

    - if URL contains XZY - XYZ is the form ID

    - then set local storage eg form = XYZ

    Then, if local.storage == XYZ => do the rest what's needed - change the text.

    Hope this helps. 

    0
  • Danny Cohen

    @vladan, quick question: 

    Do you know if the ".notification-text" is localized? Or does it change when the HC language is changed?  

    We have a script with this logic to determine if we should show a section: 

    <script>
    if ($(".notification-text").length)
          if ($(".notification-text").html().indexOf("Your request was successfully submitted.") > -1) $(".new-request-sent").addClass("show");
    </script>

    We're noticing that this section is not appearing in our help centers when different languages are set, but only when english is set. 

    0
  • Vladan Jovic

    Hey Danny! I think it depends on language, not all langs are fully supported. 
    Just tested with German, and it is translated. 
    https://cl.ly/ce6d987a06aa
    "Ihre Anfrage wurde erfolgreich eingereicht. "
    Hope this answers to your question! 

    0
  • Trapta

    @Danny Cohen, it's probably behaving this way because you are using 'indexOf("Your request was successfully submitted.")' which will work only for English and not for other languages as the text is localized resulting, the condition fails for other languages.

    Team Diziana

    0

Veuillez vous connecter pour laisser un commentaire.

Réalisé par Zendesk