WooCommerce es una plataforma potente y flexible, pero muchas personalizaciones requieren plugins que afectan el rendimiento. Si buscas añadir un campo adicional en el checkout de WooCommerce sin usar plugins, esta guía es para ti.
Con este método, podrás personalizar el formulario de pago en WooCommerce sin plugins, agregando campos como:
- Número de identificación fiscal (RUT, DNI, NIF).
- Un mensaje personalizado del cliente.
- Un campo opcional para notas adicionales.
- Una opción de “Este pedido es un regalo”.
💡Sigue leyendo para aprender a implementar esta funcionalidad fácilmente con código en functions.php.
🚀 ¿Por qué Personalizar el Checkout sin Plugins?
Agregar un campo adicional en WooCommerce sin plugins tiene varios beneficios:
- Menos carga en el servidor: No dependerás de plugins que consumen recursos.
- Mayor seguridad y estabilidad: Evitas vulnerabilidades de plugins desactualizados.
- Personalización completa: Controlas exactamente cómo se muestra el campo y dónde aparece.
📌 A continuación, vamos a implementarlo en solo 3 pasos.
🛠 Paso 1: Añadir el Campo en el Checkout de WooCommerce
Primero que todo, para agregar un nuevo campo en la pantalla de pago de WooCommerce, inserta el siguiente código en functions.php de tu tema hijo:
add_action('woocommerce_after_order_notes', 'custom_checkout_field');
function custom_checkout_field($checkout) {
echo '<div id="custom_checkout_field"><h3>' . __('Información Adicional') . '</h3>';
woocommerce_form_field('custom_field', array(
'type' => 'text',
'class' => array('custom-field-class form-row-wide'),
'label' => __('Mensaje personalizado'),
'placeholder' => __('Escribe un mensaje para el vendedor'),
'required' => false,
), $checkout->get_value('custom_field'));
echo '</div>';
}¿Qué hace este código?
- Agrega un campo de texto opcional en el checkout.
- Se mostrará debajo de la sección de notas del pedido.
- Permite que los clientes ingresen un mensaje personalizado antes de finalizar la compra.
📌 Aún no hemos terminado. Debemos almacenar este dato en la orden.
💾 Paso 2: Guardar el Campo en los Datos de la Orden
Para que WooCommerce almacene la información ingresada, usa este código:
add_action('woocommerce_checkout_update_order_meta', 'save_custom_checkout_field');
function save_custom_checkout_field($order_id) {
if (!empty($_POST['custom_field'])) {
update_post_meta($order_id, 'custom_field', sanitize_text_field($_POST['custom_field']));
}
}¿Qué hace este código?
✔ Guarda el campo ingresado por el usuario en la base de datos de WooCommerce.
✔ Evita que el dato se pierda al finalizar la compra.
📌 Ya guardamos la información. Ahora necesitamos mostrarla en el administrador y en los correos de pedido.
📜 Paso 3: Mostrar el Campo en la Página de Pedido y el Administrador
Para que los administradores vean el dato en el panel de pedidos, añade esto en functions.php:
add_action('woocommerce_admin_order_data_after_billing_address', 'display_custom_checkout_field_in_admin', 10, 1);
function display_custom_checkout_field_in_admin($order){
$custom_field_value = get_post_meta($order->get_id(), 'custom_field', true);
if ($custom_field_value) {
echo '<p><strong>' . __('Mensaje personalizado') . ':</strong> ' . $custom_field_value . '</p>';
}
}¿Qué hace este código?
✔ Muestra el campo en la sección de detalles de pedido en el panel de WooCommerce.
✔ Permite que los administradores vean la información ingresada por el cliente.
📌 Listo. Ahora WooCommerce puede guardar y mostrar el campo sin necesidad de plugins.
📈 Beneficios de Usar Código en Lugar de Plugins para Añadir Campo en Checkout Woocommerce
Implementar este truco sin plugins trae muchas ventajas:
- Mayor control: Puedes modificar la función según tus necesidades.
- Menos plugins: Evitas depender de complementos de terceros.
- Optimización SEO: Un WooCommerce más rápido mejora el posicionamiento en Google.
- Experiencia del usuario mejorada: Checkout más ligero y sin distracciones.
🚀 Este método es ideal si buscas una solución personalizada y eficiente.
🔹 Conclusión y Checklist Final
En conclusión, personalizar el checkout sin plugins es una excelente forma de mejorar tu tienda online sin afectar el rendimiento. Con este truco, ahora puedes añadir un campo en el checkout de WooCommerce sin plugins, guardar la información en la orden y mostrarla en el administrador fácilmente.
💡 Checklist rápido para aplicar este truco:
- Agregar el campo en la página de pago.
- Guardar el dato en la base de datos.
- Mostrar el campo en el panel de administración.
- Optimizar WooCommerce sin usar plugins innecesarios.
📌 ¿Te gustaría más trucos como este? Síguenos en PlanetaWordPress.cl y descubre más formas de optimizar tu ecommerce 🚀
Para más trucos Woocommerce visita el siguiente enlace trucos ecommerce.
Si necesitas ayuda o soporte con este tipo de temas u otros relacionados con el mundo WordPress, puedes contactar a WebArt.cl. Te ayudarán encantados!
