Si, como millones de usuarios de WordPress, tu plugin de formularios de contacto es Contact Form 7, seguramente habrás observado que de lo único que peca es de que en según qué situaciones puede ralentizar la carga de tu web, así que vamos a ponerle solución.
Cargar selectivamente Contact Form 7
El principal problema, en cuanto a la carga se refiere, que tiene el plugin Contact Form 7 y la mayoría de plugins, es que carga todos sus estilos y scripts globalmente en tu web, da igual si hay un formulario o no en cada página.
Esto, que es comprensible, pues el desarrollador no sabe dónde vas a poner un formulario, supone un lastre en la carga de páginas y entradas que no mostrarán formulario alguno pero que, sin embargo, si que se cargará en ellas todo el CSS y JavaScript del plugin.
Imagina, pues, una web con 20 páginas y 500 entradas en la que solo una de las páginas tiene formulario. Lo que obtendrás es que los estilos y scripts de Contact Form 7 se cargarán en todas ellas, da igual si tienen formulario o no.
La solución pasa por registrar estilos y scripts solo en las páginas o entradas en las que hay formulario.
No registrar estilos CSS de Contact Form 7
Para no registrar (deregister) los estilos de Contact Form 7 en cualquier página o entrada que no sea en la que sí hay un formulario solo tenemos que saber el slug de la página con formulario, y anularlos en el resto, así:
// Deregister estilos CSS de Contact Form 7 en las páginas sin formulario add_action( 'wp_print_styles', 'ayudawp_deregister_styles', 100 ); function ayudawp_deregister_styles() { if ( ! is_page( 'contacto' ) ) { wp_deregister_style( 'contact-form-7' ); } }
Este código hay que ponerlo en tu plugin de personalizaciones o al final del archivo functions.php del tema activo (mejor si es el tema hijo).
Lo que hace el código es comprobar si la página no es la que tiene el slug contacto, en cuyo caso des-registra los estilos de Contact Form 7 mediante la función de WordPress wp_deregister_style.
No registrar el JavaScript de Contact Form 7
Para des-registrar el JavaScript en las páginas que no tengan formulario haremos casi lo mismo, pero en esta ocasión con la función wp_deregister_script. Siguiendo el ejemplo anterior sería así:
// Deregister JavaScrip de Contact Form 7 en las páginas sin formulario add_action( 'wp_print_scripts', 'ayudawp_deregister_javascript', 100 ); function ayudawp_deregister_javascript() { if ( ! is_page( 'contacto' ) ) { wp_deregister_script( 'contact-form-7' ); } }
Por supuesto, acuérdate de guardar cambios en tu plugin de personalizaciones o archivo functions.php, el que hayas elegido para añadir estas funciones.
¿Y si tengo formularios en varias páginas?
Buena pregunta. No hay problema, entonces adaptaremos el código para incluir los slugs de todas las páginas que tengan formulario.
Lo único es modificar la línea que busca la condición is_page, y que modificarla indicando el array de slugs en vez de uno único. Por ejemplo:
if ( ! is_page( array( 'nosotros', 'contacto' ) ) {
Cómo localizar los slugs de tus páginas con formularios
Si no sabes dónde localizar los slugs de tus páginas solo tienes que ir a la ventana de administración de entradas o páginas y hacer clic en cualquiera de ellas en Edición rápida y copiar de ahí el slug.
Carga selectiva de Contact Form 7 localizando el shortcode
Como ya sabrás, el plugin Contact Form 7 mostrará tus formularios donde encuentre un shortcode que empiece con [contact-form-7
, así que otro modo mediante el que podemos cargar estilos y scripts es localizando en tus contenidos esta cadena y des-registrando estilos y scripts en el resto.
Solo tendríamos que crear una función así:
//Quitando scripts y estilos de CF7 donde no haya shortocode function ayudawp_deregister_cf7() { global $post; if ( ! has_shortcode( $post->post_content, 'contact-form-7' ) ) { remove_action('wp_enqueue_scripts', 'wpcf7_do_enqueue_scripts'); } } add_action( 'wp_enqueue_scripts', 'ayudawp_deregister_cf7', 2 );
Lo que hace el código anterior es anular las acciones por las que Contact Form 7 carga estilos y scripts.
Un modo alternativo de conseguir lo mismo sería así:
//Deregister estilos y scripts CF7 donde no esté el shortcode if (!function_exists('rc_dequeue_scripts_styles')) { function ayudawp_dequeue_scripts_styles() { if ( WPCF7_LOAD_JS && WPCF7_LOAD_CSS ) { global $post; if ( !strpos($post->post_content, '[contact-form-7') ) { wp_dequeue_script('contact-form-7'); wp_dequeue_style('contact-form-7'); } } } add_action( 'wp_enqueue_scripts', 'ayudawp_dequeue_scripts_styles' ); }
No cargar nada de CSS ni JavaScript de Contact Form 7
Si, por cualquier motivo, en algún momento quieres anular completamente la carga de los estilos y scripts de Contact Form 7 puedes definir unas nuevas constantes en tu archivo wp-config.php, estas:
define ('WPCF7_LOAD_JS', false); // false Desactiva carga de JS define ('WPCF7_LOAD_CSS', false); // false Desactiva carga de CSS
Esto puede ser interesante en entornos de desarrollo, por ejemplo.
¿Se puede hacer con plugins?
Te diré que sí, pero el asunto es que el único disponible para esto básicamente lo que te pide es el condicional sobre el que no se aplicará, que tienes que conocer y aplicar, así que viene a ser lo mismo que hacíamos con los primeros códigos.
Si te apetece probarlo, se llama Script Logic.
El problema con el refill de Contact Form 7
Hace unos meses surgió un problema de optimización por el cual los habituales medidores de velocidad web como GTMetrix mostraban importantes retardos de carga de página a causa de la siguiente cadena:
/wp-json/contact-form-7/v1/contact-forms/13891/refill
El problema ocurría donde tuvieses cargada caché de página con algún plugin, por lo que el contenido activo como el reCAPTCHA integrado de Contact Form 7 necesita actualizarse en cada carga de página, generando una llamada al famoso refill.
Si aún tienes este problema puedes solucionarlo de dos maneras:
Actualiza
Desde la versión 7.4.9.2, de diciembre de 2017, este problema se ha solucionado, así que actualiza.
Anula manualmente la caché de página del plugin
Aunque ya sabes que nunca recomiendo modificar archivos propios de plugins, temas o WordPress, si por otro motivo no puedes actualizar, y no usas ningún tipo de CAPTCHA, localiza el archivo includes/controller.php y anula (comenta) o borra estas líneas:
if ( defined( 'WP_CACHE' ) && WP_CACHE ) { $wpcf7['cached'] = 1; }
¿Y por qué mejor no cambio de plugin?
Tú mismo, pero Contact Form 7 es el plugin con un desarrollo más continuado, que más se actualiza para ir mejorando, y con un ecosistema más amplio, debido a los cientos de extensiones que lo mejoran.
Lo único es que si te provoca algún problema de retardo de carga de páginas ya sabes cómo solucionarlo.
Esto que lees es un contenido original de Ayuda WordPress - Recursos, themes, plugins y tutoriales en español y lo publicó Fernando primero aquí: Cómo optimizar Contact Form 7