I am trying to embed some forms using react helmet.
My code looks like this:
<Helmet>
<script type="text/javascript">
{var FORMID;
(function(d, t) {
var s = d.createElement(t), options = { 'userName':'USERNAME', 'formHash':'FORMID', 'autoResize':true, 'height':'751', 'async':true, 'host':'wufoo.com', 'header':'show', 'ssl':true };
s.src = ('https:' == d.location.protocol ?'https://':'http://') + 'secure.wufoo.com/scripts/embed/form.js';
s.onload = s.onreadystatechange = function() {
var rs = this.readyState;
if (rs) if (rs != 'complete') if (rs != 'loaded') return;
try {
FORMID = new WufooForm();
FORMID.initialize(options);
FORMID.display();
} catch (e) { }
};
var scr = d.getElementsByTagName(t)[0], par = scr.parentNode;
par.insertBefore(s, scr);
})(document, 'script');}
</script>
</Helmet>
The script is a copy and paste from wufoo form builder. (I replaced the username and form id with the all caps FORMID and USERNAME).
I keep running into errors. Right now this will produce a graphql error (there is not graphql in the page)
There was a problem parsing "/../my-page"; any GraphQL
fragments or queries in this file were not processed.
This may indicate a syntax error in the code, or it may be a file type
that Gatsby does not know how to parse.
and a Module build failed
error.
In VS code I get some warnings on the var's saying expression expected
. And some other spots where it expects a { or a }. I'm pretty certain the brackets all match up. Again, it's copy and paste from wufoo and this works in plain html/js.
Wrap your script with backticks (`
):
<Helmet>
<script type="text/javascript">
{`var FORMID;
(function(d, t) {
var s = d.createElement(t), options = { 'userName':'USERNAME', 'formHash':'FORMID', 'autoResize':true, 'height':'751', 'async':true, 'host':'wufoo.com', 'header':'show', 'ssl':true };
s.src = ('https:' == d.location.protocol ?'https://':'http://') + 'secure.wufoo.com/scripts/embed/form.js';
s.onload = s.onreadystatechange = function() {
var rs = this.readyState;
if (rs) if (rs != 'complete') if (rs != 'loaded') return;
try {
FORMID = new WufooForm();
FORMID.initialize(options);
FORMID.display();
} catch (e) { }
};
var scr = d.getElementsByTagName(t)[0], par = scr.parentNode;
par.insertBefore(s, scr);
})(document, 'script');`}
</script>
</Helmet>