diff --git a/README.md b/README.md index 8dc9578..6f7169e 100644 --- a/README.md +++ b/README.md @@ -39,7 +39,7 @@ render( ref="recaptcha" sitekey="Your client site key" onChange={onChange} - />, + />, document.body ); ``` @@ -58,6 +58,14 @@ Other properties can be used to customised the rendering. | onExpired | func | *optional* callback when the challenge is expired and has to be redone by user. By default it will call the onChange with null to signify expired callback. | | stoken | string | *optional* set the stoken parameter, which allows the captcha to be used from different domains, see [reCAPTCHA secure-token] | +In order to translate the reCaptcha widget you should create a global variable configuring the desire language, if you don't provide it reCaptcha will pick up the user's interface language. + +``` +window.recaptchaOptions = { + lang: 'fr' +} +``` + ## Component API The component also has some utility functions that can be called. @@ -86,7 +94,7 @@ render( sitekey="Your client site key" onChange={onChange} grecaptcha={grecaptchaObject} - />, + />, document.body ); ``` diff --git a/src/recaptcha-wrapper.js b/src/recaptcha-wrapper.js index f723e37..5bedb2f 100644 --- a/src/recaptcha-wrapper.js +++ b/src/recaptcha-wrapper.js @@ -2,7 +2,10 @@ import ReCAPTCHA from "./recaptcha"; import makeAsyncScriptLoader from "react-async-script"; const callbackName = "onloadcallback"; -const URL = `https://www.google.com/recaptcha/api.js?onload=${callbackName}&render=explicit`; +const lang = typeof window !== "undefined" && (window.recaptchaOptions && window.recaptchaOptions.lang) ? + "&hl=" + window.recaptchaOptions.lang : + ""; +const URL = `https://www.google.com/recaptcha/api.js?onload=${callbackName}&render=explicit${lang}`; const globalName = "grecaptcha"; export default makeAsyncScriptLoader(ReCAPTCHA, URL, {