Añade funcionalidad a Contact Form 7

Puedes añadir funcionalidad extra en el plugin Contact Form 7 después de que tomen lugar algunas acciones, por ejemplo cuando un email se ha enviado correctamente.
Contact Form 7 dispara una serie de eventos JavaScript a los que puedes acceder fácilmente, aquí hay un ejemplo usando JQuery.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
if( $('.wpcf7').length > 0 ) {
 
  $(document).on('spam.wpcf7', function () {
    console.log('submit.wpcf7 triggered!');
  });
 
  $(document).on('invalid.wpcf7', function () {
    console.log('invalid.wpcf7 triggered!');
  });
 
  $(document).on('mailsent.wpcf7', function () {
    console.log('mailsent.wpcf7 triggered!');
  });
 
  $(document).on('mailfailed.wpcf7', function () { 
    console.log('mailfailed.wpcf7 triggered!');
  });
}

Como añadir valores dinámicos a los campos de Contact Form 7

Contact Form 7 es un plugin estupendo para añadir formularios a tu sitio web, pero estos formularios contienen campos estáticos y existen ocasiones en las que necesitamos añadir campos con valores dinámicos como el ID del post en el que nos encontramos o variables PHP GET y POST.

Esta tarea es muy sencilla instalando el plugin Contact Form 7 Dynamic Text Extension

Este plugin añade dos tipos de campo adicionales a Contact Form 7, estos campos son Dynamic Text field y Dynamic Hidden field, el valor dinámico para un campo específico se genera a través de un shortcode.

The plugin has it’s own shortcodes integrated, but you can create your own.
El plugin viene ya con algunos shortcodes predefinidos, pero puedes crear los tuyos propios.

Voy a poner un ejemplo muy sencillo:

Vamos a suponer que queremos añadir un campo oculto cuyo valor debe ser el ID del post en el que nos encontramos.
Si creamos nuestro propio shortocode tendría esta pinta:

function cf7_add_post_id(){
 
    global $post;
    return $post->ID;
}
 
add_shortcode('CF7_ADD_POST_ID', 'cf7_add_post_id');

Y el campo dinámico en la configuración de nuestro formulario sería:

[dynamictext my-filed-name "CF7_ADD_POST_ID"]

La otra manera de hacerlo es usando los shortocdes integrados en el propio plugin.
En este caso queremos obtener el ID del post actual así que únicamente habría que añadir el campo dinámico en la configuración del formulario:

[dynamictext my-filed-name "CF7_get_post_var key='ID'"]

El plugin viene con shortocodes para GET, POST, blog info, post info, current URL, custom fields, current user info, referrer URL. Tienes todos los detalles en la página de wordpress.org

Contact Form 7, guardar formulario en la base de datos

Crear la tabla para guardar los datos en la base de datos.

CREATE TABLE `wp_tps_forms` (
  `id` int(11) unsigned NOT NULL AUTO_INCREMENT,
  `form` varchar(100) NOT NULL DEFAULT '',
  `data` text NOT NULL,
  `date` datetime NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;

Llamar la función justo antes del envío de correo con el hook wpcf7_before_send_mail.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
add_action('wpcf7_before_send_mail', 'save_form' );
 
function save_form( $wpcf7 ) {
   global $wpdb;
 
   /*
    Nota: desde la version 3.9 Contact Form 7 ha eliminado $wpcf7->posted_data
    y ahora se accede a los datos a través de API.
   */
 
   $submission = WPCF7_Submission::get_instance();
 
   if ( $submission ) {
 
       $submited = array();
       $submited['title'] = $wpcf7->title();
       $submited['posted_data'] = $submission->get_posted_data();
 
    }
 
     $data = array(
   		'name'  => $submited['posted_data']['name'],
   		'email' => $submited['posted_data']['email']
   	     );
 
     $wpdb->insert( $wpdb->prefix . 'tps_forms', 
		    array( 
                          'form'  => $submited['title'], 
			   'data' => serialize( $data ),
			   'date' => date('Y-m-d H:i:s')
			)
		);
}