reCAPTCHA.net のキャプチャ サービスを使用しようとしていますが、カスタム翻訳 ( https://developers.google.com/recaptcha/docs/customization#i18n )を使用したいと考えています。 . また、標準のテーマの 1 つを使用するのではなく、キャプチャの外観を自分のサイトに合わせて完全にカスタマイズしたいと考えています。
以下は私が試しているもののスニペットですが、面白い理由で機能していません (テキストは翻訳されずに英語のままです)。「別のキャプチャを取得」、「オーディオ キャプチャを取得」、「ヘルプ」などのテキスト リンクが翻訳されるかどうか疑問に思っていました。私の理解が正しければ、custom_translations 属性に設定した文字列に応じて、これらは翻訳されるはずです。また、テキスト リンクのコンテンツをテキストではなくアイコンに置き換えた場合、アイコンは適切なコンテンツの ALT タグを自動的に取得しますか?
たとえば、これを変更すると、次のようになります。
<div class="recaptcha_only_if_image"><a href="javascript:Recaptcha.switch_type('audio')">Get an audio CAPTCHA</a></div>
これに対して、画像の alt タグが自動的に事前入力され、アイコンにカーソルを合わせると「オーディオ キャプチャを取得」と表示されますか?
<div class="recaptcha_only_if_image"><a href="javascript:Recaptcha.switch_type('audio')"><img height="16" width="16" src="audio.gif" alt="" /></a></div>
「theme : 'red」などの標準テーマの 1 つを選択しようとしたときに、言語に応じて alt タグが自動的に翻訳されていたため、この質問をしています。
これが私のコードのスニペットです。以下から公開鍵を削除しました。
JS :
<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', // Unavailable while writing this code (just for audio challenge)
theme : 'custom', // Make sure there is no trailing ',' at the end of the RecaptchaOptions dictionary
custom_theme_widget: 'recaptcha_widget'
};
</script>
HTML
<div id="recaptcha_widget" style="display:none">
<div id="recaptcha_image"></div>
<div class="recaptcha_only_if_incorrect_sol" style="color:red">Incorrect please try again</div>
<span class="recaptcha_only_if_image">Enter the words above:</span>
<span class="recaptcha_only_if_audio">Enter the numbers you hear:</span>
<input type="text" id="recaptcha_response_field" name="recaptcha_response_field" />
<div><a href="javascript:Recaptcha.reload()">Get another CAPTCHA</a></div>
<div class="recaptcha_only_if_image"><a href="javascript:Recaptcha.switch_type('audio')">Get an audio CAPTCHA</a></div>
<div class="recaptcha_only_if_audio"><a href="javascript:Recaptcha.switch_type('image')">Get an image CAPTCHA</a></div>
<div><a href="javascript:Recaptcha.showhelp()">Help</a></div>
</div>
<script type="text/javascript"
src="http://www.google.com/recaptcha/api/challenge?k=MY_PUBLIC_KEY">
</script>
<noscript>
<iframe src="http://www.google.com/recaptcha/api/noscript?k=MY_PUBLIC_KEY"
height="300" width="500" frameborder="0"></iframe><br>
<textarea name="recaptcha_challenge_field" rows="3" cols="40">
</textarea>
<input type="hidden" name="recaptcha_response_field"
value="manual_challenge">
</noscript>
結果のスクリーンショットも添付しています。