Añadir un Campo de «Subir Fichero» al Registro de WooCommerce en WordPress

Este fragmento de código PHP permite añadir un campo de «Subir fichero» al formulario de registro de WooCommerce en WordPress. El código se divide en varias partes para lograr su funcionalidad:

  1. Añadir el Campo al Formulario: La función bf_add_register_field añade un nuevo campo de entrada de tipo fichero al formulario de registro de WooCommerce. Este campo acepta imágenes y archivos PDF.
  1. Validación del Campo: La función bf_register_fields_validation valida que el usuario haya subido un archivo válido en el nuevo campo.
  1. Guardar la Información: La función bf_save_register_fields guarda el archivo subido en la base de datos de WordPress.
  1. Compatibilidad con Imágenes: La función bf_add_enctype añade el atributo enctype al formulario para permitir la subida de archivos.

 

<?php
/**
 * Añadir campo de "Subir fichero" al registro de WooCommerce
 */

// 1. Añadimos el input de tipo fichero al formulario de registro.
function bf_add_register_field() {
    ?>
    <p class="form-row validate-required" id="image" data-priority=""><label for="image" class="">Image (JPG, PNG, PDF)<abbr class="required" title="required">*</abbr></label><span class="woocommerce-input-wrapper"><input type='file' name='image' accept='image/*,.pdf' required></span></p>
    <?php
}
add_action( 'woocommerce_register_form', 'bf_add_register_field' );

// 2. Validamos el nuevo campo.
function bf_register_fields_validation( $errors, $username, $email ) {
    if ( isset( $_POST['image'] ) && empty( $_POST['image'] ) ) {
        $errors->add( 'image_error', __( 'Please provide a valid image', 'woocommerce' ) );
    }
    return $errors;
}
add_filter( 'woocommerce_registration_errors', 'bf_register_fields_validation', 10, 3 );

// Guardamos la información del nuevo campo.
function bf_save_register_fields( $customer_id ) {
    if ( isset( $_FILES['image'] ) ) {
        require_once( ABSPATH . 'wp-admin/includes/image.php' );
        require_once( ABSPATH . 'wp-admin/includes/file.php' );
        require_once( ABSPATH . 'wp-admin/includes/media.php' );
        $attachment_id = media_handle_upload( 'image', 0 );
        if ( is_wp_error( $attachment_id ) ) {
            update_user_meta( $customer_id, 'image', $_FILES['image'] . ": " . $attachment_id->get_error_message() );
        } else {
            update_user_meta( $customer_id, 'image', $attachment_id );
        }
    }
}
add_action( 'user_register', 'bf_save_register_fields', 1 );

// Añadimos compatibilidad con imágenes
function bf_add_enctype() {
    echo 'enctype="multipart/form-data"';
}
add_action( 'woocommerce_register_form_tag', 'bf_add_enctype' );

Ejemplos de Uso

  • Para Tiendas Online: Si tienes una tienda online y quieres que los usuarios puedan subir su identificación o cualquier otro documento durante el registro.
  • Para Portfolios: Si tienes un sitio web donde los usuarios necesitan subir su trabajo en formato de imagen o PDF durante el registro.

¡Más Snippets, Más Opciones!

Al compartir, motivamos a más desarrolladores a contribuir. Ayúdanos a hacer de este directorio un punto de referencia en snippets.

Facebook
Twitter
LinkedIn
Telegram
WhatsApp

¿Necesitas un snippet? Pídenoslo

¿No encuentras el código que necesitas? Pídenoslo y te ayudamos. También puedes publicar tus snippets.

¿Cómo implementar este snippet en la web?

Tienes 2 opciones, una de ellas es mediante plugin y la otra pegando el código en tu web.

1. Añadir snippet con plugin

code-snippets

Code Snippets

Por Code Snippets Pro

  1. Descarga el plugin o búscalo en el repositorio de plugins de Wordpress e instálalo en tu web.
  2. En el menú lateral del Escritorio verás un nuevo enlace (Fragmetos de código). Ves a Fragmentos de código > Añadir nuevo.
  3. Se abrirá una página con un título, bloque de código, descripción y etiquetas, rellena el título con el que quieras guardarlo, ejemplo: Añadir Google Analytics.
  4. En la parte código verás que está activo PHP, ahí pega el código del snippet
  5. La descripción y las etiquetas solo son para tu información y para que luego encuentres más fácil los snippets.
  6. Publicar y activar el snippet.

2. Añadir snippet en el functions.php

Diseño web con WordPress

Accede al archivo functions.php de tu tema o tema hijo, pega el snippet y guarda el archivo.

Lo encontrarás en Apariencia > Editor de archivos de tema, pinchas sobre el enlace  functions.php y pegas el código al final del archivo.

condiciones de uso diseño web

¿Necesitas un snippet?

Cuéntanos que necesitas e intentaremos crear un snippet que lo realice. Si lo conseguimos, lo publicaremos y te avisaremos por correo.

¡Comparte tu snippet!

Si has creado un snippet y quieres compartirlo, envíanoslo y lo publicaremos enlazando tu web debajo de la publicación.

Relacionados:

Enviar contenido a mi correo

Guárdarte el contenido en tu correo para probarlo más tarde.