Contenido

El video tutorial, #2, #3

Documentación Calculoidea Para Desarrolladores.

Cómo crear, guardar y borrar una calculadora

Cómo agregar y eliminar un campo

Diseño de calculadora y diseño de campo.

Tipos de campos disponibles

Campos condicionales

Cómo configurar una calculadora

Cómo integrar una calculadora

Cómo integrar Google Analytics

Cómo rellenar previamente los datos en la calculadora

Cómo incrustar una calculadora

Estadística

Cómo crear, guardar y borrar una calculadora

Calculoid.com es una aplicación web JavaScript simple y estática que usa el framework AngularJS para ejecutarse. Es una aplicación de peso pesado en comparación con la aplicación incrustada cuyo objetivo principal es ser una biblioteca pública para calculadoras y un potente editor de calculadora. Para más información sobre Calculoid, por favor lea "¿Cómo funciona Calculoide?".

Para crear una nueva calculadora, vaya a "Lista de calculadoras"en el menú principal y haga clic en"Nueva calculadora"en la esquina superior derecha. En el primer paso (elija su plantilla), seleccione la plantilla de su calculadora (blanco, precios, ROI, costo, etc.).

Calculoid.com

En el segundo paso (configuración básica de la calculadora), ingrese el nombre de la calculadora, descripción, idioma, etiquetas y haga clic en "Guardar configuración". Se lo dirigirá al asistente de construcción, donde puede agregar campos a su calculadora.

Calculoid.com

Para guardar los cambios que ha realizado en su calculadora, use el botón verde "Guardar calc"En la esquina superior derecha.

Para borrar una calculadora, vaya a "Config"pestaña y desplácese hacia abajo hasta la parte inferior donde se encuentra"Eliminar calculadora" opción.

Cómo agregar y eliminar un campo

En "añadir", elija un campo para agregar - control deslizante / cuadro de radio / campo de texto / fórmula / casilla de verificación / enviar resultados / pagos / html / textarea / gauge. En el"Editar"pestaña, editar el campo particular.

Para borrar un campo desde su calculadora, haga clic en "Editar"(un icono de lápiz) en el campo particular y luego el"Editar"La pestaña se abrirá en el lado izquierdo y allí encontrarás"Quitar campo" opción.

Calculoid.com

Las configuraciones básicas son las mismas para todos los tipos de campos:

  • Nombre del campo - asigne un nombre al campo y elija si desea mostrar el nombre y si desea mostrar el campo al público
  • Lugares decimales - elegir cuántos decimales mostrar
  • Insinuar - pista de campo
  • Prefijo - agregue un prefijo como% o una moneda
  • Sufijo - agregue un postfix como% o una moneda

Calculoid.com

Diseño de calculadora y diseño de campo.

Hay dos configuraciones de diseño en Calculoid: una para toda la calculadora y la segunda para cada campo de la calculadora. El diseño de la calculadora se puede configurar en Config> Diseño, Respectivamente Config> Diseño avanzado. El diseño de campo se puede configurar bajo Editar campo> Diseño. Si el diseño de campo está configurado, anula la configuración de diseño de la calculadora. Si el diseño del campo no está configurado, entonces el diseño de la calculadora se aplica también al campo.

Calculoid.com

Tipos de campos disponibles

Control deslizante: campo variable, los usuarios definen el valor de la variable deslizando el puntero en la barra.

El campo Control deslizante es una excelente opción si tiene que saber el valor máximo y mínimo para este campo. Por ejemplo, si desea permitir que un usuario seleccione un porcentaje, sabe que el valor mínimo es 0 y el valor máximo es 100%. Este campo es un elemento interactivo agradable para toda la calculadora, ya que permite al usuario arrastrar y soltar el puntero o seleccionar un valor con solo un clic o toque porque este campo también está optimizado para dispositivos móviles.

Opciones:

  • Valor mínimo: El valor mínimo que un usuario puede seleccionar. 0 por defecto.
  • Valor máximo: El valor máximo que un usuario puede seleccionar. 100 por defecto.
  • Paso: El paso que el deslizador puede seleccionar. Por ejemplo, si tiene un control deslizante de 0 a 1.000.000, puede permitir que un usuario seleccione solo miles completos seleccionando el paso para ser 1000. 1 por defecto.
  • Valor por defecto: El valor predeterminado que un usuario verá cuando la calculadora se carga por primera vez.
  • Escala: El campo del control deslizante puede mostrar una escala debajo del control deslizante. Rellene los valores de escala separados por caracteres de coma. Por ejemplo: 25,50,75. Si desea mostrar algunas etiquetas en lugar de los números reales, agregue etiquetas como esta: 25: bajo, 50: medio: 75: alto.

Usos calculoides esta biblioteca de código abierto para deslizadores.

Calculoid.com

Radio Box: campo variable, los usuarios seleccionan un valor / opción de la lista definida.

Opciones:

  • nueva Opción - Añadir una nueva opción para seleccionar.
  • Nombre de la opción - un nombre de la opción
  • Valor de la opción - un valor oculto de la opción, como el precio (debe ser numérico y único para cada opción)

Configuración de campo de radio:

  • Valor por defecto - un valor preseleccionado por defecto cuando se carga la calculadora (la opción que tiene este valor será preseleccionada)
  • columnas - una serie de columnas para mostrar las opciones en

Calculoid.com

Campo de texto: campo variable, los usuarios insertan el valor variable manualmente en el campo de texto.

Configuración de campo de texto:

  • Valor por defecto - Un valor precargado de forma predeterminada, como una cadena de texto o un número
  • ¿Es requerido? - Sí / No - Seleccione si el campo debe ser completado
  • Tipo de campo - Texto / Número / Email / Teléfono / Otro
  • Cadena de fuerza - Sí / No: cualquier entrada ingresada en el campo será del tipo de datos de cadena, incluidos los números, para evitar el cambio automático de formato cuando no sea deseable (por ejemplo, números de cuentas bancarias, números de identificación personal, números de seguridad social, etc.)

Para obtener más información sobre el campo de texto, lea:

Calculoid.com

Fórmula: en el campo de resultados, el administrador define cómo se calculan las variables. Los usuarios ven el resultado.

Para más información sobre Formula, por favor lea:

Calculoid.com

Casilla de verificación: campo de variables, los usuarios seleccionan más opciones / valores de la lista definida.

Checkbox Field Config:

  • Valor si está marcado - un valor numérico del campo cuando está marcado
  • Valor si no está marcada - un valor numérico del campo cuando no está marcado

Calculoid.com

Enviar resultados: campo de conversión, un resultado del cálculo se puede enviar en el correo electrónico enviado.

Detalles de correo electrónico:

  • Enviar resultados también a
  • Enviar desde correo electrónico
  • Nombre del remitente
  • Asunto
  • Redireccionar - Introduce la URL para redirigir
  • Enviar email - Si no

Para más información sobre Enviar Resultados, por favor lea "Elabore un correo electrónico de resultados con el más mínimo detalle.".

Calculoid.com

Pagos: campo de conversión, los usuarios pueden pagar montos calculados en la cuenta del administrador

Métodos de pago disponibles:

  • PayPal
  • TARJETA
  • Factura / transferencia bancaria

Detalles del pago:

  • Enviar información sobre el pedido a
  • Moneda - Seleccione una moneda de la lista
  • Campo de precios - Elija un campo con información de precios.
  • Redireccionar - Introduce la URL para redirigir
  • Asunto del correo electrónico
  • Correo electrónico Enviar desde
  • Nombre del remitente
  • Puerta de pago predeterminada - PayPal / Stripe
  • Enviar email - Si no

Datos de facturación:

  • ¿Mostrar información de facturación? - Si no

Variables disponibles:

  • {cantidad} - El importe numérico del campo que ha seleccionado para ser pagado.
  • {moneda} - La moneda que has seleccionado.

Calculoid.com

Recurrencia del pago:

Esta función permite repetir un pago automáticamente en un ciclo / período recurrente definido. Ve a la "Campo de edición"menú de un"Pagos"campo. Aquí abre el"Recurrencia del pago"submenú. Para que la repetición de pagos funcione, debe configurar los siguientes campos:

  • Habilitar pagos recurrentes - por defecto - Seleccione Sí o No para habilitar / deshabilitar los pagos recurrentes para este campo de forma predeterminada.
  • Habilitar pagos recurrentes - anulación de campo - Seleccione qué campo controla si el recurrente está habilitado. El valor del campo 1 para habilitado, cualquier otro valor significa deshabilitado. Esto le da al usuario la libertad de decidir por sí mismo y anula la configuración predeterminada definida anteriormente.
  • Ciclo recurrente - por defecto - Seleccione la unidad de tiempo para el período recurrente (días, semanas, meses o años).
  • Ciclo recurrente - anulación de campo - Seleccione qué campo contiene el ciclo recurrente. El valor del campo debe ser uno de los siguientes caracteres: D, W, M, Y. Esto le da al usuario la libertad de decidir por sí mismo y anula la configuración predeterminada definida anteriormente.
  • Periodo recurrente - predeterminado: ingrese el número de pagos entre ciclos.
  • Período recurrente - anulación de campo - Seleccione qué campo contiene el período recurrente. El valor del campo debe ser un número positivo (entero). Esto le da al usuario la libertad de decidir por sí mismo y anula la configuración predeterminada anteriormente definida.

Los detalles sobre los pagos realizados también se pueden encontrar en Detalles> Envíos Menú de la calculadora con el campo de pago. Además, si tiene su calculadora integrada con un sistema externo (como Mautic, Redmine u otros), se puede configurar un pago realizado para crear automáticamente un caso de CRM en el sistema.

Calculoid.com

Para obtener más información acerca de los pagos, por favor lea:

HTML: campo de descripción, sirve para insertar cualquier HTML en la calculadora.

El campo HTML está limitado por aproximadamente 3000 caracteres. Para reducir el número efectivo de caracteres, elimine los estilos de fuente HTML (color, tamaño ...) del texto.

Calculoid.com

Textarea: el usuario de la calculadora puede escribir un mensaje antes de enviar su resultado.

Textarea Field Config:

  • Altura Textarea - introduzca un valor en píxeles
  • Mostrar recuento de palabras - Si no

Calculoid.com

Indicador: un gráfico que parece que el tacómetro puede mostrar el valor de cualquier campo.

Configuración del medidor:

  • Mostrar valor desde el campo - Seleccione un campo en la lista
  • Ancho máximo del medidor - introduzca un valor en píxeles
  • Valor mínimo
  • Valor máximo
  • Garrapatas mayores - el número de marcas principales en el indicador
  • Garrapatas menores - el número de marcas menores en el indicador
  • Verde De + Verde a - El rango de valores para el color verde en el indicador.
  • Amarillo De + Amarillo a - El rango de valores para el color amarillo en el indicador.
  • Rojo de + rojo a - El rango de valores para el color rojo en el indicador.

Calculoid.com

Gráfico circular: un gráfico circular para ilustrar la proporción numérica

Un gráfico circular (o un gráfico circular) es un gráfico estadístico circular, que se divide en segmentos para ilustrar la proporción numérica. En un gráfico circular, la longitud del arco de cada corte (y, en consecuencia, su ángulo central y área), es proporcional a la cantidad que representa.

Configuración de gráfico:

  • Nueva fila - Añadir una nueva fila en el gráfico circular
  • Nombre de la fila - ingrese un nombre de la fila
  • Valor de la fila - Seleccione cualquier campo para tomar el valor numérico de
  • Altura + Ancho - Permitir cambiar las dimensiones por defecto del gráfico circular.

Calculoid.com

Seleccionar campo - Un menú desplegable con opciones ilimitadas

A diferencia del campo de casilla de radio con opciones mostradas como casillas de verificación, el campo Seleccionar está diseñado como Menú desplegable por lo que se adapta mejor a las situaciones cuando el número de opciones es muy alto. En "Editar campo> Opciones", puede elegir si desea agregar nuevas opciones manualmente o seleccionar una tabla para importar las opciones desde. Si selecciona la segunda opción, asegúrese de que la tabla se agregue primero antes de poder seleccionar una. Para agregar una tabla en Calculoid, use la "tablas"en la parte superior de la pantalla. Al agregar una tabla de un archivo CSV, tenga en cuenta que solo comas (no punto y coma) se admiten como separador de campo en el archivo.

Seleccione campo con opción de importación CSV - Calculoid.com

Campos condicionales

En Calculoid, la configuración de condiciones lógicas se utiliza para mostrar / ocultar campos específicos de una calculadora. Cuando se cumplen las condiciones para un campo específico, se muestra el campo (campo blanco), de lo contrario, se oculta (campo gris). Dicho comportamiento es práctico cuando algunos campos de una calculadora solo son relevantes cuando se ingresan valores numéricos específicos en otros campos (como un control deslizante, calibre, fórmula ...), es decir, la entrada de datos solo se requiere bajo condiciones específicas pero no de otra manera. Para obtener más información sobre los campos condicionales, lea "Calculadora web con campos condicionales.".

Calculoid.com

Cómo configurar una calculadora

Una vez que haya editado todos sus campos, continúe con el "configurar"pestaña con las siguientes opciones:

  • Contacto - cambiar el nombre de la calculadora
  • Descripción - editar la descripción de la calculadora
  • Language - Elija el idioma de la calculadora.
  • tema - Elija el tema de apariencia por defecto
  • Esquema de colores
  • Tags - etiqueta tu calculadora
  • Está terminado - su calculadora solo aparecerá en línea una vez incrustada cuando haga clic en SÍ
  • Calculadora - mira nuestra Preguntas Frecuentes Para información sobre calculadoras públicas y privadas.
  • Firma - mira nuestra Preguntas Frecuentes Para obtener información sobre la firma, puede ocultarse solo cuando tiene una suscripción pagada.
  • Notificación
  • Separador de miles
  • Separador decimal

Calculoid.com

Cómo integrar una calculadora

En el "Integrar"pestaña, puedes encontrar las integraciones disponibles:

  • web hook
  • Mautic
  • Redmine
  • Fácil Redmine CRM

Calculoid.com

Cómo integrar Google Analytics

Google Analytics puede rastrear eventos en campos específicos de la calculadora, a saber, "Enviar resultados"Y"Pagos". Ve a la "Campo de edición"Menú del campo respectivo. Aquí se abre el"En la presentación"submenú. Cambiar el"Enviar evento de Google Analytics?"valor a Sí. Para que los eventos de Google Analytics funcionen, debe configurar los siguientes campos e incluir también analytics.js en la misma página donde incrusta su calculadora. La versión iframe no es compatible. Los eventos no se activarán al editar o previsualizar la calculadora.

  • Categoría de evento de Google Analytics (por ejemplo, "Video")
  • Acción del evento de Google Analytics (por ejemplo, "jugar")
  • Etiqueta de evento de Google Analytics (por ejemplo, "Campaña de Otoño")
  • Valor del evento de Google Analytics (por ejemplo, 42)

Calculoid.com

Los datos creados por una actividad en los campos específicos de Calculoid se mostrarán en Google Analytics como eventos con atributos definidos arriba.

Calculoid.com

Cómo rellenar previamente los datos en la calculadora

Hay dos formas de rellenar previamente los datos en la calculadora, por cadena de consulta de URL o en el atributo ng-init en el elemento <div>.

Por ng-init atribute

La configuración de relleno se inserta en la función ng-init - init () como nuevo objeto valores (ejemplo: valores: {}). Para establecer valores individuales, debe agregar una clave con la ID del campo y su valor. (ejemplo: valores: {F12345: 'valor de ejemplo'} - esta configuración de ejemplo rellenará previamente el ID de campo F12345 con 'valor de ejemplo'). Por lo tanto, el código de inserción se verá así:

<link rel = "hoja de estilo" href = "http://embed2.calculoid.com/styles/main.css" />
<script src = "http://embed2.calculoid.com/scripts/combined.min.js"> </script>
<div ng-app = "calculoid" ng-controller = "CalculoidMainCtrl" ng-init = "init ({calcId: 12345, apiKey: 'xxxxxxxxx', valores: {F12345: 'valor de ejemplo'}})" ng-include = "cargar ()"> </div>

Es posible rellenar solo los campos de correo electrónico, control deslizante, radio, texto, área de texto, pago y casilla de verificación.

Si se utiliza el campo de pago en su calculadora, es posible rellenar previamente todas las informaciones de facturación (excepto las casillas de verificación personalizadas) agregando un nuevo objeto facturación dentro valores{} (ejemplo: valores: {facturación: {}}).

Facturación inf. rellenar previamente

dirección, ciudad, nombre de la empresa, país, correo electrónico, nombre, apellido, oac, teléfono, vatid, zip

Ejemplo:

<link rel = "hoja de estilo" href = "http://embed2.calculoid.com/styles/main.css" />
<script src = "http://embed2.calculoid.com/scripts/combined.min.js"> </script>
<div ng-app="calculoid" ng-controller="CalculoidMainCtrl" ng-init="init({calcId:12345,apiKey:'xxxxxxxxx', values:{ F12345 : 'example value', billing:{address:‘Example address‘, city:‘Example city‘, country:‘US‘, zip:‘111111‘, email:‘This email address is being protected from spambots. You need JavaScript enabled to view it.‘, firstname:‘John‘, lastname:‘Doe‘, oac:true, phone:‘+111123456789‘, companyName:‘Company name‘, vatid:‘GBxxxxxxxx‘} })" ng-include="load()"></div>

oac = Orden como casilla de verificación de la empresa (solo puede ser verdadero or false)

Por cadena de consulta de URL

Los datos se insertan agregando parámetros de consulta en formato: field_id = prefilled_value

Ejemplo:

http://www.your.domain/index.html?F12345=example%20text&F12346=another%20example%20text

(Nota: los datos tienen que estar codificados en URL, más información)

Variables utilizables en fórmula

  • FX - valor del campo (excepto correo electrónico, pago y campo HTML) * reemplaza FX con el ID de campo. Ejemplo: F3456
  • BillingFirstname - Nombre de la información de facturación de pago
  • BillingLastname - apellido de la información de facturación de pago
  • BillingAddress - dirección de la información de facturación de pago
  • BillingCity - ciudad a partir de la información de facturación de pago
  • País de facturación - país a partir de la información de facturación de pago
  • BillingZip - código postal de información de facturación de pago
  • BillingCompanyName: nombre de la compañía a partir de la información de facturación de pago
  • BillingVatid - ID de IVA de la información de facturación de pago
  • BillingValidViesVatID: si la validación de ID de IVA por VIES habilitó esta var. devuelve 1 cuando la validación es exitosa, de lo contrario 0
  • PaymentType: devuelve el tipo de pago seleccionado (paypal = 1, stripe = 2, factura = 3)

Variables disponibles para integraciones y correos electrónicos.

Algunos tipos de campos (como Enviar resultados o Pagos) usan plantillas de correo electrónico. En las plantillas, estas variables serán reemplazadas por datos reales antes de que se envíe el correo electrónico. Lo mismo se aplica para las integraciones.

  • {FX: valor} - valor de campo único * Reemplace FX con el ID de campo. Ejemplo: F3456
  • {FX: nombre} - nombre de campo único * Reemplace FX con el ID de campo. Ejemplo: F3456
  • {FX: pista} - descripción de un solo campo * Reemplace FX con el ID de campo. Ejemplo: F3456
  • {FX: prefijo} - texto de un solo campo antes del valor * Reemplace FX con el ID de campo. Ejemplo: F3456
  • {FX: postfix} - texto de campo único después de valor * Reemplace FX con el ID de campo. Ejemplo: F3456
  • {calculatorName} - nombre de la calculadora
  • {campos} - lista de campos
  • {sourceUrl} - URL de la calculadora
  • {description} - descripción de la calculadora
  • {userName} - nombre de la cuenta del autor
  • {email} - dirección de correo electrónico de correo electrónico o campo de pago
  • {precio} - precio del campo de pago
  • {moneda} - moneda del campo de pago
  • {status} - estado de pament
  • {Facturación: Nombre} - nombre de pila de pago
  • {Facturación: Apellido} - apellido de la información de facturación de pago
  • {Dirección de Envio} - dirección de pago de información de facturación
  • {Facturación: Ciudad} - ciudad a partir de la información de facturación de pago
  • {Facturación: País} - país a partir de la información de facturación de pago
  • {Facturación: Zip} - código postal de la información de facturación de pago
  • {Facturación: CompanyName} - nombre de la empresa a partir de la información de facturación de pago
  • {Facturación: Vatid} - ID de IVA de la información de facturación de pago
  • {submitId} - ID única de correo electrónico o envío de pago (se puede usar como número de referencia para la factura)

Cómo incrustar una calculadora

Para insertar una calculadora, vaya a la "Incrustar"y copie un código HTML:

  • Código HTML sin iFrame - Este código adoptará el CSS de su sitio web. Asegúrate de probar el código en CodePen
  • Código HTML con iFrame - Si tiene algún problema con el formato al integrar la calculadora en su sitio web, use la segunda opción donde la calculadora mostrará el formato que eligió en Calculoid al crear su calculadora.

Para más información sobre la incrustación, lea "Incrustación de las calculadoras de Calculoid".

Calculoid.com

Estadística

Para encontrar detalles de envío e informes para una calculadora en particular, vaya a "Detalles"pestaña arriba de tu calculadora. Para estadísticas globales, haz clic en el ícono de tu perfil en la esquina superior derecha y abre"Estadística" opción del menú.

  • Envíos - vea todas las presentaciones realizadas a través de su (s) calculadora (s), incluidos los pagos y los pagos pendientes
  • Informes - ver cuántas veces se han visto sus calculadoras y cuántas presentaciones se han realizado
    Webhooks

Calculoid.com

Información adicional

Empiza La Prueba Gratuita

Crea tu propia calculadora web en cuestión de minutos.
Prueba todas las características en la prueba gratuita de 14-day.

Ahora comenzar gratuito

No necesita tarjeta de crédito ni instalación

Contacto

Teléfono

+1 415 800 3787

Información

info@calculoid.com

Soporte

support@calculoid.com

Easy Software Ltd.

Casa Kemp, 152-160
City Road, EC1V
2NX Londres, Reino Unido
ID de la empresa: 08960980
ID IVA: GB226711521

Centro de desarrollo facil

Jugoslávských partyzánů 34
160 00 Praga
República Checa