El botón de acción

Con el botón de acción, su cliente cierra la configuración: solicita un presupuesto por correo electrónico, descarga un PDF o envía la configuración a su propio sistema. El botón de acción es una característica con ajustes propios. Este artículo explica todas las acciones, los marcadores de posición para correo electrónico y PDF, y lo que debería hacer contra el spam.

Crear el botón de acción

1. Abra el componente y, en el árbol de estructura, haga clic en el + del grupo deseado (Añadir característica).
2. En Ajustes básicos, ponga la Categoría de datos en Frontend y el Tipo de dato en Botón de acción.
3. En Etiqueta, introduzca el texto del botón, p. ej. «Solicitar presupuesto», para cada idioma de contenido.
4. En la sección Ajustes de botón, elija la Acción y rellene los campos correspondientes (véase abajo).
5. Guarde y publique el componente.

El botón muestra la Etiqueta. Si está vacía, V3 muestra el nombre interno. En Legacy aparece además debajo del botón la Información de la característica; en V3, solo el botón.

Los demás campos, como Visibilidad, Orden y Clase CSS, funcionan como en cualquier característica; consulte Añadir características y valores.

Las acciones

Antes de cada acción, el configurador comprueba las entradas: si falta un campo obligatorio, el mensaje aparece en la característica y no se envía nada. En V3, también una regla de tipo Error detiene el botón; consulte Crear un conjunto de reglas.

URL personalizada

En URL POST personalizada introduce la dirección a la que debe ir la configuración, p. ej. https://www.mitienda.es/solicitud.php.

Con {$baseurl}/ruta, la dirección se completa con el dominio de la página en la que se está ejecutando el configurador. Así, el mismo botón funciona en varios dominios.

Cómo llega la configuración (V3): configento.app la envía como JSON a su URL. Para cada característica hay una entrada con su nombre interno que contiene, entre otros, label (etiqueta), value (valor o entrada), valueLabel (etiqueta del valor), choiceSku (número de artículo del valor), valueQty (cantidad) y visibility. Además llega _combined_sku con la referencia combinada del producto configurado (consulte Configuración del componente). Si su URL responde con un PDF, el navegador del cliente lo descarga.

Respuesta de su URL (V3): un estado HTTP 2xx se considera un éxito. A continuación, el cliente pasa a la página de Redirección tras la acción; sin ella, debajo del botón aparece «Enviado correctamente.» Si su URL responde con un PDF (Content-Type: application/pdf), el navegador del cliente lo descarga. El configurador no evalúa el resto de la respuesta, tampoco campos como message o redirect. Cualquier otro estado aparece debajo del botón como «Error al enviar: HTTP …» con el estado. Si quiere evaluar usted mismo la respuesta, por ejemplo para mostrar su propio mensaje u ocultar el formulario, use el evento action; consulte Interfaz JavaScript.

Comprobar el origen (V3): configento.app envía la configuración a su URL desde su servidor, no desde el navegador. Cada solicitud está firmada con la clave de seguridad de su servicio. La encontrará en el portal de servicio, en la página Servicios. Así su URL reconoce las solicitudes que no proceden de configento.app y las rechaza. Si el componente contiene un Captcha, configento.app solo reenvía solicitudes con el Captcha resuelto. Por tanto, una firma válida también significa que el Captcha se ha resuelto.

Compruebe la firma sobre el cuerpo de la solicitud sin modificar y rechace las solicitudes con más de cinco minutos de antigüedad. Ejemplo en PHP:

$body      = file_get_contents('php://input');
$timestamp = $_SERVER['HTTP_X_CONFIGENTO_TIMESTAMP'] ?? '';
$signature = $_SERVER['HTTP_X_CONFIGENTO_SIGNATURE'] ?? '';
$expected  = 'sha256=' . hash_hmac('sha256', $timestamp . '.' . $body, 'SU-CLAVE-DE-SEGURIDAD');

if (!hash_equals($expected, $signature) || abs(time() - (int) $timestamp) > 300) {
    http_response_code(403);
    exit;
}
$configuracion = json_decode($body, true);

Si su servicio no tiene clave de seguridad, faltan X-Configento-Timestamp y X-Configento-Signature.

En Legacy, el navegador del cliente envía la configuración directamente a su URL. Su servidor debe permitir solicitudes desde el dominio de su tienda (CORS).

Entregar a la página

Con esta acción no es configento.app quien envía la configuración, sino su página: el botón comprueba las entradas y entrega la configuración a su JavaScript, que la envía a su propio servidor. Esto encaja si ya tiene un endpoint propio o si reacciona de forma distinta según la tienda o el idioma, por ejemplo con destinatarios propios. Las reglas y la visibilidad del botón funcionan como en cualquier otra acción.

La acción necesita el motor V3; por eso, un componente con este botón siempre funciona con V3. Cómo recibe su JavaScript la configuración y cómo comprueba el Captcha en su servidor se explica en Interfaz JavaScript.

Generar PDF

El Contenido del PDF se edita haciendo clic en la vista previa (Clic para editar). En CSS del cuerpo (opcional) puede guardar reglas CSS propias para el PDF. El encabezado y el pie, el logotipo y la fuente proceden de la Marca.

La descarga solo funciona en V3. En Legacy, el PDF se genera pero no se entrega al cliente: use allí Enviar correo con PDF.

Enviar correo

Preparar el campo de destinatario: solo se pueden elegir características del tipo Campo de entrada pequeño con Entrada permitida = Correo electrónico. Si no hay ninguna, el editor muestra «Cree una característica de texto con validación de e-mail para usarla como destinatario.» Créela y ponga Campo obligatorio en Sí. La lista muestra los nombres internos de las características.

Remitente y envío: el correo sale a través de su propio servidor SMTP. La dirección y el nombre del remitente proceden de Ajustes → Envío de e-mail. Si los ajustes no están completos allí, no se envía ningún correo; consulte Configuración global.

Idiomas: el asunto y el contenido se mantienen para cada idioma de contenido. El editor avisa mientras falte una parte en el idioma seleccionado. Se envía en el idioma en el que el cliente usa el configurador; si falta un texto para ese idioma, configento.app usa el idioma predeterminado del componente. Legacy decide según el idioma del navegador: alemán o, en otro caso, inglés.

Enviar correo con PDF muestra juntos los campos de correo y de PDF.

Redirección tras la acción

En Redirección tras la acción puede introducir opcionalmente una página a la que se lleva al cliente tras una acción correcta, p. ej. una página de agradecimiento. Sin redirección, V3 muestra debajo del botón «Enviado correctamente.» Legacy no muestra ningún mensaje sin redirección: introduzca allí una página de agradecimiento para que el cliente vea que su solicitud ha llegado.

Marcadores de posición

Los marcadores de posición funcionan en Asunto, Contenido del correo, Contenido del PDF y Nombre de archivo.

En {{characteristic:NAME.FELD}}, NAME es el nombre interno de la característica y FELD uno de estos campos:

Ejemplo: Hola {{characteristic:nombre.value}}, su color: {{characteristic:color.valueLabel}}.

En casillas de verificación y selección múltiple, varios valores se unen con comas. Un nombre desconocido da un texto vacío.

{{configuration_table}} solo muestra características con Visibilidad Sí (visible) o Solo backend que tengan un valor. Los encabezados de columna son siempre alemanes: «Merkmal», «Auswahl», «Artikel-Nr.» y «Menge».

Protección contra spam con Captcha

Una acción de correo es un formulario público: quien lo encuentre puede enviar con él correos a cualquier dirección, a través de su servidor SMTP. Si el componente no contiene ningún Captcha, el editor avisa: Riesgo de spam: ningún Captcha en este componente.

Así protege el botón:

1. Cree en el mismo componente una característica con el tipo de dato Captcha (solo V3), preferiblemente justo encima del botón de acción.
2. Ponga el componente en el motor de frontend V3; consulte Motor de frontend: Legacy o V3.

En cuanto el componente contiene un Captcha, configento.app solo envía correos y PDF con el Captcha resuelto. El cliente apenas lo nota: su navegador resuelve el Captcha en segundo plano.

Además, configento.app limita el envío: como máximo 100 correos por hora por botón de acción y 10 por minuto por visitante. Si alguien envía la misma configuración de nuevo en menos de un minuto, no sale un segundo correo.

Lo que ve el cliente

Cuándo se aplican los cambios

Los cambios en el botón de acción – acción, textos, campo de destinatario – solo se aplican en la tienda después de publicar. Los cambios en Envío de e-mail y Marca en los ajustes, en cambio, tienen efecto inmediato.

Varios botones

Si necesita varias acciones, cree varios botones de acción, p. ej. «Descargar PDF» y «Presupuesto por correo». Cada botón tiene su propia acción y sus propios textos.

Botón de acción con el agente de IA

El agente de IA puede configurar un botón de acción por usted: «Crea un botón ‹Solicitar presupuesto› que envíe un correo con PDF a la dirección del campo Correo, con copia a ventas@mitienda.es.» Revise después los textos y el campo de destinatario en el editor. Más información: Agente de IA: Crear configurador mediante chat.

Solución de problemas

1. Debajo del botón aparece «Esta acción no tiene un endpoint configurado.» – en URL personalizada falta la URL POST personalizada. En las demás acciones: guarde y publique el componente.
2. No llega ningún correo – compruebe en Ajustes → Envío de e-mail la conexión con Probar conexión y un correo de prueba. Compruebe si hay un Campo de destinatario elegido y si el cliente ha introducido allí una dirección válida.
3. «Error al enviar: HTTP 403» – la página funciona en un dominio de tienda que no figura en Ajustes → Dominios, o no se ha resuelto el Captcha. La vista previa del admin y las tiendas Shopify nunca se rechazan por el dominio, así que puede probar el botón en la vista previa.
4. «Error al enviar: HTTP 429» – se ha alcanzado el límite de envío. Espere unos minutos.
5. «Error al enviar: HTTP 500» – casi siempre faltan los ajustes SMTP o el servidor SMTP rechaza el envío.
6. Un marcador de posición queda vacío – compruebe el nombre interno (mayúsculas y minúsculas) y el campo. {{combined_image}} siempre está vacío en Legacy y necesita además una imagen de producto combinada en el componente. {{combined_sku}} queda vacío si ni los valores elegidos ni las características tienen número de artículo.
7. El correo llega en el idioma equivocado – para el idioma del cliente falta el asunto o el contenido. Cambie en Idioma del contenido: a ese idioma y rellene ambos.
8. El botón no hace nada y una característica aparece marcada en rojo – falta un campo obligatorio o se cumple una regla de error. El mensaje aparece en la característica o debajo del precio total.
9. Debajo del botón aparece «La página no tiene ningún controlador configurado para este botón.» – está elegida la acción Entregar a la página, pero en la página falta el JavaScript que recibe la configuración. Consulte Interfaz JavaScript.

Próximos pasos

• Añadir características y valores
• Configuración global
• Motor de frontend: Legacy o V3
• Integración fragmento HTML