Santi Navarro
Menu
  • INICIO
  • WORDPRESS
  • SOCIALMEDIA
  • YOUTUBE
  • SEO
  • RECURSOS
  • CONTACTO
Home
Wordpress
Contact Form 7: Carga CSS y JS en las páginas que lo precisen.

Contact Form 7: Carga CSS y JS en las páginas que lo precisen.

En un post anterior ya estuvimos hablando de este maravilloso plugin de Wordpres que nos facilita la creación de un formulario de contacto responsivo para nuestra web o blog. Un plugin de los fundamentales diría.

Bien, pues este plugin como otros realiza la carga de archivos CSS y JS propios que no siempre son necesarios en todas nuestras páginas ya que en realidad sólo es necesario que realice su carga en las páginas en las que tengamos dispuestos formularios.

Como es lógico desearemos que realice la carga allá donde sea necesario. Entonces, ¿qué podemos hacer al respecto?, tranquilos, el objetivo de este post trata de eso mismo.

Como idea apuntamos que al no realizar la carga del CSS y JS que trae el Contact form 7 estaremos optimizando la velocidad de carga de las otras páginas de nuestro sitio ya que reduciendo el número de peticiones al servidor tendrá la consiguiente mejora en la carga de la página.

Tenemos dos opciones para omitir la carga de esos ficheros en las páginas que no necesitemos que se carguen los ficheros.

1- Mediante el fichero functions.php.

2- Mediante la desactivación en wp-config.php y la posterior activación en las páginas o plantillas que dispongan de formularios.

Vamos a ver el primer método, del que soy mas partidario, ya que si actualizamos nuestro wordpress deberemos volver a incluir la funciones sobre el wp-config sobre el segundo método, cada vez.

Contenido

  • 1 MÉTODO MEDIANTE EL FICHERO FUNCTIONS.PHP
  • 2 MÉTODO MEDIANTE FICHERO WP-CONFIG.PHP

MÉTODO MEDIANTE EL FICHERO FUNCTIONS.PHP

Para la consecución de nuestro objetivo bastará con incluir las siguientes funciones sobre el fichero functions.php. Consideramos que disponemos de una página que dispone de un formulario de Contact Form 7 llamada ‘hablamos' y que es sobre la única que deseamos que se carguen los ficheros CSS y JS que trae el plugin.

 
add_action( 'wp_print_scripts', 'deregister_cf7_javascript', 100 );
//Indicamos que no deseamos cargar el Javasript de ContactForm7
function deregister_cf7_javascript() {
if ( !is_page('hablamos') ) {
wp_deregister_script( 'contact-form-7' );
}
}
 
add_action( 'wp_print_styles', 'deregister_cf7_styles', 100 );
//Indicamos que no deseamos cargar el CSS de ContactForm7
function deregister_cf7_styles() {
if ( !is_page('hablamos') ) {
wp_deregister_style( 'contact-form-7' );
}
}

add_action( 'wp_print_scripts', 'deregister_cf7_javascript', 100 ); //Indicamos que no deseamos cargar el Javasript de ContactForm7 function deregister_cf7_javascript() { if ( !is_page('hablamos') ) { wp_deregister_script( 'contact-form-7' ); } } add_action( 'wp_print_styles', 'deregister_cf7_styles', 100 ); //Indicamos que no deseamos cargar el CSS de ContactForm7 function deregister_cf7_styles() { if ( !is_page('hablamos') ) { wp_deregister_style( 'contact-form-7' ); } }


Si por ejemplo son dos las páginas en las que disponemos de formularios podemos emplear el operador de php como vemos en las siguientes funciones. Nuestra segunda página se llama ‘formulario-de-datos'.

 
add_action( 'wp_print_scripts', 'deregister_cf7_javascript', 100 );
//Indicamos que no deseamos cargar el Javasript de ContactForm7
function deregister_cf7_javascript() {
    if ( !(is_page('hablamos')||is_page('formulario-de-datos' )) ) {
        wp_deregister_script( 'contact-form-7' );
    }
}
add_action( 'wp_print_styles', 'deregister_cf7_styles', 100 );
//Indicamos que no deseamos cargar el CSS de ContactForm7
function deregister_cf7_styles() {
    if ( !(is_page('hablamos')||is_page('formulario-de-datos' )) ) {
        wp_deregister_style( 'contact-form-7' );
    }
}

add_action( 'wp_print_scripts', 'deregister_cf7_javascript', 100 ); //Indicamos que no deseamos cargar el Javasript de ContactForm7 function deregister_cf7_javascript() { if ( !(is_page('hablamos')||is_page('formulario-de-datos' )) ) { wp_deregister_script( 'contact-form-7' ); } } add_action( 'wp_print_styles', 'deregister_cf7_styles', 100 ); //Indicamos que no deseamos cargar el CSS de ContactForm7 function deregister_cf7_styles() { if ( !(is_page('hablamos')||is_page('formulario-de-datos' )) ) { wp_deregister_style( 'contact-form-7' ); } }


La funciones anteriores comprueban si las páginas son las indicadas, si no lo son, no realiza la carga, de otra forma carga del JS y el CSS del Contact Form 7. Por defecto, como vemos si no indicamos nada, siempre carga los ficheros.

Finalmente otra forma de realizar lo mismo es empleando la ID de la página en concreto, escribiendo !(is_page(IDdelapágina)) y reemplazando en las funciones previas.

MÉTODO MEDIANTE FICHERO WP-CONFIG.PHP

El segundo método como comentamos es la desactivación desde el wp-config.php con las siguientes funciones, que deberemos introducir en dicho fichero (podemos ver una mejor definición en la web del autor del Contact Form 7):

define('WPCF7_LOAD_JS', false);
define('WPCF7_LOAD_CSS', false);

define('WPCF7_LOAD_JS', false); define('WPCF7_LOAD_CSS', false);

Por defecto, el valor está siempre en true en la función define, de ahí que realice siempre la carga. Como vemos cambiamos su valor a false para que no cargue la constante. Tras esto en las plantillas que tengamos nuestro formulario y antes de la función wp_head() deberemos teclear la siguiente función que habilita la carga del fichero CSS y JS.

 
if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
wpcf7_enqueue_scripts();
wpcf7_enqueue_styles();
}

if ( function_exists( 'wpcf7_enqueue_scripts' ) ) { wpcf7_enqueue_scripts(); wpcf7_enqueue_styles(); }

Y con esto ya lo tendremos listo.

Como vemos con unas sencillas lineas de código podemos optimizar la velocidad de carga de nuestra web si estamos empleando el plugin de Contact Form 7 para la disposición de formularios, y realizar una criba de las páginas en las que debe y no debe cargar ficheros propios del plugin.

Espero que os haya sido útil el post y si os ha gustado estais invitados a compartirlo. Un saludo y gracias por vuestro tiempo.
Nota:
Si estais interesados en otras formas de crear un formulario de contacto visita el artículo cómo crear un formulario de contacto desde Google Drive.

Post anterior
Siguiente post

Artículos relacionados de Wordpress

Post relacionados en WordPress sin plugins para mejorar el CTR interno

Post relacionados en WordPress sin plugins para mejorar el CTR interno

Wp-Optimize limpia y optimiza la base de datos en WordPress

Wp-Optimize limpia y optimiza la base de datos en WordPress

Google Translate, ¿cómo ofrecer traducciones de mi web?

Google Translate, ¿cómo ofrecer traducciones de mi web?

Cómo crear un tema hijo en WordPress – Tutorial definitivo

Cómo crear un tema hijo en WordPress – Tutorial definitivo


Los datos de los comentarios están seguros.

Responsable: Santi Navarro. Finalidad: Moderar los comentarios Legitimación: Consentimiento del Interesado. Destinatarios: Tus datos los guardará Disqus, el sistema que emplea esta web, que está acogido al acuerdo de seguridad EU-US Privacy. Derechos: podrás acceder, rectificar, limitar y suprimir tus datos.

ENTRADAS RECIENTES

  • Como eliminar comentarios desde la base de datos en WordPress
  • Como crear un botón para eliminar post o página en admin bar de WordPress
  • Cómo organizar las entradas de WordPress en categorías masivamente
  • Las Mejores Plantillas WordPress para Abogados Responsive
  • Tecnicas para ganar visibilidad en redes sociales gratis
  • Los mejores navegadores de internet para Android móvil y tablet
  • Mejores Plantillas de WordPress para Inmobiliaras y Agencias de Venta y Alquiler de Propiedades
  • Mejores Plantillas de WordPress para Empresas o Web Corporativa

Santi Navarro

Diseño web Wordpress, Posicionamiento web y Socialmedia

ARTÍCULOS SOBRE HOSTING

  • Hosting para Wordpress
  • Loading Alojamiento Web
  • Hosting Gratis

PLANTILLAS PARA WORDPRESS

  • Plantillas WordPress para Fotografía
  • Plantillas WordPress para Empresas
  • Plantillas WordPress para Abogados
  • Plantillas WordPress para Inmobiliarias
  • Plantillas WordPress para Restaurantes
  • Elegant Themes Plantillas Premium
  • Themeforest Envato Market

PUBLICACIONES

  • Página web barata
  • Descargar videos de Youtube sin programas
  • Como registrarse en Twitter fácilmente
  • Mejores Plantillas Responsive para Wordpress
  • Presupuesto Tienda Online
Copyright © 2023 Santi Navarro
Diseño web Wordpress en Valencia | Diseño web Gandia
Aviso legal - Política de privacidad - Uso de cookies - Mapa del sitio