Cómo ocultar campos vacíos en la vista previa de entradas de WPForms

¿Le gustaría ocultar los campos vacíos de la vista previa de entrada en WPForms? Esto puede ayudar a crear una vista previa más limpia y enfocada mostrando sólo los campos que contienen datos.

En este tutorial, le mostraremos cómo utilizar un fragmento de código personalizado para eliminar los campos vacíos de la vista previa de entrada en WPForms.

Añadir el fragmento de código

Para ocultar los campos vacíos de la vista previa de entrada, tendrá que añadir un fragmento de código personalizado a su sitio. Si necesitas ayuda para añadir código personalizado, consulta nuestro tutorial sobre cómo añadir fragmentos de código.

Añada el siguiente fragmento de código PHP a su sitio:

/**
 * Filter the entry preview fields to hide empty fields.
 *
 * @link https://wpforms.com/developers/hiding-empty-fields-in-wpforms-entry-preview
 *
 *
 * @param array $fields    The entry preview fields.
 * @param array $form_data Form data and settings.
 *
 * @return array The filtered entry preview fields.
 */
function wpf_hide_empty_entry_preview_fields( $fields, $form_data ) {
    foreach ( $fields as $field_id => $field ) {
        if ( empty( $field['value'] ) ) {
            unset($fields[$field_id]);
        }
    }
    return $fields;
}

// Add the filter to apply the custom function.
add_filter( 'wpforms_entry_preview_fields', 'wpf_hide_empty_entry_preview_fields', 10, 2 );

Este fragmento utiliza la función wpforms_entry_preview_fields para modificar los campos mostrados en la Vista Previa de la Entrada. El código recorre todos los campos de la vista previa y comprueba si el valor está vacío. Si el valor de un campo está vacío, elimina ese campo de la matriz. Una vez completado el bucle, devuelve la matriz de campos modificada, que ahora sólo contiene campos con valores.

Después de añadir el fragmento, asegúrese de probar sus formularios a fondo. Envíe formularios con varias combinaciones de campos rellenos y vacíos para asegurarse de que la vista previa de entrada se muestra como se espera.

Y ¡listo! Ahora ha ocultado los campos vacíos de la vista previa de entrada de WPForms. Esto crea una vista previa más limpia y enfocada que sólo muestra los campos que contienen datos.

¿Le gustaría aprender más sobre cómo personalizar la vista previa de entrada en WPForms? Consulte nuestro tutorial sobre cómo mostrar campos de vista previa de entrada en WPForms.