Site icon Osclass Documentation & Knowledge Base

Customizing the theme and language of reCAPTCHA

This article is outdated as v1 recaptcha is mostly not in use anymore

Introduction

This customization will show you how to adjust the way reCAPTCHA is displayed on your site. You are able to change both the theme and the language reCAPTCHA is displayed in.

‘red’ (default theme)‘white’
‘blackglass’‘clean’

Changing the theme

To change the reCAPTCHA theme within Osclass, you must edit any of your theme files that use reCAPTCHA, such as item-post.phpitem-edit.php and user-register.php.

In each file, find this code for showing reCAPTCHA:

<?php osc_show_recaptcha(); ?>


Then, place this code anywhere BEFORE the above code:

<script type="text/javascript">
 var RecaptchaOptions = {
    theme : 'theme_name'
 };
 </script>


Lastly, change the text ‘theme_name’ in the above code to any of the 4 theme options shown above. That’s it!

Changing the language

Changing the reCAPTCHA language is almost exactly the same as changing the theme, so perform the same steps as shown above. The only difference is instead of this code:

theme : 'theme_name'

we use this:

lang : 'fr'


The above setting would set the language as French. In context, the complete code looks like this:

<script type="text/javascript">
var RecaptchaOptions = {
   lang : 'fr'
};
</script>


These are the supported languages you can use:

LanguageCode
Englishen
Dutchnl
Frenchfr
Germande
Portuguesept
Russianru
Spanishes
Turkishtr

Custom Translations

If the language you need isn’t available or you wish to modify the translations of the existing supported languages, you can make your own custom translations. The below code shows you exactly how. Each of the custom_translations parameters are optional. You can specify one parameter or all of them. For any that you don’t specify, the default translation will be used. Unless otherwise specified, English is the default language.

This code shows a modified translation for Italian:

<script type="text/javascript">
        var RecaptchaOptions = {
                custom_translations : {
                        instructions_visual : "Scrivi le due parole:",
                        instructions_audio : "Trascrivi ci\u00f2 che senti:",
                        play_again : "Riascolta la traccia audio",
                        cant_hear_this : "Scarica la traccia in formato MP3",
                        visual_challenge : "Modalit\u00e0 visiva",
                        audio_challenge : "Modalit\u00e0 auditiva",
                        refresh_btn : "Chiedi due nuove parole",
                        help_btn : "Aiuto",
                        incorrect_try_again : "Scorretto. Riprova.",
                },
                lang : 'it', // optional
                theme : 'red' // optional
        };
</script>

Using multiple options

You can of course apply both theme and language options, like this:

<script type="text/javascript">
var RecaptchaOptions = {
   theme : 'theme_name',
   lang : 'fr'
};
</script>

Advanced settings

You can create and use your own custom theme with reCAPTCHA. There are also other miscellaneous settings and options that can be adjusted.

For more information on any “advanced” settings, please see the official Google documentation on customizing reCAPTCHA: Customizing the Look and Feel of reCAPTCHA