Docusaurus
Formulario de contacto para Docusaurus sin backend.
Docusaurus convierte componentes MDX y React en un sitio de documentación estático. Un formulario incrustado en una página MDX no puede recibir solicitudes en el host de documentación, así que envíe sus campos HTML estándar a FormsFort.
Cómo funciona
Tres pasos para la producción de formularios.
Cree el formulario del endpoint
Cree un formulario de FormsFort y copie la clave de acceso pública para la página de Docusaurus.
Añada una página MDX
Coloque el formulario en src/pages/contact.mdx o en un componente del sitio. Mantenga action como un POST normal del navegador.
Compile el sitio de documentación
Ejecute npm run build y despliegue build/. Docusaurus sirve los archivos generados; FormsFort recibe el envío.
Configuración
Página MDX de Docusaurus con formulario de contacto
<!-- src/pages/contact.mdx -->
import Layout from '@theme/Layout';
<Layout title="Contact">
<main>
<h1>Ask the docs team</h1>
<form action="https://api.formsfort.com/submit" method="POST">
<input type="hidden" name="access_key" value="YOUR_ACCESS_KEY" />
<label htmlFor="docusaurus-name">Name</label>
<input id="docusaurus-name" name="name" type="text" required />
<label htmlFor="docusaurus-email">Email</label>
<input id="docusaurus-email" name="email" type="email" required />
<label htmlFor="docusaurus-question">Question</label>
<textarea id="docusaurus-question" name="message" rows="7" required />
<input type="hidden" name="source" value="docusaurus-docs" />
<input type="checkbox" name="botcheck" style={{ display: 'none' }} />
<button type="submit">Send question</button>
</form>
</main>
</Layout>Migración
Lista de verificación de migración.
Mueve un formulario existente en minutos sin reconstruir el marcado.
Cree un formulario FormsFort y copie la clave de acceso público.
Agregue src/pages/contact.mdx o coloque el formulario en un componente React de Docusaurus.
Establezca action=https://api.formsfort.com/submit con method=POST.
Use ids de campo únicos e incluya los campos name, email, message, source y botcheck.
Ejecute npm run build y despliegue el directorio build/ generado; no dependa de un servidor de ejecución de Docusaurus.
Pruebe el formulario en su URL de documentación desplegada y confirme que llega la notificación.
Recursos relacionados
Sigue construyendo desde aquí.
Jamstack Form Backend
Compare patrones de entrega de formularios alojados para sitios de documentación generados.
Notificaciones de formularios
Configure dónde deben entregarse y confirmarse los envíos de Docusaurus.
API del formulario de contacto
Use un flujo de respuesta programático solo cuando un POST HTML simple no sea suficiente.
Preguntas frecuentes
Preguntas comunes.
¿Docusaurus puede aceptar un POST de formulario desde su salida de compilación?
No. Docusaurus genera HTML y recursos estáticos en build/; esos archivos no exponen un controlador de solicitudes. Apunte action del formulario a FormsFort.
¿El formulario necesita un plugin de Docusaurus o un servidor Node?
No. Una página MDX o un componente React puede renderizar el formulario estándar sin un plugin de envíos. El endpoint externo de FormsFort gestiona la entrega.
¿Puedo poner este formulario dentro de una página de documentación?
Sí. Añada el marcado a una página MDX o componente compartido permitido por su sitio. Mantenga sin cambios action, method y los nombres de campo de FormsFort.
¿Los formularios Docusaurus pueden incluir un adjunto?
Sí. Añada enctype="multipart/form-data" y una entrada de archivo, y active las cargas en FormsFort. La página Docusaurus generada seguirá enviando directamente al endpoint.
Dejar de administrar servidores de formularios.
Cree un endpoint de formulario de producción, migre su primer formulario de forma gratuita y escale cuando esté listo.