Physical Address
304 North Cardinal St.
Dorchester Center, MA 02124
Η διαδικασία της διόρθωσης του κώδικα μίας ιστοσελίδας, ώστε αυτή να είναι συμβατή με τα πρότυπα WCAAG για ΑΜΕΑ, πολλές φορές μπορεί να αποδειχθεί επώδυνη. Ένα κοινό σφάλμα που καλούμαστε να αντιμετωπίσουμε, είναι το εξής: Το Google Recaptcha V2 δημιουργεί ένα textarea το οποίο είναι κενό. Το error μας λέει:
textarea is empty. This is because no label is associated with the text area or an aria-label attribute isn’t added to the textarea
Το σφάλμα αυτό σημαίνει ότι πρέπει να επέμβουμε με κώδικα (JavaScript) ώστε να ορίσουμε το aria-label. Παρακάτω παραθέτω τον κώδικα που πρέπει να προστεθεί στο callback, εκεί που καλούμε το api της google για το recaptcha.
<script>
function onloadCallback() {
$('#g-recaptcha-response').attr('aria-hidden', true);
$('#g-recaptcha-response').attr('aria-label', 'do not use');
$('#g-recaptcha-response').attr('aria-readonly', true);
}
</script>
<script src='https://www.google.com/recaptcha/api.js?onload=onloadCallback'></script>Στην περίπτωση που η ιστοσελίδα μας είναι σε WordPress, τότε, αρκεί να προσθέσουμε στο child theme στο functions.php τον εξής κώδικα:
function wpb_hook_javascript() {
?>
<script>
jQuery(document).ready(function(){
setTimeout(function(){
jQuery('#g-recaptcha-response-100000').prepend('<label for="g-recaptcha-response-100000" class="hidden">captcha</label>');
jQuery('.g-recaptcha-response').attr('aria-hidden', true);
jQuery('.g-recaptcha-response').attr('aria-label', 'do not use');
jQuery('.g-recaptcha-response').attr('aria-readonly', true);
}, 3000);
});
var intervalID = window.setInterval(myCallback, 50);
function myCallback() {
//console.log(bothElements[1]);
var textAreaCheck = document.getElementsByClassName('g-recaptcha-response');
if (textAreaCheck.length > 0) {
jQuery(textAreaCheck).attr('aria-label', 'do not use');
//console.log(jQuery(textAreaCheck));
clearInterval(intervalID);
}
}
/* setTimeout(function(){
var bothElements = document.querySelectorAll("[id='security-login-forgot_wd']");
bothElements[0].id = 'security-login-forgot_wd1';
},3000);*/
</script>
<?php
}
add_action('wp_head', 'wpb_hook_javascript');Εάν αντιμετωπίζετε οποιοδήποτε θέμα με ΕΣΠΑ πιστοποίηση και AMEA Validations, μην διστάσετε να αφήσετε ένα σχόλιο είτε να επικοινωνήσετε απευθείας.
