Artículos sobre: Los Formularios de Contacto
Este artículo también está disponible en:

Cómo vincular el formulario de mi sitio web a Fotostudio

Conectar tu propio formulario a Fotostudio


¿Ya tienes un formulario de contacto en tu sitio (WordPress, Webflow, Wix, HTML…) y quieres que los envíos lleguen directamente a Fotostudio? Esta guía te explica cómo hacerlo.


La ventaja principal: tu formulario sigue siendo 100% a tu imagen: tus colores, tu diseño, tu estilo. Fotostudio recibe los datos en segundo plano sin mostrarse nunca en tu sitio.


Este método es diferente al iframe: con el iframe, es el formulario de Fotostudio el que se muestra en tu sitio. Aquí, es tu formulario existente el que envía los datos a Fotostudio.



1. Obtener tu URL de conexión


Cada formulario de Fotostudio tiene una URL única. Cuando tu formulario envíe los datos a esta URL, Fotostudio creará automáticamente el prospecto, activará sus flujos de trabajo y te enviará la notificación habitual.


Para encontrar esta URL:

  1. Ve a Ajustes → Formularios
  2. Haz clic en el formulario correspondiente
  3. Abre Obtener el código → Conectar tu propio formulario


Esta ventana emergente también genera un código HTML completo, listo para pegar en tu sitio. Ya contiene todos los campos que configuraste en tu formulario de Fotostudio, con los atributos name correctos. Es el punto de partida más sencillo si partes desde cero o quieres comprobar los nombres exactos de los campos.


Tu URL es similar a:

https://app.fotostudio.io/f/abc123def456...



2. Nombrar tus campos


Fotostudio reconoce los campos de tu formulario según su atributo name. Utiliza los siguientes nombres:


Atributo name

Dato guardado

email

Email

firstname

Nombre

lastname

Apellidos

phone

Teléfono

message

Mensaje

company

Empresa

start_date

Fecha de sesión (YYYY-MM-DD)

project_type

ID del tipo de sesión

place

Lugar de la sesión


El código generado en la ventana emergente (paso 1) lista exactamente los campos disponibles para tu formulario.


¿Tienes otros campos? No hay problema. Cualquier campo no reconocido se guarda automáticamente como nota en el contacto (p. ej., un campo presupuesto se guardará tal cual). No se pierde nada.



3. Añadir un anti-spam (recomendado)


Añade este campo invisible a tu formulario. Los bots lo rellenan, los humanos no. Fotostudio rechaza silenciosamente los envíos en los que este campo esté relleno.


<input type="text" name="_gotcha" style="display:none" tabindex="-1" autocomplete="off">



4. Configuración por plataforma


Sitio HTML personalizado


El método más sencillo. Añade action y method a tu etiqueta <form>:


<form action="https://app.fotostudio.io/f/TU_TOKEN" method="POST">
<input type="text" name="firstname" placeholder="Nombre" required>
<input type="text" name="lastname" placeholder="Apellidos" required>
<input type="email" name="email" placeholder="Email" required>
<input type="tel" name="phone" placeholder="Teléfono">
<textarea name="message" placeholder="Tu mensaje"></textarea>
<input type="text" name="_gotcha" style="display:none" tabindex="-1" autocomplete="off">
<button type="submit">Enviar</button>
</form>


Tras el envío, el visitante es redirigido a la URL configurada en Ajustes del formulario → URL de redirección.



Webflow


  1. Selecciona tu bloque Form.
  2. En la configuración del formulario, introduce tu URL de Fotostudio como Action.
  3. Establece el Method en POST.
  4. Nombra cada campo (atributo Name) según la tabla anterior.
  5. Añade un campo de texto llamado _gotcha, establece su valor por defecto en vacío y ocúltalo mediante las opciones de visibilidad.



WordPress — Gravity Forms


  1. Crea tu formulario con los campos deseados.
  2. Ve a Ajustes → Webhooks (requiere el complemento Webhooks de Gravity Forms).
  3. Añade un nuevo webhook:
  • URL: tu URL de Fotostudio
  • Método: POST
  • Formato: Form
  1. En la sección Campos, asigna cada campo de Gravity Forms a su nombre en Fotostudio (email, firstname, etc.).



WordPress — WPForms


  1. Crea tu formulario.
  2. En Ajustes → Webhooks (WPForms Pro), añade un webhook:
  • URL de la solicitud: tu URL de Fotostudio
  • Método: POST
  1. Asigna cada campo a su nombre en Fotostudio.



WordPress — Contact Form 7


CF7 no permite cambiar la acción de forma nativa. Instala el plugin CF7 to API y configura la URL de Fotostudio en sus ajustes. Nombra tus campos según la tabla anterior.



Wix


Wix no permite modificar la acción de un formulario nativo. Utiliza Wix Automations:


  1. Crea tu formulario en Wix.
  2. Ve a Automatizaciones → Nueva automatización.
  3. Disparador: Formulario enviado.
  4. Acción: Enviar un webhook → introduce tu URL de Fotostudio.
  5. Asigna los campos de Wix a los nombres de Fotostudio en el cuerpo de la solicitud.



Typeform / Tally


Estas herramientas disponen de una integración webhook nativa:


  • Typeform: Conectar → Webhooks → introduce tu URL de Fotostudio
  • Tally: Integraciones → Webhook → introduce tu URL de Fotostudio


Asigna cada pregunta a su nombre correspondiente en Fotostudio.



Squarespace


Squarespace no permite modificar la acción de un formulario nativo en los planes básicos. Dos opciones:


  • Plan Business o superior: usa un bloque de código HTML con un formulario personalizado (ve la sección Sitio HTML personalizado más arriba).
  • Todos los planes: usa Make o Zapier para reenviar los envíos a Fotostudio.



FAQ


¿Están protegidos los envíos duplicados?

Sí. Si la misma dirección IP envía el mismo formulario dos veces en menos de 30 segundos (p. ej., doble clic en el botón), el segundo envío se ignora silenciosamente.


¿Mi iframe sigue funcionando?

Sí, ambos métodos (iframe y conexión externa) son totalmente independientes. Uno no afecta al otro.


¿Puedo redirigir al visitante tras el envío?

Sí. Configura la URL de redirección en los ajustes de tu formulario de Fotostudio. El visitante será enviado allí tras enviar tu formulario externo.

Actualizado el: 26/03/2026

¿Este artículo te resultó útil?

Comparte tu opinión

Cancelar

¡Gracias!