How to edit the Jetpack contact form confirmation message

January 19, 2021

Jetpack contact form success message

If you Google how to edit the confirmation message that appears when you submit a contact form using the Jetpack WordPress plugin, you'll find lots of results telling you how to do this by editing the PHP within the Jetpack plugin (which also works for WordPress.com websites). This isn't ideal because not everyone is comfortable editing PHP and if you don't do it properly then your changes will be lost when you update Jetpack to a new version in future.

The Jetpack Contact Form Success Message plugin was launched a month or so ago and provides a better way to edit the confirmation message.  This contact form plugin lets you edit the message that appears on the screen after you submit a contact form. As the name suggests, it can only be used for contact forms that have been added via the Jetpack contact form - not other plugins such as Contact Form 7 or Gravity Forms.

JetPack Contact Form Success MessageOnce you have installed and activated the contact form plugin, a settings page will appear in the WordPress admin. You can use this to create your success message using the standard WordPress editor. This means that you have access to all your usual heading styles, toolbar buttons etc... using the form builder and can edit the text as needed. You could even add images or other media if you wanted, although I don't know why you would want to!

Customised Jetpack contact form success messageOnce you save the Jetpack contact form confirmation message, test your contact form to see it in action. You can do this with a test contact form submission. You can easily make tweaks until it looks exactly how you require. With this contact form plugin, there's no need to mess around with shortcodes or widgets.

This plugin does exactly what it needs to. It won't change the world but it has fixed a gap that hasn't been fixed elsewhere. There are a couple of ways that I would like to see it improved to make it even more helpful for people:

  • Add an option to put the success message in a box without having to edit the CSS. Some themes don't have notification boxes built in so this would allow people to make the confirmation message more obvious.
  • Provide an option for the confirmation message to appear instead of the content of the page that the form is on. For example, at the moment the success message appears in place of the Jetpack contact form, but the rest of the text on the page remains where it is. This may not be appropriate if - for example - the text elsewhere on the page says "Complete our contact form below". Some users might want to hide the other text on the page and just display the contact form, or perhaps view the confirmation message on a separate page.

But all in all, a handy little plugin for your WordPress site.

8 Comments

  1. David Hudson
    October 25, 2016 Reply

    i installed the plugin and tried to update message but i keep getting this message when i submit the form:
    Fatal error: Using $this when not in object context in /nfs/c10/h02/mnt/149486/domains/katherinemhudson.com/html/wp-content/plugins/jetpack-contact-form-success-message/index.php on line 59
    can you help? Thanks, David H.

    • Katie
      October 25, 2016 Reply

      That's strange, I recommend that you send a support request to Jetpack Contact Form Success Message asking them to investigate the error.

  2. irshad shaikh
    October 6, 2016 Reply

    if i want to keep the deafult message and add more to it then what should i do

    • Katie
      October 6, 2016 Reply

      Hi Irshad, the technique discussed in this article tells you how to replace the default message rather than adding to it. The easiest way to do what you've described is to add the wording from the default message to the new message when you add it - that way, you can have both.

  3. Samuel Elh
    February 29, 2016 Reply

    Hello again,

    just posting again the code snippet as it appears the HTML is stripped.. :

    add_filter('jpcfsm_message_content_loaded', function($message) {
    return '

    ' . $message . '

    ';
    });

    https://pastebin.com/wbgEvgPU

  4. Samuel Elh
    February 29, 2016 Reply

    Hi Katie!

    Thank you so much for taking time to put together this article!!

    I am the plugin developer and I have recently released a new version of JetPack Contact Form Success Message. The new version lets you filter all post/page content when the form is sent [as you suggested in the last paragraph], and for the CSS suggestion I am sorry to let you know that we try to keep this as light and basic as we can, and you can use other plugin to style the success message, or simply if you are familiar with CSS you can add this code to your child theme's functions file, which for the sake of the snippet it wraps the message in a green box with a black border.

    add_filter('jpcfsm_message_content_loaded', function($message) {
    return '' . $message . '';
    });

    Thank you, once again, and have a nice start of the week.

    • Katie Keith
      February 29, 2016 Reply

      Hi Samuel, thanks for the update - the new version sounds great! Thanks for listening to my feedback and that makes sense about the CSS - I know it can be tricky to build styling options into a plugin, even though it's really helpful for non-technical users.

      • Samuel Elh
        March 1, 2016 Reply

        Yay!!

        You are welcome Katie. I believe bloggers will get to know how to deal with HTML and CSS very quickly using WordPress, besides the support forums and volunteers are always there for help..

        Thanks and have a nice day ~

Please share your thoughts...

Your email address will not be published.