Home › Forums › Themes Support › Claue-Shopify › Contact form recaptcha JS error and not all fields submitted
- This topic has 17 replies, 5 voices, and was last updated 6 years, 3 months ago by I Love Shopify.
-
AuthorPosts
-
-
August 8, 2018 at 6:21 pm #23700
Hi,
When a user has submitted the contact form and the recaptcha challenge is supposed to show up, it does not render and a JS error is logged to the console.
I have changed the theme to Debut to double check if it is a problem with the theme. The recaptcha renders correctly with the Debut theme.
Also not all the form field values are sent to the email.
Please advise how I can fix this issue.
Regards,
Tim Pacheco -
August 9, 2018 at 6:27 pm #23715
This is caused by the theme’s minify HTML setting.
The reCaptcha relies on a function written in the HTMLThe theme’s minify setting causes this entire function (below) to be commented out as all whitespace is removed by minify.
This issue will, by default, effect all sites using this theme as the default setting is to minify the HTML.//<![CDATA[
var recaptchaCallback = function() {
grecaptcha.render(‘g-recaptcha’, {
sitekey: “####”,
size: (window.innerWidth > 320) ? ‘normal’ : ‘compact’,
callback: ‘onCaptchaSuccess’,
});
};var onCaptchaSuccess = function() {
var event;try {
event = new Event(‘captchaSuccess’, {bubbles: true, cancelable: true});
} catch (e) {
event = document.createEvent(‘Event’);
event.initEvent(‘captchaSuccess’, true, true);
}window.dispatchEvent(event);
}//]]>
-
August 10, 2018 at 9:59 pm #23740
I’ve got the same issue. Not all the form field values are sent to the email, like name and message. Please kindly advise how I can fix this issue.
-
August 11, 2018 at 5:50 pm #23748
Try going to Themes > Customise Theme > Theme Settings > General and then untick ‘Minify HTML code’.
Seems to have fixed both issues for me.-
August 11, 2018 at 7:57 pm #23750
Hey guys, on a similar note that may be of use to you as you work within this template, I realized that any additions or changes (ie function speeds) made to .js must be also made to the .min.js file as that is what is called upon in theme.liquid. I use this tool to minify .js so that I can then add it to the claue.min.js.liquid file :
https://javascript-minifier.com/ – paste un-minified .js on the left, click the button and the output on the right will then need to be included in the claue.min.js.liquid file.
I also unchecked minify html way back after it jacked up everything on my site when I updated to a newer version about 6 weeks ago.
-
-
-
August 13, 2018 at 8:57 pm #23823
Hi you guys,
We’re so sorry for the late response. We have fixed this problem even you enable HTML minify feature. A new version includes bug fixes will be released today. Please kindly stay tuned.
-
August 14, 2018 at 5:45 pm #23835
Hi,
Please can you tell me exactly what I need to change from the new update?
I am having all of the issues mentioned above – recaptcha and name/message not showing up.
My theme is now heavily edited so blanket updates are not possible.
Many thanks,
-
August 14, 2018 at 6:01 pm #23836
Hey – I’ve been using the Claue template since v. 1.0 and at this point mine too is very heavily customized and edited. To incorporate updates made to versions 1.05, 1.06 and 1.07 I have used this tool :
https://www.diffchecker.com/diff
Each time an update is released you have to download the new package, upload it to your store and in one browser tab be in the “edit code” section of the new, unedited version and in another browser tab be in the “edit code” section of your working, modified version.
Then look at the changlog which can be found here :
http://shopify.janstudio.net/claue/document/#changelog
Open each file listed under ‘File changes’ in both the newest, unedited version of Claue AND in your edited version, cut and paste the code from both into Diff Checker (new code on the left, your modified code on the right) and click the button at the bottom of the page that says “Find Difference!”. That will tell you what the JanStudio guys have changed while it will also highlight the additions that you have made to your file in green. Key in on anything in red on the left and if it isn’t something that you purposely removed previously, that is what they have added and what you will want to add to your modified file.
A tip: pay attention to line items and copy and paste code from the actual liquid files open in your other browser tabs NOT from the code in Diff Checker.
It’s pretty simple but can be time consuming but unfortunately it is the only way to update Shopify themes where the liquid and html files have been modified previously.
Hope that helps.
Ryan
-
-
August 14, 2018 at 10:08 pm #23845
Hi Ryan,
Thank you so much for your tutorial, it’s very helpful.
@I Love Shopify
If you don’t want to compare the file like as Ryan’s tutorial, please open layout/theme.liquid file and find line 79
Change
{% if settings.minify_html %}
to
{% if settings.minify_html and page_title != 'Challenge' and template != 'customers/addresses' %}
-
September 11, 2018 at 10:10 am #24651
Thanks for everyone’s help.
Foster, I have tried the above and nothing changes. All that comes through is the customer’s email address. Any ideas?
-
September 16, 2018 at 3:37 pm #24778
Hi @I Love Shopify
Can you provide me your store URL? I will send you a store access request so I can take a closer look at this issue.
-
September 16, 2018 at 3:59 pm #24783This reply has been marked as private.
-
September 18, 2018 at 11:01 pm #24823
Hi,
Sorry for the late response. I have fixed the problem for you @I Love Shopify, please check.
-
September 19, 2018 at 3:22 am #24835
Hi Foster,
Thank you. However, I have just tested it and it is still not working. All that comes through is phone number and email address. Any ideas?
thanks,
Andy
-
September 22, 2018 at 1:28 pm #24948
Hi,
I have just checked again and I saw your theme is outdated version, please upgrade to the latest version to fix this issue. Refer our documentation here http://shopify.janstudio.net/claue/document/#2-updating-the-theme
-
September 22, 2018 at 1:35 pm #24950
Hi Foster,
I have updated the theme as best as I can. If I have missed any bits please can you add them?
I can’t figure out which bits of updated code should fix the contact form?
thanks,
Andy
-
September 22, 2018 at 1:45 pm #24951
I think the problem was solved, please see this video http://take.ms/wKNQG
-
September 22, 2018 at 1:46 pm #24952
The message and name is still not coming through. I replied to your email so you can see.
-
-
AuthorPosts
The topic ‘Contact form recaptcha JS error and not all fields submitted’ is closed to new replies.