Cómo crear un formulario de pedido en línea en WordPress (paso a paso)

Varios de nuestros lectores han estado preguntando cómo crear un formulario de pedido en línea, para que los clientes puedan realizar sus pedidos fácilmente en el sitio web.

Si tiene un negocio como un restaurante o una tienda física, es posible que no desee crear una tienda en línea completa. Sin embargo, es posible que desee ofrecer una manera fácil para que los clientes ordenen alimentos u otros productos para que los entregue.

En esta publicación, le mostraremos cómo crear un formulario de pedido en línea en WordPress. Esto le permitirá recolectar fácilmente los pedidos de los clientes sin agregar un software de comercio electrónico completo a su sitio web.

Crear un formulario de pedido en línea en WordPress

Crear un formulario de pedido en línea en WordPress

Quiz√°s haya decidido iniciar un sitio web para su negocio recientemente y se siente un poco abrumado.

Muchas empresas comienzan una tienda en línea no solo para recoger pedidos, sino también para aceptar pagos y administrar el inventario. Sin embargo, no todas las empresas necesitan un sitio web de comercio electrónico completo.

Si solo desea que los clientes puedan completar un formulario de pedido en línea, puede crearlo fácilmente sin una solución de carrito de compras.

Un simple formulario de pedido en línea le da la opción de aceptar pagos en línea, al momento de retirar el pedido o en el momento de la entrega.

En este tutorial, utilizaremos WPForms para crear un formulario de pedido en línea porque le permite hacerlo fácilmente con su interfaz de arrastrar y soltar.

WPForms es el mejor plugin de generador de formularios de WordPress en el mercado. Más de 3 millones de sitios web usan WPForms para crear fácilmente cualquier tipo de formulario en línea y agregarlo a su sitio web (no se requieren habilidades de codificación).

Primero, deber√° instalar y activar el complemento WPForms. ¬ŅNecesita ayuda para instalar el complemento? Consulte nuestra gu√≠a sobre c√≥mo instalar un complemento de WordPress para obtener instrucciones detalladas.

Los complementos son como aplicaciones para su sitio web de WordPress. Si es nuevo en WordPress, eche un vistazo a nuestro artículo sobre qué son los complementos de WordPress y qué puede hacer con ellos.

Una vez que haya activado el complemento WPForms, ver√° una nueva pesta√Īa WPForms en la barra lateral de administraci√≥n de su panel de WordPress.

Necesitas visitar WPForms ¬ĽConfiguraci√≥n p√°gina para ingresar su clave de licencia. Puede encontrar esta informaci√≥n en su cuenta en el sitio web de WPForms.

Ingrese su clave de licencia para WPForms

Ahora está listo para crear su formulario de pedido en línea.

Simplemente dir√≠gete a WPForms ¬ĽAgregar nuevo p√°gina para crear tu primer formulario.

Crear un nuevo formulario usando WPForms

Ahora verá la pantalla de creación de formularios. Escriba un nombre para su formulario y elija una plantilla. Recomendamos la plantilla "Facturación / Formulario de pedido".

Seleccione la plantilla 'Facturación / Formulario de pedido' para comenzar

Simplemente mueva el cursor sobre la descripción de la plantilla y haga clic en el botón "Crear un formulario de facturación / pedido".

Haga clic en el botón 'Crear un formulario de facturación / pedido' para crear su formulario

Su formulario se crear√° autom√°ticamente para usted y se lo dirigir√° directamente al editor de formularios de WPForms.

Su formulario de pedido en línea recién creado

Ahora puede editar su formulario de pedido en línea como lo desee. Las diferentes partes del formulario se denominan "campos". Puede cambiar, agregar o eliminar campos en su formulario con un solo clic.

La plantilla predeterminada ya incluye campos para la mayor√≠a de la informaci√≥n que probablemente necesite, como nombre, direcci√≥n y n√ļmero de tel√©fono. Sin embargo, deber√° enumerar sus productos reales.

Haga clic en el campo "Elementos disponibles" para editarlo.

Edición del campo 'Artículos disponibles' de su formulario de pedido en línea

Escriba el nombre y el precio de cada uno de los artículos que los clientes pueden pedirle. El precio no se mostrará automáticamente en el formulario, por lo que es posible que desee agregarlo al nombre del artículo.

Edición del campo 'Elementos disponibles' para cambiar los nombres de los elementos

Para agregar m√°s opciones, simplemente haga clic en el icono (+) donde quiera agregar los elementos adicionales.

Agregar más artículos a su formulario de pedido en línea

Nota: Puede agregar tantos elementos como desee. Sin embargo, los clientes solo podrán seleccionar una opción de este campo.

Si tiene varias categorías de opciones, puede copiar el campo para crear grupos.

Puede copiar el campo "Elementos disponibles" haciendo clic en el icono "Copiar" que aparece cuando pasa el cursor sobre él o cuando está seleccionado.

Copie el campo 'Artículos disponibles' para crear un nuevo campo en su formulario de pedido

Aseg√ļrese de cambiar tambi√©n la "Etiqueta" de los campos a algo apropiado para cada grupo.

Si desea que los clientes puedan seleccionar dos o m√°s opciones dentro de un solo campo, deber√° usar un tipo diferente de campo.

Haga clic en la pesta√Īa "Agregar campos" y luego despl√°cese hacia abajo hasta "Campos de pago" donde encontrar√° el campo "Elementos de casilla de verificaci√≥n". Arrastre y suelte esto en su posici√≥n en su formulario.

Agregar un campo de casilla de verificación para que los clientes puedan seleccionar varios artículos a la vez

Ahora puede editar ese campo como antes, ingresando nombres y precios para sus artículos. Los clientes pueden verificar tantos artículos como quieran ordenar.

Si desea mostrar imágenes de sus productos, también es muy fácil. Simplemente haga clic en el cuadro "Usar opciones de imagen":

Agregar imágenes de sus productos a su formulario de pedido en línea

Para cada elemento, haga clic en el botón "Cargar imagen" para agregar imágenes desde su computadora o desde su biblioteca multimedia de WordPress.

Subir una imagen de un producto que ofreces

WPForms no redimensionar√° ni comprimir√° sus im√°genes, por lo que es importante subirlas al tama√Īo correcto. Todos deben tener el mismo tama√Īo y no m√°s de 250 √ó 250 p√≠xeles.

Idealmente, también debe optimizar sus imágenes para la web.

Finalmente, es posible que desee editar el campo "Comentario o Mensaje" en la parte inferior del formulario, para que no sea obligatorio. No todos los usuarios querr√°n agregar un mensaje.

Simplemente haga clic en el campo y luego desmarque la casilla "Requerido" a la derecha para que este campo sea opcional.

Hacer que el campo 'Comentario / Mensaje' sea opcional en lugar de obligatorio

Puede seguir este proceso para cualquier campo que desee que sea opcional. Puede saber qué campos son obligatorios porque tendrán un asterisco rojo junto a la etiqueta del campo.

Una vez que est√© satisfecho con el dise√Īo de su formulario, puede continuar con la configuraci√≥n. Es una buena idea guardar el formulario primero haciendo clic en el bot√≥n "Guardar" en la parte superior de la pantalla:

El botón 'Guardar' de WPForms aparece en la esquina superior derecha de la pantalla

Configuración de las notificaciones que enviará su formulario de pedido

Primero, haga clic en la pesta√Īa "Configuraci√≥n" en el lado izquierdo de la pantalla. Esto abrir√° la configuraci√≥n de tu formulario.

La pesta√Īa 'Configuraci√≥n' en WPForms

A continuaci√≥n, haga clic en la pesta√Īa "Notificaciones" para cambiar las notificaciones de correo electr√≥nico de su formulario. Por defecto, los formularios de pedido completados se enviar√°n por correo electr√≥nico a la direcci√≥n de administraci√≥n de su sitio de WordPress.

Es posible que desee cambiar esto o copiar los formularios de pedido en más de una dirección. Simplemente puede escribir la dirección o direcciones de correo electrónico en el cuadro "Enviar a dirección de correo electrónico". Si ingresa más de una dirección de correo electrónico, sepárelas con una coma.

Ingrese las direcciones de correo electrónico a las que desea que se envíe el formulario, separadas por comas

También es posible que desee cambiar la línea de asunto, para que no sea lo mismo para cada pedido. Esto podría facilitar el seguimiento de los pedidos en una bandeja de entrada llena de correos electrónicos.

Aquí, hemos cambiado la línea de asunto de los correos electrónicos para leer "Pedido del cliente" y luego el nombre del cliente. Utilizamos "Mostrar etiquetas inteligentes" para insertar el campo de nombre en la línea de asunto.

Cambiar la línea de asunto en el correo electrónico de notificación para agregar el nombre del cliente

También puede cambiar cualquier otro detalle que desee.

También recomendamos encarecidamente configurar una notificación por correo electrónico para sus clientes. Esto les brinda un recordatorio de lo que han pedido y les informa que usted recibió su pedido.

Para configurar una nueva notificación por correo electrónico, haga clic en el botón "Agregar nueva notificación".

Haga clic en el botón 'Agregar nueva notificación' para crear una nueva notificación

Se le pedirá que escriba un nombre para la nueva notificación. Puede llamarlo como quiera, ya que los clientes no verán este nombre. Sugerimos algo como "Recibo del cliente" o "Confirmación de correo electrónico del cliente".

Ingresando un nombre para la notificación que se enviará al cliente

Querrá que la "Dirección de envío a correo electrónico" sea la cuenta de correo electrónico de su cliente. Eliminar {admin_email} de este cuadro. Haga clic en "Mostrar etiquetas inteligentes" y seleccione el campo "Correo electrónico".

Configurar el recibo del cliente para que sea enviado por correo electrónico al cliente

También querrás ingresar otros detalles para el correo electrónico. Sugerimos utilizar una línea de asunto como "Su pedido con" y el nombre de su empresa.

Ingresando el nombre 'De' y la dirección de correo electrónico para el recibo del cliente

En el campo "Mensaje", es probable que desee agregar un mensaje a su cliente. La etiqueta {all_fields} le dará toda la información que el cliente ingresó en el formulario.

Editar la dirección de correo electrónico que recibirá su cliente

¬ŅQu√© sucede si solo desea incluir parte de la informaci√≥n del cliente en el correo electr√≥nico? ¬ŅO qu√© pasa si desea poner primero los detalles de su pedido e incluir sus detalles de entrega al final del correo electr√≥nico? Simplemente puede usar etiquetas inteligentes para agregar cualquier campo de formulario a su formulario.

Una vez que haya terminado de configurar las notificaciones, haga clic en el botón "Guardar" en la parte superior de la pantalla.

Propina: Para volver a la primera notificación que estaba editando, simplemente desplácese hacia abajo en la pantalla.

Configurar el mensaje de confirmación para sus clientes

Además de enviar a sus clientes un recibo por correo electrónico, querrá mostrarles una confirmación en pantalla para que sepan que su pedido ha sido enviado.

Puedes hacer esto bajo Configuraci√≥n ¬ĽConfirmaci√≥n leng√ľeta.

La confirmación predeterminada dice "¡Gracias por contactarnos! Nos pondremos en contacto con usted en breve.

Mensaje de confirmación predeterminado del formulario de pedido en línea

Puede cambiar esto a lo que desee, y también puede usar el editor visual aquí para formatear su texto.

Personalizar el mensaje de confirmación que su cliente verá en su pantalla

Alternativamente, puede redirigir a los clientes a una p√°gina de "Gracias" en su sitio web, o incluso a otro sitio web por completo.

Una vez que haya configurado el mensaje de confirmación, haga clic en "Guardar" en la parte superior de la pantalla.

Integrar el pago con su formulario de pedido (opcional)

Si desea realizar el pago a través de su formulario de pedido, deberá integrarlo con un procesador de pagos.

WPForms se integra muy fácilmente con dos procesadores de pago populares, PayPal y Stripe. Los clientes pueden pagar a través de su cuenta de PayPal o ingresando los datos de su tarjeta de crédito.

Vamos a usar PayPal en este tutorial, pero el proceso para Stripe es similar.

Primero, deber√° salir del generador de formularios. Puede hacerlo haciendo clic en la "X" en la parte superior derecha. Se le pedir√° que guarde su formulario si tiene cambios sin guardar.

A continuaci√≥n, ve a WPForms ¬ĽComplementos p√°gina en su panel de WordPress. Despl√°cese hacia abajo hasta el "Complemento est√°ndar de PayPal" y haga clic en el bot√≥n "Instalar complemento" debajo de √©l.

Instalación del complemento de PayPal para WPForms

El complemento se instalar√° y activar√° autom√°ticamente.

Regrese a su formulario, que puede encontrar en WPForms ¬ĽTodos los formularios. Ahora, haga clic en la pesta√Īa "Pagos".

Seleccione los servicios de pago para integrar con su formulario

Haga clic en "PayPal estándar" y complete los detalles del formulario. Primero, deberá marcar la casilla "Habilitar pagos estándar de PayPal" e ingresar la dirección de correo electrónico de PayPal de su empresa.

Deje el men√ļ desplegable "Modo" establecido en "Producci√≥n" y deje "Tipo de pago" establecido en "Productos y servicios".

La página de configuración de pago de PayPal para su formulario

Si está recopilando la dirección de entrega a través del formulario de pedido, puede cambiar "Envío" a "No solicite una dirección".

No es necesario que ingrese una "Cancelar URL", pero puede crear una página en su sitio web para que se envíe a los clientes si no completan el proceso de pago.

Haga clic en el botón "Guardar" una vez que haya terminado.

Ahora, cuando el usuario env√≠e el formulario, se lo dirigir√° autom√°ticamente a PayPal para que pague. No necesita agregar ning√ļn campo adicional a su formulario ni hacer nada m√°s.

Agregar el formulario de pedido a su sitio web

El √ļltimo paso es agregar su formulario de pedido a su sitio web.

Simplemente elija la p√°gina a la que desea agregar su formulario o cree una nueva p√°gina en P√°ginas ¬ĽAgregar nuevo.

Luego, haga clic en el √≠cono (+) para agregar un nuevo bloque (donde desee su formulario) y busque el bloque "WPForms". Se encuentra debajo de la secci√≥n "Widgets" de los bloques, o simplemente puede escribir "WPForms" en la barra de b√ļsqueda para encontrarlo.

Agregar su formulario de pedido en línea a una página en su sitio web

Ver√°s un bloque de WPForms. Haga clic en el men√ļ desplegable "Seleccionar un formulario" y elija su formulario.

Seleccionar su formulario de pedido en línea de la lista desplegable de WPForms

Luego ver√° una vista previa del formulario en el editor de WordPress.

Cuando esté listo, guarde y publique (o actualice) su página. Puede verlo en vivo en su sitio para ver su formulario en acción. Antes de compartirlo con los clientes, recomendamos probar el formulario para asegurarse de que funcione como esperaba.

También es una buena idea verificar que reciba la notificación por correo electrónico cuando se envíe el formulario. Si no, mira nuestra publicación sobre cómo solucionar el problema de WordPress que no envía correos electrónicos.

Incluso si pierde un correo electr√≥nico o lo borra accidentalmente, WPForms guarda los datos del formulario en la base de datos de WordPress. Puede encontrar todos sus pedidos yendo a WPForm ¬ĽEntradas en tu panel de WordPress.

Haga clic en el nombre de su formulario y ver√° una lista de entradas. Puede hacer clic en "Ver" junto a cualquiera de estos para ver los detalles.

Ver formularios de pedido completados en su panel de WordPress

¬°Eso es! Esperamos que este art√≠culo te haya ayudado a aprender c√≥mo crear un formulario de pedido en l√≠nea en WordPress. Tambi√©n puede que le guste nuestra gu√≠a sobre los mejores servicios de telefon√≠a comercial, y debe tener los complementos de WordPress para peque√Īas empresas.

Si le gustó este artículo, suscríbase a nuestro canal de YouTube para ver videos tutoriales de WordPress. También puedes encontrarnos en Twitter y Facebook.