Contact Form not working

Hi!

When upgrading from WordPress 4.9 to 5.8 our SVG button stopped working. The code being used on the back-end in Contact Form:

<div class=”contact_us__form__row”>
<button type=”submit” class=’button button–white’><span class=”button__label”>Verzenden</span><!–?xml version=”1.0″ encoding=”utf-8″?–><svg version=”1.1″ xmlns=”https://www.w3.org/2000/svg&#8221; xmlns:xlink=”https://www.w3.org/1999/xlink&#8221; x=”0px” y=”0px” viewBox=”0 0 240 55″ style=”enable-background:new 0 0 240 55;” xml:space=”preserve” width=”240px” height=”55px”><style type=”text/css”>.rectangle {fill: #FEBC0A;}.border {fill: #3C3C3B;}.rectangle-background {fill: rgba(255, 255, 255, 0);transition: all 0.4s ease-in-out;}</style><g class=”svg-button”><path class=”rectangle” d=”M233,7v41H7V7H233 M235,5H5v45h230V5L235,5z”></path><path class=”border” d=”M229,1v9v1h1h9v33h-9h-1v1v9H11v-9v-1h-1H1V11h9h1v-1V1H229 M230,0H10v10H0v35h10v10h220V45h10V10h-10V0L230,0z”></path><rect class=”rectangle-background” x=”5″ y=”5px” height=”45px” width=”230px”></rect></g></svg></button>
</div>

On the live site, the code changes. <style> is not within the SVG code anymore and also the g class is seperated. <br> is added.

<div class=”contact_us__form__row”>
<button type=”submit” class=”button button–white”><span class=”button__label”>Verzenden</span><!–?xml version=”1.0″ encoding=”utf-8″?–><svg version=”1.1″ xmlns=”https://www.w3.org/2000/svg&#8221; xmlns:xlink=”https://www.w3.org/1999/xlink&#8221; x=”0px” y=”0px” viewBox=”0 0 240 55″ style=”enable-background:new 0 0 240 55;” xml:space=”preserve” width=”240px” height=”55px”></svg><br>
<style type=”text/css”>.rectangle {fill: #FEBC0A;}.border {fill: #3C3C3B;}.rectangle-background {fill: rgba(255, 255, 255, 0);transition: all 0.4s ease-in-out;}</style>
<p><g class=”svg-button”>
<path class=”rectangle” d=”M233,7v41H7V7H233 M235,5H5v45h230V5L235,5z”></path>
<path class=”border” d=”M229,1v9v1h1h9v33h-9h-1v1v9H11v-9v-1h-1H1V11h9h1v-1V1H229 M230,0H10v10H0v35h10v10h220V45h10V10h-10V0L230,0z”></path><rect class=”rectangle-background” x=”5″ y=”5px” height=”45px” width=”230px”></rect></g></p></button>
</div>

Why does it do it and how can we resolve this?

Thanks!

• This topic was modified 3 years, 2 months ago by thijsvanhal.