recaptcha logo
In order to prevent robot to register on my wordpress sites, I like to use the plugin WP-reCAPTCHA which used a strong and robust captcha system made by a compagny recently bought by Google.
But the actual plugin have two problems : it add a css file on every page of your site, making it slower to load.
I found a way to correct this problem.
CSS
First we are going to integrate the CSS of the recaptcha in the CSS of our theme.
I don’t know you, but for me the default CSS is just fine, so I grab it and compress it and add it in my css theme file with a comment to remember where it is.
This is the css for version 2.9.7 :
1 | .recaptcha-error{font-size:1.8em;padding-bottom:8px;}.mh-plaintext{background:transparent url(email.png) no-repeat scroll left center;border:medium none;color:#27d;height:16px;padding:2px 2px 4px 20px;}.mh-plaintext a,.mh-plaintext a:hover,.mh-plaintext a:visited,.mh-plaintext a:visited:hover{color:#f70;font-weight:bolder;text-decoration:none;border:0;background-color:transparent !important;}.mh-hyperlinked{background:transparent url(http://energies2demain.appspot.com/images/email.png) no-repeat scroll left center;border:medium none;color:#27d;height:16px;padding:2px 2px 4px 20px;}.mh-hyperlinked a,.mh-hyperlinked a:hover,.mh-hyperlinked a:visited,.mh-hyperlinked a:visited:hover{color:#f70;font-weight:bolder;text-decoration:none;border:0;}.recaptcha-form{width:25em;margin:auto !important;}.recaptcha-options td{vertical-align:top !important;}.which-key label{font-weight:700;}.copyright{text-align:center;font-size:.85em;}.lang-select label,.theme-select label,.lang-select select,.theme-select select{vertical-align:middle !important;} |
After that, we have to edit one file in the plugin. Go in the directory of the plugin and edit wp-recaptcha.php.
Go line 96 and replace
96 97 98 | add_action('wp_head', 're_css'); // include the stylesheet in typical pages to style hidden emails add_action('admin_head', 're_css'); // include stylesheet to style options page add_action('login_head', 'registration_css'); // include the login div styling, embedded |
by
96 97 98 | //add_action('wp_head', 're_css'); // include the stylesheet in typical pages to style hidden emails //add_action('admin_head', 're_css'); // include stylesheet to style options page //add_action('login_head', 'registration_css'); // include the login div styling, embedded |
This is prevent the plugin to add a css file to load.
The problem with this technique is that if the author of the plugin update it, you have to modify the file again. And if the code is not the same …
That’s why on every update of the plugin, I check if nothing is broken and by security I replace the CSS of my theme by the one in the new version of the plugin. This not going to make your website way faster, but it helps !
Pingback: Performance of thomas-genin.com | Thomas GENIN