Crear campo personalizado en el Checkout y mostrar en usuarios

Crear campos personalizados en el Checkout y que se muestren en el área de usuario

¿Qué es un Snippet y para que sirve?

Un Snippet es un fragmento de código que aporta ciertas funciones a tu web sin la necesidad de instalar un plugin para ello.

La forma mas sencilla de añadir ese fragmento de código en tu web (hay varias) es usando el mega conocido plugin Code Snippets.

¿Cómo se instala Code Snippets?

Desde el repositorio de WodrPress busca «Code Snippets», lo instalas y lo activas.

¿Cómo se añade un fragmento de código?

Busca en el menú de tu backoffice «Fragmentos de código» con el icono de unas tijeras, y clica en Añadir nuevo, pones un título y pegas el snippet que de dejo en este tutorial.

Seguro que en alguna ocasión has necesitado crear un campo nuevo en el proceso de pago de tu tienda online hecha con Woocommerce.

Te pongo un ejemplo: Una escuela para niños que además de recopilar los datos de facturación en el checkout (normalmente de un progenitor) también necesitas saber el nombre del alumno.

Hasta aquí nada fuera de lo normal, instalas el plugin Checkout Field Editor (Checkout Manager) for WooCommerce de ThemeHigh y creas ese campo personalizado.

Crear campo personalizado en el Checkout y mostrar en usuarios usando el plugin Checkout field editor for woocommerce

Símplemente haz clic en el botón «Añadir un campo» y edítalo.

Te dejo un par de capturas de como se crea un campo personalizado:

Lo importante es el campo Nombre, ese campo definirá la meta key que usaremos mas adelante, yo he puesto billing_alumno pero tu puedes poner el que prefieras.

Esto se vería así en el checkout:

Como se vería al crear un campo personalizado en el Checkout

Mostrar ese dato en el perfil del usuario

Crear campo personalizado en el Checkout y mostrar en usuarios es fácil si sabes como hacerlo

El problema viene cuando queremos tener ese dato en el perfil de ese usuario, porque normalmente no lo va a mostrar.

Para ello, necesitaremos un pequeño fragmento de código.

Aquí lo tienes:

				
					add_filter( 'user_contactmethods', 'modify_user_contact_methods' );

function modify_user_contact_methods( $methods ) {
    // Add user info
    $methods['billing_alumno']   = __( 'Nombre del alumno'   );
    return $methods;
}
				
			

Puedes crear tantos campos nuevos como quieras, lo único que debes hacer en ese caso es crear el campo personalizado y repetir la línea 5 con los datos de los campos que hayas creado.

Esto se mostrará en el perfil del usuario de este modo:

Recuerda que para insertar el fragmento de código, te recomiendo usar Code Snippets.

Comparte en tus Redes Sociales

Facebook
Pinterest
Twitter
LinkedIn