Crea presupuestos on line con Wordpress y Elementor

Créa presupuestos on line con WordPress y Elementor

Una de las formas de optimizar tu tiempo y ofrecer a tus posibles clientes una respuesta inmediata sobre algún producto o servicio que ofrezcas es a través de los presupuestos en linea. En este tutorial te vamos a explicar como crear presupuestos con WordPress, Elementor pro y Piotnet addons for Elementor.

Índice de contenidos

Que plugins necesitamos

Para llevar a cabo la tarea de crear un presupuesto on line necesitaremos Elementor Pro y Piotnet addons for Elementor.

Podeís descargar los plugins desde estos enlaces:

Elementor Pro

Piotnet addons for Elementor

Recuerda habilitar los widgets desde piotnet addons.

piotnet addons for elementor

Cómo funciona el formulario del presupuesto

Si ya leisteis nuestro post sobre cómo crear un formulario multipasos con Elementor y Piotnet addons for Elementor no os costará entender cómo se crea un formulario para crear un presupuesto on line. 

Aún así vamos a dar un repasillo para los nuevos.

Basicamente todos los campos del formulario deben tener una ID única y todos los campos del formulario se deben asociar a un formulario, en la que el identificador será el mismo para todos los campos

formularios con piotnet addons for elementor

Creando ID de campos y de formulario

Antes de entrar en materia comentar que nos centraremos en explicar los campos de los cálculos y de las opciones para el presupuesto. Tampoco entraremos en detalle del aspecto visual.

Todos los campos del formulario, ya sean para recoger información personal, de consulta sobre las opciones del formulario del presupuesto o para hacer los cálculos lo realizaremos a través del widget FIELD.

Una vez añadimos el widget al contenido, en la columna de la izquierda nos aparecerán las ID de formulario y ID de campo. Recuerda lo que hemos comentado en el paso anterior, ID genérico para el formulario y ID único para el campo.

Debajo de la ID del campo veras que de forma automática verás que se te crea un shortcode. Este shortcodes y el de todos los campos son los que utilizaremos para hacer los cálculos.

Tipos de campos de selección

Desde el selector type podremos definir con qué tipo de campo de selección queremos trabajar. Las opciones que nos ofrece son:

  • Radio
  • Select
  • Image select
  • Check box
  • Numbers, que no es un campo de selección pero que nos permitirá ofrecer la opción de definir las cantidades.

Todas las opciones de selección se definen en el options y definiremos cada una de las variables en una línea y con esta estructura: Opcion 1 $10|10.

Es decir, si queremos que nuestro campo de selección tenga 4 opciones definiremos:

Opcion 1 $10|10.
Opcion 2 $20|20.
Opcion 3 $20|20.
Opcion 4 $20|20.

A parte de las opciones, si nuestro campo es un Image select definiremos las imágenes desde la opción add images.

Por último habilitaremos la opción Send data by label.

select image piotnet addons for elementor

Definendo el campo para los calculos

Para definir el campo que va a realizar los cálculos lo único que debemos realizar diferente es definir el tipo de campo. Para ello desde el selector type definiremos el campo con calculated fields y en la opción calculated realizaremos las operaciones matemáticas utilizando los shortcodes que se crean al definir las ID de los campos. Dichos shortcodes los podremos encontrar en cada uno de los campos del formulario.

Pongamos varios ejemplos.

Necesitamos realizar la suma de 2 campos: [field id=»campo_1″]+ [field id=»campo_2″]

Necesitamos multiplicar 2 campos: [field id=»campo_1″]* [field id=»campo_2″]

Necesitamos sacar el IVA de un total: [field id=»total_presupuesto»]*21/100

Publicamos y ya tenemos nuestro formulario para crear presupuesto en on line.

Piotnet addons también permite crear formularios multipasos, si tienes interés en averiguar cómo hacerlo clica aquí.

También puedes dar un repaso a todo lo que hemos explicado en el siguiente vídeo.

Bien, pues ya te hemos explicado CRÉAR PRESUPUESTOS ON LINE CON WORDPRESS Y ELEMENTOR. Si tienes alguna duda puedes dejarla en comentarios.

¿Tienes interés en que creemos un tutorial sobre algún tema específico de Elementor?

Compártenos en tu red social favorita
Share on facebook
Share on google
Share on twitter
Share on linkedin
Share on whatsapp
Mejorar imágenes para Wordpress

Cómo optimizar imágenes para tu página web

Un elemento que da mucho valor a nuestras paginas o entradas de blog son las imágenes. Hacer uso de una buena imagen en nuestras publicaciones incorpora un número de características que le añaden un valor añadido: Mejoran el SEO: Mediante el uso de las etiquetas

Por que crear paginas web con Wordpress

Por qué crear tu página web con WordPress

En la actualidad existen gran variedad de herramientas para crear una página web sin grandes conocimientos de programación, ejemplo de ello pueden ser Joomla, Wix, Blogger, Weebly o Jimdo. Sin enbargo, de entre todas estas aplicaciones, ¿por qué crear tu página web con WordPress? ¿Qué hace

Cómo crear una conexión FTP

Cómo crear una conexión FTP con tu servidor

Índice de contenidos Qué es FTP FTP o protocolo de transferencia de archivos utiliza el acrónimo de las siglas extraídas del inglés File Transfer Protocol. Se trata de un tipo de protocolo de red para la transferir archivos entre sistemas conectados a una red.  Una

Suscríbete a nuestro blog

Responsable:Carlos Jiménez Mendez
Finalidad:Atender solicitudes de información, ejecución de la contratación de servicios y remisión de comunicaciones comerciales.
Legitimación:Consentimiento del interesado y contratación de productos y/o servicios del Responsable
Destinatarios:No se ceden datos a terceros, salvo obligación legal.
Personas físicas o jurídicas directamente relacionadas con el Responsable
Encargados de Tratamiento adheridos al Privacy Shield
Derechos:Acceder, rectificar y suprimir los datos, portabilidad de los datos, limitación u oposición a su tratamiento, derecho a no ser objeto de decisiones automatizadas, así como a obtener información clara y transparente sobre el tratamiento de sus datos.
Información adicional:Se puede consultar la política de privacidad de forma más detallada aquí.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

He leido y acepto nuestra política de privacidad. *

Responsable:Carlos Jiménez Mendez
Finalidad:Atender solicitudes de información, ejecución de la contratación de servicios y remisión de comunicaciones comerciales.
Legitimación:Consentimiento del interesado y contratación de productos y/o servicios del Responsable
Destinatarios:No se ceden datos a terceros, salvo obligación legal.
Personas físicas o jurídicas directamente relacionadas con el Responsable
Encargados de Tratamiento adheridos al Privacy Shield
Derechos:Acceder, rectificar y suprimir los datos, portabilidad de los datos, limitación u oposición a su tratamiento, derecho a no ser objeto de decisiones automatizadas, así como a obtener información clara y transparente sobre el tratamiento de sus datos.
Información adicional:Se puede consultar la política de privacidad de forma más detallada aquí.
Ir arriba