Ok so you’ve got a form, but it doesn’t appear? or you’ve got this older form available that works?
This form seems to have recaptcha added.
First, the problem of code not appearing but text appearing. In the resource, go to settings and uncheck ‘richtext’. That will allow your code to be parsed.
Then, try sticking this code in the resource and see if the form appears.
[[!FormItBuilder_BasicExample]]
That’s a snippet call to your form, let’s get it appearing first then go from there.
Hi,
Thank you for the reply.
The form and page shows and works fine, I can fill it in and email no problem. But there’s no anti-spam measures at all? So the owners are being inundated with spam.
I have a lot to sort out on the site but this is the first priority.
I’ve cleaned up anything I left lying around from trying to test it and now the leftover text is gone. Thank you.
So I installed reCAPTCHA mod and just don’t know what more to do from here.
I tried calling it in this area of code which is on the template ;
<div id="text_area">
<h1>[[*longtitle]]</h1>
[[*pre-code]]
[[*content]]
[[*post-code]]
[[$html-back-to-top]]
</div><!-- close text_area -->
but nothing happens unfortunately.
&hooks=`recaptchav2`
[[!recaptchav2_render]]
[[!+fi.error.recaptchav2_error]]
PS the site is using MODX Revolution 2.2.6-pl (traditional) - is that an issue?
Ah yes, you should update, we’ve had an attack not too long ago on older sites, please update asap.
Then we can work this out. We will be here!
Okay will do. Will it change the layout of the site etc? I have only had the site for a few weeks as a helper, the site is 7 years old. I knew it was out of date, but am anxious of updating. (I can get backups though).
Will updating the core software overwrite everything?
Interesting, while downloading everything I see it’s using formITbuilder which is now deprecated.
Would this stop me from adding reCAPTCHA to the page?
Anyway am doing backups as we speak.
Thank you! 
Updating the core does not typically impact any content or templating. 2.2.6 is really old so it is possible you’ll run into some small issues.
It’s recommended to upgrade one minor version at a time until 2.4 - so first upgrade to 2.3.x, then 2.4.x, and from there you can go straight to 2.7. Also upgrade extras to ensure compatibility. It’s possible to use the UpgradeMODX extra to make upgrading quicker/easier.
It looks like the form was built with FormitBuilder, and that has its own way of adding hooks and markup into the form. I haven’t used that before, but there appears to be documentation for it here. Including an example for recaptcha, which might be quite old but could point you in the direction of how to add it.
Hi Mark,
Okay thanks for the info. Indeed as I am slowly ploughing through their site, I am realising just how out of date everything is!
Noted, will take that on board when upgrading. Will test on a local install first to be sure.
Okay thanks, will have a look now. I found the JSON package instructions but not for the deprecated one. Thank you, will try it now.
Modx separates the core from the extras, so no overwriting should happen. Now if an extra is updated, then its default files may/will also be overwritten. That’s why you can use a custom chunk rather than modify a default chunk
Nothing should change, Modx delivers pure html and css, but as you note extras may need to be replaced.
From the looks of that builder, recaptcha should be fairly easy, its just called in the form…there might be credentials but we will get there when the time comes.
I’ve tried adding it again but no joy and incidentally the lines of code mentioned here by @markh were already present;
Recaptcha in contact pages
Okay so I am duplicating the pages and templates and will edit those to see how to fix this.
I have the credentials already and inputted them in system > recaptcha
What I am struggling to now do is get the page to call the template with the newer and correct ways of calling recaptcha.
Frustrating but would this have been possible and is it still possible using this FormitBuilder? Or is that immaterial?
Thanks both for your help thus far.
Hi again,
Okay am on MODX Revolution 2.7.1-pl. She threw a lot of errors and wobbles at me, but I kept cleaning each on up, uninstalling etc etc until it passed through the steps and into the CP.
So I will try again and see what can be done, but any advice from here will be gratefully received please.
Thank you!
Ok good! Now let’s deal with this contact page.
Ok so can you still use that extra, or do you have to build a new one? Contact pages aren’t hard if so.
Just try to update the extra, or maybe re-install it.
I still think we have a bit of a communication/understanding problem, because every code for the form you’ve shown has had at least part of the recaptcha in there, so when you say they have a form and it works…but no recaptcha, that’s a bit odd. I wonder if it could be yet another form.
Pictures always help too.
I def think this issue is quite workable, with Modx some extras require a bit of massaging if you will, but this is pretty standard stuff.
We will be here to help, don’t worry about that. Just try to keep telling us what is/isn’t happening, and where you are codingwise.
So I have a working contact form protected by the recaptcha Extra and all I have is recaptcha being defined in the FormIt Hook
&hooks=`recaptchav2`
and then the submit button is brought in with this snippet:
[[!recaptchav2_render?
&tpl=`recaptchav2_invisible_html`
&form_id=`contact` // enter your form ID
]]
Also do you have the correct API Keys set in the system settings? You want to have a site and a secret key provided by Google in there.
Thanks for the reply! I am slowly getting there, I think… but am having issues no doubt about that.
So this is what I think the structure is;
Contact-us page pulls content from the ‘ContentTemplate’
Under elements, the template has this;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>[[*longtitle]] - [[++site_name]]</title>
<base href="[[++site_url]]" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="www.zoobaweb.co.uk" />
<meta name="description" content="[[*meta-description]]" />
<meta name="keywords" content="[[*meta-keywords]]" />
<meta name="format-detection" content="telephone=no">
<!-- GLOBAL STYLE SHEET -->
<link href="assets/css/global.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="assets/scripts/jquery-1.7.1.min.js"></script>
<!-- Include jQuery Cycyle (Production) -->
<script type="text/javascript" src="assets/scripts/jquery.cycle.lite.js"></script>
<script type="text/javascript">
$(function() {
$('#testimonial_wrapper').cycle();
});
</script>
<style type="text/css">
body {
background:url(assets/images/backgrounds/background.jpg) #4d190e no-repeat;
}
</style>
</head>
<body>
[[$html-facebook]]
<div id="WRAPPER">
<div id="HEADER">
[[$html-header]]
</div><!-- CLOSE HEADER -->
<div id="CONTENT_WRAPPER">
<div id="NAVIGATION">
[[Wayfinder? &sortOrder=`DESC` &sortBy=`menuindex` &startId=`2` &limit=`6`]]
</div><!-- CLOSE NAVIGATION -->
<div id="LEFT_COLUMN">
<div id="text_area">
<h1>[[*longtitle]]</h1>
[[*pre-code]]
[[*content]]
[[*post-code]]
[[$html-back-to-top]]
</div><!-- close text_area -->
</div><!-- CLOSE LEFT_COLUMN -->
<div id="RIGHT_COLUMN">
[[$html-right-sidebar]]
</div><!-- CLOSE RIGHT_COLUMN -->
<div class="clear"></div>
</div><!-- CLOSE CONTENT_WRAPPER -->
</div><!-- CLOSE WRAPPER -->
<!-- jQuery Back to top -->
<script src="assets/scripts/scroll-to-top/jquery.scroll.pack.js" type="text/javascript"></script>
<script src="assets/scripts/scroll-to-top/jquery.easing.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$(".toTop").scrollToTop({speed:1250,ease:"easeInOutCubic"});
});
</script>
</body>
</html>
Sorry don’t know why code-pastes aren’t working correctly. NB I have removed the image filename.
Then in the file template, FormitBuilder_BasicExample, I have this;
<?php
$snippetName='FormItBuilder_BasicExample';
require_once $modx->getOption('core_path',null,MODX_CORE_PATH).'components/formitbuilder/model/formitbuilder/FormItBuilder.class.php';
if (function_exists('FormItBuilder_BasicExample')===false) {
function FormItBuilder_BasicExample(modX &$modx, $snippetName) {
//CREATE FORM ELEMENTS
$o_fe_name = new FormItBuilder_elementText('name_full','Your Name:');
$o_fe_email = new FormItBuilder_elementText('email_address','Email Address:');
$o_fe_contact_number = new FormItBuilder_elementText('contact_number','Contact Number:');
$o_fe_notes = new FormItBuilder_elementTextArea('comments','Detail of Enquiry:',5,30);
$o_fe_captcha = new FormItBuilder_elementReCaptcha('Verification Code');
$o_fe_buttSubmit = new FormItBuilder_elementButton('submit','Submit Form','submit');
//SET VALIDATION RULES
$a_formRules=array();
//Set required fields
$a_formFields_required = array($o_fe_notes, $o_fe_name, $o_fe_email,$o_fe_contact_number);
foreach($a_formFields_required as $field){
$a_formRules[] = new FormRule(FormRuleType::required,$field);
}
//make email field require a valid email address
$a_formRules[] = new FormRule(FormRuleType::email, $o_fe_email, NULL, 'Please provide a valid email address');
//CREATE FORM AND SETUP
$o_form = new FormItBuilder($modx,'contactForm');
$o_form->setHooks(array('spam','recaptcha','email','redirect'));
$o_form->setRedirectDocument(20);
$o_form->addRules($a_formRules);
$o_form->setPostHookName($snippetName);
$o_form->setEmailToAddress('');
$o_form->setEmailFromAddress('');
$o_form->setEmailSubject(' | Enquiry - From: [[+name_full]]');
$o_form->setEmailHeadHtml('<p>This is a response sent by [[+name_full]] using the contact us form:</p>');
$o_form->setJqueryValidation(true);
//ADD ELEMENTS TO THE FORM IN PREFERRED ORDER
$o_form->addElements(
array(
$o_fe_name,$o_fe_email,$o_fe_contact_number,$o_fe_notes,
new FormItBuilder_htmlBlock('<hr class="formSpltter" />'),
$o_fe_buttSubmit
)
);
return $o_form;
}
}
//Run the form construction function above
$o_form = FormItBuilder_BasicExample($modx, $snippetName);
if (isset($outputType) === false) {
//this same snippet was called via various other hooks
return $o_form->processCoreHook($hook, $o_form);
} else {
//Final output for form
return $o_form->output();
}
Snippet screenshots;
Hope this helps, sorry for any formatting issues. I though the </> was for code entries but of course it’s mixed content.
So on the contact form, all is there aside from the reCAPTCHA ‘I am not a robot’ tickbox;
Oh I am sorry I didn’t tell you. For all code, use three single ticks on the line above, and below, the code. The ‘preformatted code’ button doesn’t do it, unfortunately.
Let me check over what you’ve got
Hi,
Yes have both the Google Keys entered…
But, your code looks very different to what I have here.
This is the content template;
https://pastebin.com/1xhJnL5z
This is the HTML;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>[[*longtitle]] - [[++site_name]]</title>
<base href="[[++site_url]]" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="" />
<meta name="description" content="[[*meta-description]]" />
<meta name="keywords" content="[[*meta-keywords]]" />
<meta name="format-detection" content="telephone=no">
<!-- GLOBAL STYLE SHEET -->
<link href="assets/css/global.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="assets/scripts/jquery-1.7.1.min.js"></script>
<!-- Include jQuery Cycyle (Production) -->
<script type="text/javascript" src="assets/scripts/jquery.cycle.lite.js"></script>
<script type="text/javascript">
$(function() {
$('#testimonial_wrapper').cycle();
});
</script>
<style type="text/css">
body {
background:url(assets/images/backgrounds/bkg.jpg) #4d190e no-repeat;
}
</style>
</head>
<body>
[[$html-facebook]]
<div id="WRAPPER">
<div id="HEADER">
[[$html-header]]
</div><!-- CLOSE HEADER -->
<div id="CONTENT_WRAPPER">
<div id="NAVIGATION">
[[Wayfinder? &sortOrder=`DESC` &sortBy=`menuindex` &startId=`2` &limit=`6`]]
</div><!-- CLOSE NAVIGATION -->
<div id="LEFT_COLUMN">
<div id="text_area">
<h1>[[*longtitle]]</h1>
[[*pre-code]]
[[*content]]
[[*post-code]]
[[$html-back-to-top]]
</div><!-- close text_area -->
</div><!-- CLOSE LEFT_COLUMN -->
<div id="RIGHT_COLUMN">
[[$html-right-sidebar]]
</div><!-- CLOSE RIGHT_COLUMN -->
<div class="clear"></div>
</div><!-- CLOSE CONTENT_WRAPPER -->
</div><!-- CLOSE WRAPPER -->
[[$html-footer]]
<!-- jQuery Back to top -->
<script src="assets/scripts/scroll-to-top/jquery.scroll.pack.js" type="text/javascript"></script>
<script src="assets/scripts/scroll-to-top/jquery.easing.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$(".toTop").scrollToTop({speed:1250,ease:"easeInOutCubic"});
});
</script>
[[$html-google]]
</body>
</html>
Ahh sorry. I didn’t know.
Can you please elaborate what you mean by three single ticks please?
I just tried some and the formatting still borked.
Thank you so much for all of your help so far.
Regards
EDIT= damn I’ve been locked for 18 hours for reaching my maximum postings apparently… 
@nuan88 ahhh tilde is it?
I will try now;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>[[*longtitle]] - [[++site_name]]</title>
<base href="[[++site_url]]" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="www.zoobaweb.co.uk" />
<meta name="description" content="[[*meta-description]]" />
<meta name="keywords" content="[[*meta-keywords]]" />
<meta name="format-detection" content="telephone=no">
<!-- GLOBAL STYLE SHEET -->
<link href="assets/css/global.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="assets/scripts/jquery-1.7.1.min.js"></script>
<!-- Include jQuery Cycyle (Production) -->
<script type="text/javascript" src="assets/scripts/jquery.cycle.lite.js"></script>
<script type="text/javascript">
$(function() {
$('#testimonial_wrapper').cycle();
});
</script>
<style type="text/css">
body {
background:url(assets/images/backgrounds/bkg-rhosilli.jpg) #4d190e no-repeat;
}
</style>
</head>
<body>
[[$html-facebook]]
<div id="WRAPPER">
<div id="HEADER">
[[$html-header]]
</div><!-- CLOSE HEADER -->
<div id="CONTENT_WRAPPER">
<div id="NAVIGATION">
[[Wayfinder? &sortOrder=`DESC` &sortBy=`menuindex` &startId=`2` &limit=`6`]]
</div><!-- CLOSE NAVIGATION -->
<div id="LEFT_COLUMN">
<div id="text_area">
<h1>[[*longtitle]]</h1>
[[*pre-code]]
[[*content]]
[[*post-code]]
[[$html-back-to-top]]
</div><!-- close text_area -->
</div><!-- CLOSE LEFT_COLUMN -->
<div id="RIGHT_COLUMN">
[[$html-right-sidebar]]
</div><!-- CLOSE RIGHT_COLUMN -->
<div class="clear"></div>
</div><!-- CLOSE CONTENT_WRAPPER -->
</div><!-- CLOSE WRAPPER -->
[[$html-footer]]
<!-- jQuery Back to top -->
<script src="assets/scripts/scroll-to-top/jquery.scroll.pack.js" type="text/javascript"></script>
<script src="assets/scripts/scroll-to-top/jquery.easing.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$(".toTop").scrollToTop({speed:1250,ease:"easeInOutCubic"});
});
</script>
[[$html-google]]
</body>
</html>
Think that did it?
@vibedesign Okay thanks, didn’t realise there were limiters like so. I understand of course, especially having a few communities myself; but I do also realise it’s a hindrance too - especially if you’ve been working on something for days on end and finally gave up, then realised there was infact somewhere to ask.
Okay so will sit this out and close my 30+ tabs about this I have open, down! 
Thanks all so far for your invaluable help.
@nuan88 Thank you. I tried adding recaptchav2 in the code but still didn’t work, or at least show the field anyway.
I will try again and check now.
Check your notifications, you should have a message from a little friendly robot in there, teaching you the basics. This might also increase your limit.
Oh man, shoot…can you possibly still edit this last post of yours, to add in new stuff? I will make a topic about this issue
Single ticks are like this ` and for me at least its the button to the left of the number one key. I can’t do three in a row, here’s 1 in code
Three ticks above, then below, here is one single tick ===> `
This page should be the best for checking this code. You may want to make a new one just with this code, to see if you can get it to work, with a blank template
https://github.com/sepiariver/recaptchav2
This sample should work right out of the box
<h2>Form Test 1</h2>
[[!FormIt?
&hooks=`recaptchav3,FormItSaveForm`
&validate=`testing1:required:minLength=^12^`
&formName=`form-test-1`
&recaptchav3.token_key=`token-1`
&recaptchav3.action_key=`action-1`
&recaptchav3.threshold=`0.9`
&submitVar=`submit1`
]]
<form action="[[~[[*id]]? &scheme=`full`]]" method="POST">
[[!+fi.error.testing1]]
<input type="text" name="testing1" value="[[!+fi.testing1]]">
<input type="submit" name="submit1" value="submit">
[[!recaptchav3_render?
&tpl=`recaptchav3_html`
&token_key=`token-1`
&action_key=`action-1`
]]
[[!+fi.error.recaptchav3_error]]
</form>
The form would be saved as FormItSaveForm and called as [[!FormItSaveForm]]
The issue we are still having is why it seems to have recaptcha in hooks, but no output.
This example uses recaptchav3. Parameters might still apply, but just to avoid confusions this might not be the right example…
Good point and thanks for your expertise here, it seems to be the same extra
From the doc there, up top
You must generate API keys for your domain here: https://www.google.com/recaptcha/admin and enter them into the System Settings before you can use ReCaptchaV2. IMPORTANT : You must choose V2 or V3 in the ReCaptcha admin, when generating your client keys. You can use both V2 and V3 on a single MODX install with this Extra— there are separate system settings for V2 and V3 .
And…let’s check system settings…filling these in might help
Also! It looks like its called with either a 2 or a 3, your code has no number
Also, do you have a snippet named snippetName?
$o_form->setHooks(array('spam','recaptcha','email','redirect'));
and
function FormItBuilder_BasicExample(modX &$modx, $snippetName)
Ok looking further, so FormitBuilder seems to be depreciated, that’s a problem. We can’t be sure that this will ever work with depreciated tools. Google has probably updated things since.
Here’s the site, the new one is called
Its quite similar, you can use php or json to make the form.
This is an Extra that needs installation. Unfortunately it does not seem to handle recaptcha at all. I hope it can work with the recaptcha2 extra, but I didn’t find anything about that online.
So, perhaps what is happening is you are using not Recaptcha2 Extra, but rather you are trying to call using FormitBuilder.
Now pls understand that I don’t always get things right. Let’s slow down just a bit and let others weigh in.
My thinking is to make a new form with the new formbuilder, just like your old one, but not sure if recaptcha will work with it though. It might be necessary to use another form builder, which people can use formit or SPform is easy and quick…
Indeed, it might be worth considering to just go with a new contact form extra entirely, BobRay makes a great easy solution https://modx.com/extras/package/spform