{"id":2615,"date":"2020-04-23T14:45:43","date_gmt":"2020-04-23T18:45:43","guid":{"rendered":"https:\/\/agileadam.com\/?p=2615"},"modified":"2020-04-23T15:07:03","modified_gmt":"2020-04-23T19:07:03","slug":"overriding-a-webform-confirmation-message-in-drupal-8","status":"publish","type":"post","link":"https:\/\/agileadam.com\/2020\/04\/overriding-a-webform-confirmation-message-in-drupal-8\/","title":{"rendered":"Overriding a Webform Confirmation Message in Drupal 8"},"content":{"rendered":"<p>There are a few reasons you may need to override a <a href=\"https:\/\/www.drupal.org\/project\/webform\">webform<\/a> confirmation:<\/p>\n<ul>\n<li>Out of the box webform doesn&#8217;t allow you to add some tags (e.g., &lt;button&gt;) to a webform confirmation message. When you save it strips them out.<\/li>\n<li>What if you needed to alter the webform message based on the values submitted in the webform?<\/li>\n<li>What if you needed to alter the webform message based on where the user saw the webform?<\/li>\n<li>etc&#8230;<\/li>\n<\/ul>\n<p>Thankfully, you can use a standard preprocess hook to override the confirmation output.<\/p>\n<p>In this particular example I needed to override the output of the message to include a button tag. I needed this to only happen if specific GET params had specific values.<\/p>\n<p>First, I modified the confirmation message settings as shown here:<!--more--><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter size-full wp-image-2617\" src=\"https:\/\/agileadam.com\/wp-content\/uploads\/2020\/04\/Screenshot_2020-04-23_14-39-32.png\" alt=\"\" width=\"856\" height=\"639\" srcset=\"https:\/\/agileadam.com\/wp-content\/uploads\/2020\/04\/Screenshot_2020-04-23_14-39-32.png 856w, https:\/\/agileadam.com\/wp-content\/uploads\/2020\/04\/Screenshot_2020-04-23_14-39-32-300x224.png 300w, https:\/\/agileadam.com\/wp-content\/uploads\/2020\/04\/Screenshot_2020-04-23_14-39-32-768x573.png 768w\" sizes=\"(max-width: 856px) 100vw, 856px\" \/><\/p>\n<p>I like to leave helpful hints for the site administrators wherever possible. Because I&#8217;m overriding this field anyway, it is useful to explain what&#8217;s happening. The administrator will know the message is being overridden by <span class=\"lang:php decode:true crayon-inline \">mymodule_preprocess_webform_confirmation()<\/span>\u00a0.<\/p>\n<p>Next, I wrote the code. In my case it ended up looking something like this:<\/p>\n<pre class=\"lang:php decode:true \">\/**\r\n * Implements hook_preprocess_HOOK().\r\n *\/\r\nfunction mymodule_preprocess_webform_confirmation(&amp;$vars) {\r\n  if ($vars['webform']-&gt;id() == 'rate_workshop') {\r\n    $request = \\Drupal::request()-&gt;query;\r\n    $display_mode = $request-&gt;get('display_mode');\r\n    $rate_type = $request-&gt;get('rate_type');\r\n    if ($rate_type === 'complete' &amp;&amp; $display_mode === 'overlay') {\r\n      $markup = t('Thank you for your feedback.') . '&lt;br\/&gt;&lt;br\/&gt;';\r\n      $markup .= '&lt;button class=\"overlay-only\"&gt;';\r\n      $markup .= t('Explore more of this workshop');\r\n      $markup .= '&lt;\/button&gt;';\r\n      $vars['message']['#allowed_tags'] = ['br', 'button'];\r\n    }\r\n    else {\r\n      $markup = t('Thank you for your feedback.');\r\n    }\r\n\r\n    $vars['message']['#markup'] = $markup;\r\n  }\r\n}<\/pre>\n<p>Until I set the #allowed_tags element I was unable to get the button tag to render (Drupal was stripping it out and just showing the text).<\/p>\n<p>Finally, I cleared the caches and tested the solution. Success!<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>There are a few reasons you may need to override a webform confirmation: Out of the box webform doesn&#8217;t allow you to add some tags (e.g., &lt;button&gt;) to a webform confirmation message. When you save it strips them out. What if you needed to alter the webform message based on the values submitted in the webform? What if you needed to alter the webform message based on where the user saw the webform? etc&#8230; Thankfully, you can use a standard preprocess hook to override the confirmation output. In this particular example I needed to override the output of the message to include a button tag. I needed this to only happen if specific GET params had specific values. First, I modified the confirmation message settings as shown here:<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[79],"tags":[84,300,58],"_links":{"self":[{"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/posts\/2615"}],"collection":[{"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/comments?post=2615"}],"version-history":[{"count":5,"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/posts\/2615\/revisions"}],"predecessor-version":[{"id":2622,"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/posts\/2615\/revisions\/2622"}],"wp:attachment":[{"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/media?parent=2615"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/categories?post=2615"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/agileadam.com\/wp-json\/wp\/v2\/tags?post=2615"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}