Formulario de solicitud de soporte

Los clientes describen el problema con el detalle suficiente para resolverlo en la primera respuesta.

¿Usas Tilda? Pégalo en un bloque T123 (plan de pago) o usa el webhook sin código.

Activa los adjuntos en los ajustes e instala Turnstile. Los PDF, JPEG y PNG de hasta 5 MiB se guardan de forma privada; descargar requiere iniciar sesión como propietario.

Para qué sirve este formulario

La mayoría de las conversaciones de soporte necesitan tres correos porque en el primero falta algo. Este formulario pide el tema, la urgencia y los pasos que llevan al problema, para que la primera respuesta pueda ser la solución.

Una captura de pantalla suele explicar más que un párrafo. La plantilla acepta una imagen o un PDF de hasta 5 MiB, o un enlace si el archivo es más grande.

Los campos que importan

Tema
Cuenta, facturación, un error o una pregunta. Envía la solicitud a la persona adecuada.
Urgencia
Te permite atender primero a los clientes bloqueados.
Pasos hasta el problema
Obligatorio. Los pasos te permiten reproducir el problema en lugar de adivinar.
Captura de pantalla
Un archivo de hasta 5 MiB, o un enlace. Muestra lo que ve el cliente.

Vista previa

Problema

Contacto

Código del formulario

HTML
<!doctype html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Formulario de solicitud de soporte</title>
<style>
  body { font-family: "Segoe UI", sans-serif; color: #12263a; margin: 0; background: #fff; }
  main { max-width: 640px; margin: 0 auto; padding: 32px 20px 64px; }
  h1 { font-size: 28px; font-weight: 650; letter-spacing: -0.02em; line-height: 1.2; }
  h2 { font-size: 18px; margin: 18px 0 0; }
  p { line-height: 1.5; }
  form { display: grid; gap: 14px; position: relative; }
  .field { display: grid; gap: 6px; }
  label span, .check span { font-size: 14px; }
  input, select, textarea { font: inherit; color: inherit; padding: 10px 12px; border: 1px solid #b4bdce; border-radius: 8px; width: 100%; box-sizing: border-box; background: #fff; }
  textarea { min-height: 96px; }
  .check { display: flex; gap: 8px; align-items: flex-start; }
  .check input { width: auto; margin-top: 4px; }
  button { background: #3c4ad8; color: #fff; border: 0; border-radius: 8px; padding: 12px 18px; font: inherit; cursor: pointer; }
  .note { background: #fff6eb; padding: 12px 14px; border-radius: 8px; }
  form [data-show-if] { display: none; }
</style>
</head>
<body>
<main>
<h1 data-i18n="title">Formulario de solicitud de soporte</h1>
<p data-i18n="lede">Los clientes describen el problema con el detalle suficiente para resolverlo en la primera respuesta.</p>


<form id="fg-form" action="https://formgong.com/submit" method="POST" enctype="multipart/form-data" data-sitekey="" data-lang="es">
<input type="hidden" name="access_key" value="fk_your_access_key">
<input type="hidden" name="_lang" value="es">
<div aria-hidden="true" style="position:absolute;inset-inline-start:0;top:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)"><label>Leave this field empty<input name="botcheck" tabindex="-1" autocomplete="off"></label></div>
<section><h2 data-i18n="section.issue">Issue</h2>
<div class="field"><label for="fg-category"><span data-i18n="category">What do you need help with?</span></label><select id="fg-category" name="category" required><option value="">—</option><option value="account" data-i18n="category.account">Account or login</option><option value="billing" data-i18n="category.billing">Billing</option><option value="bug" data-i18n="category.bug">Something is broken</option><option value="how_to" data-i18n="category.how_to">How do I…?</option><option value="other" data-i18n="category.other">Other</option></select></div>
<div class="field"><label for="fg-urgency"><span data-i18n="urgency">How urgent is it?</span></label><select id="fg-urgency" name="urgency" required><option value="">—</option><option value="blocking" data-i18n="urgency.blocking">It blocks my work</option><option value="soon" data-i18n="urgency.soon">Soon, but not blocking</option><option value="later" data-i18n="urgency.later">Whenever you can</option></select></div>
<div class="field"><label for="fg-details"><span data-i18n="details">Describe the problem and the steps that lead to it</span></label><textarea id="fg-details" name="details" required maxlength="2000"></textarea></div>
<div class="field"><label for="fg-screenshot"><span data-i18n="screenshot">Screenshot, up to 5 MiB</span></label><input id="fg-screenshot" name="screenshot" type="file" accept="image/png,image/jpeg,application/pdf"></div>
<div class="field"><label for="fg-screenshot_url"><span data-i18n="screenshot_url">Or a link</span></label><input id="fg-screenshot_url" name="screenshot_url" type="url" maxlength="300"></div></section>
<section><h2 data-i18n="section.contact">Contact</h2>
<div class="field"><label for="fg-name"><span data-i18n="name">Name</span></label><input id="fg-name" name="name" type="text" required maxlength="80" autocomplete="name"></div>
<div class="field"><label for="fg-email"><span data-i18n="email">Email</span></label><input id="fg-email" name="email" type="email" required maxlength="120" autocomplete="email"></div>
<div class="field"><label for="fg-phone"><span data-i18n="phone">Phone</span></label><input id="fg-phone" name="phone" type="tel" maxlength="40" autocomplete="tel"></div></section>
<!-- Set data-sitekey on this form to YOUR_TURNSTILE_SITE_KEY. Required for attachments. -->
<div data-turnstile></div>
<button type="submit" data-i18n="submit">Enviar</button>
<p data-status role="status"></p>
</form>
</main>
<script type="application/json" id="fg-labels">{"uk":{"title":"Форма запиту в підтримку","lede":"Клієнти описують проблему так, щоб її можна було вирішити з першої відповіді.","submit":"Надіслати","thanks":"Надіслано. Дякуємо.","file_too_big":"До 3 файлів, по 5 MiB, разом до 10 MiB.","error":"Не вдалося надіслати. Спробуйте ще раз.","section.issue":"Проблема","category":"З чим вам потрібна допомога?","category.account":"Акаунт або вхід","category.billing":"Оплата","category.bug":"Щось не працює","category.how_to":"Як мені…?","category.other":"Інше","urgency":"Наскільки це терміново?","urgency.blocking":"Блокує мою роботу","urgency.soon":"Скоро, але не блокує","urgency.later":"Коли зможете","details":"Опишіть проблему і кроки, що до неї призводять","screenshot":"Скриншот, до 5 MiB","screenshot_url":"Або посилання","section.contact":"Контакт","name":"Ім'я","email":"Електронна пошта","phone":"Телефон"},"en":{"title":"Support request form","lede":"Customers report a problem with enough detail to fix it on the first reply.","submit":"Send","thanks":"Sent. Thank you.","file_too_big":"Up to 3 files, 5 MiB each and 10 MiB combined.","error":"Could not send. Please try again.","section.issue":"Issue","category":"What do you need help with?","category.account":"Account or login","category.billing":"Billing","category.bug":"Something is broken","category.how_to":"How do I…?","category.other":"Other","urgency":"How urgent is it?","urgency.blocking":"It blocks my work","urgency.soon":"Soon, but not blocking","urgency.later":"Whenever you can","details":"Describe the problem and the steps that lead to it","screenshot":"Screenshot, up to 5 MiB","screenshot_url":"Or a link","section.contact":"Contact","name":"Name","email":"Email","phone":"Phone"},"pl":{"title":"Formularz zgłoszenia do pomocy technicznej","lede":"Klienci opisują problem na tyle dokładnie, by rozwiązać go w pierwszej odpowiedzi.","submit":"Wyślij","thanks":"Wysłano. Dziękujemy.","file_too_big":"Do 3 plików, po 5 MiB, łącznie 10 MiB.","error":"Nie udało się wysłać. Spróbuj ponownie.","section.issue":"Problem","category":"W czym potrzebujesz pomocy?","category.account":"Konto lub logowanie","category.billing":"Płatności","category.bug":"Coś nie działa","category.how_to":"Jak mam…?","category.other":"Inne","urgency":"Jak pilne to jest?","urgency.blocking":"Blokuje moją pracę","urgency.soon":"Wkrótce, ale nie blokuje","urgency.later":"Kiedy będzie można","details":"Opisz problem i kroki, które do niego prowadzą","screenshot":"Zrzut ekranu, do 5 MiB","screenshot_url":"Albo link","section.contact":"Kontakt","name":"Imię","email":"E-mail","phone":"Telefon"},"tr":{"title":"Destek talebi formu","lede":"Müşteriler sorunu ilk yanıtta çözülebilecek kadar ayrıntılı bildirir.","submit":"Gönder","thanks":"Gönderildi. Teşekkürler.","file_too_big":"En fazla 3 dosya, dosya başına 5 MiB, toplam 10 MiB.","error":"Gönderilemedi. Lütfen tekrar deneyin.","section.issue":"Sorun","category":"Hangi konuda yardıma ihtiyacınız var?","category.account":"Hesap veya giriş","category.billing":"Faturalandırma","category.bug":"Bir şey çalışmıyor","category.how_to":"Nasıl yaparım…?","category.other":"Diğer","urgency":"Ne kadar acil?","urgency.blocking":"İşimi engelliyor","urgency.soon":"Yakında, ama engellemiyor","urgency.later":"Müsait olduğunuzda","details":"Sorunu ve ona yol açan adımları anlatın","screenshot":"Ekran görüntüsü, en fazla 5 MiB","screenshot_url":"Ya da bağlantı","section.contact":"İletişim","name":"Ad","email":"E-posta","phone":"Telefon"},"ar":{"title":"نموذج طلب الدعم","lede":"يبلّغ العملاء عن المشكلة بتفاصيل كافية لحلها من الرد الأول.","submit":"إرسال","thanks":"تم الإرسال. شكرًا لك.","file_too_big":"حتى 3 ملفات، 5 MiB لكل ملف و10 MiB إجمالًا.","error":"تعذّر الإرسال. يُرجى المحاولة مرة أخرى.","section.issue":"المشكلة","category":"بماذا تحتاج إلى مساعدة؟","category.account":"الحساب أو تسجيل الدخول","category.billing":"الفوترة","category.bug":"هناك شيء معطل","category.how_to":"كيف أقوم بـ…؟","category.other":"أخرى","urgency":"ما مدى الاستعجال؟","urgency.blocking":"يعطّل عملي","urgency.soon":"قريبًا، لكنه لا يعطّل العمل","urgency.later":"متى استطعتم","details":"صف المشكلة والخطوات التي تؤدي إليها","screenshot":"لقطة شاشة، حتى 5 MiB","screenshot_url":"أو رابط","section.contact":"التواصل","name":"الاسم","email":"البريد الإلكتروني","phone":"الهاتف"},"he":{"title":"טופס פנייה לתמיכה","lede":"הלקוחות מתארים את הבעיה בפירוט שמאפשר לפתור אותה כבר בתשובה הראשונה.","submit":"שליחה","thanks":"נשלח. תודה.","file_too_big":"עד 3 קבצים, 5 MiB לכל קובץ ו-10 MiB בסך הכול.","error":"השליחה נכשלה. נסו שוב.","section.issue":"הבעיה","category":"במה אתם צריכים עזרה?","category.account":"חשבון או התחברות","category.billing":"חיוב","category.bug":"משהו לא עובד","category.how_to":"איך עושים…?","category.other":"אחר","urgency":"עד כמה זה דחוף?","urgency.blocking":"זה עוצר לי את העבודה","urgency.soon":"בקרוב, אבל לא עוצר","urgency.later":"מתי שאפשר","details":"תארו את הבעיה ואת הצעדים שמובילים אליה","screenshot":"צילום מסך, עד 5 MiB","screenshot_url":"או קישור","section.contact":"פרטי קשר","name":"שם","email":"אימייל","phone":"טלפון"},"es":{"title":"Formulario de solicitud de soporte","lede":"Los clientes describen el problema con el detalle suficiente para resolverlo en la primera respuesta.","submit":"Enviar","thanks":"Enviado. Gracias.","file_too_big":"Hasta 3 archivos, 5 MiB cada uno y 10 MiB en total.","error":"No se pudo enviar. Inténtalo de nuevo.","section.issue":"Problema","category":"¿Con qué necesitas ayuda?","category.account":"Cuenta o inicio de sesión","category.billing":"Facturación","category.bug":"Algo no funciona","category.how_to":"¿Cómo hago…?","category.other":"Otro","urgency":"¿Qué tan urgente es?","urgency.blocking":"Me impide trabajar","urgency.soon":"Pronto, pero no me bloquea","urgency.later":"Cuando puedas","details":"Describe el problema y los pasos que llevan a él","screenshot":"Captura de pantalla, hasta 5 MiB","screenshot_url":"O un enlace","section.contact":"Contacto","name":"Nombre","email":"Correo electrónico","phone":"Teléfono"},"fr":{"title":"Formulaire de demande d’assistance","lede":"Les clients décrivent le problème avec assez de détails pour le régler dès la première réponse.","submit":"Envoyer","thanks":"Envoyé. Merci.","file_too_big":"Jusqu’à 3 fichiers, 5 Mio chacun et 10 Mio au total.","error":"Envoi impossible. Veuillez réessayer.","section.issue":"Problème","category":"Pour quoi avez-vous besoin d’aide ?","category.account":"Compte ou connexion","category.billing":"Facturation","category.bug":"Quelque chose ne marche pas","category.how_to":"Comment faire… ?","category.other":"Autre","urgency":"Quelle est l’urgence ?","urgency.blocking":"Cela bloque mon travail","urgency.soon":"Bientôt, mais ce n’est pas bloquant","urgency.later":"Quand vous pourrez","details":"Décrivez le problème et les étapes qui y mènent","screenshot":"Capture d’écran, jusqu’à 5 Mio","screenshot_url":"Ou un lien","section.contact":"Contact","name":"Nom","email":"E-mail","phone":"Téléphone"},"pt":{"title":"Formulário de pedido de suporte","lede":"Os clientes descrevem o problema com detalhe suficiente para o resolver logo na primeira resposta.","submit":"Enviar","thanks":"Enviado. Obrigado.","file_too_big":"Até 3 ficheiros, 5 MiB cada e 10 MiB no total.","error":"Não foi possível enviar. Tente novamente.","section.issue":"Problema","category":"Em que precisa de ajuda?","category.account":"Conta ou início de sessão","category.billing":"Faturação","category.bug":"Algo não funciona","category.how_to":"Como faço…?","category.other":"Outro","urgency":"Qual é a urgência?","urgency.blocking":"Bloqueia o meu trabalho","urgency.soon":"Em breve, mas não bloqueia","urgency.later":"Quando puder","details":"Descreva o problema e os passos que levam a ele","screenshot":"Captura de ecrã, até 5 MiB","screenshot_url":"Ou uma ligação","section.contact":"Contacto","name":"Nome","email":"Email","phone":"Telefone"},"hi":{"title":"सपोर्ट अनुरोध फ़ॉर्म","lede":"ग्राहक समस्या इतनी जानकारी के साथ बताते हैं कि पहले जवाब में ही हल हो सके।","submit":"भेजें","thanks":"भेज दिया गया। धन्यवाद।","file_too_big":"अधिकतम 3 फ़ाइलें, हर फ़ाइल 5 MiB तक और कुल 10 MiB।","error":"भेजा नहीं जा सका। कृपया फिर से कोशिश करें।","section.issue":"समस्या","category":"आपको किस चीज़ में मदद चाहिए?","category.account":"अकाउंट या लॉगिन","category.billing":"बिलिंग","category.bug":"कुछ काम नहीं कर रहा","category.how_to":"मैं कैसे…?","category.other":"अन्य","urgency":"यह कितना ज़रूरी है?","urgency.blocking":"इससे मेरा काम रुका है","urgency.soon":"जल्द, पर काम रुका नहीं है","urgency.later":"जब भी हो सके","details":"समस्या और उस तक पहुँचने वाले कदम बताएँ","screenshot":"स्क्रीनशॉट, 5 MiB तक","screenshot_url":"या लिंक","section.contact":"संपर्क","name":"नाम","email":"ईमेल","phone":"फ़ोन"},"ja":{"title":"サポート依頼フォーム","lede":"最初の返信で解決できるだけの情報を添えて、お客様が問題を報告します。","submit":"送信","thanks":"送信しました。ありがとうございます。","file_too_big":"ファイルは3つまで、1つ5 MiB、合計10 MiBまでです。","error":"送信できませんでした。もう一度お試しください。","section.issue":"内容","category":"どのようなことでお困りですか?","category.account":"アカウント・ログイン","category.billing":"請求","category.bug":"不具合がある","category.how_to":"使い方を知りたい","category.other":"その他","urgency":"緊急度を教えてください","urgency.blocking":"業務が止まっている","urgency.soon":"早めに対応してほしいが支障はない","urgency.later":"手が空いたときで構わない","details":"問題の内容と、発生までの手順を書いてください","screenshot":"スクリーンショット(5 MiBまで)","screenshot_url":"またはリンク","section.contact":"連絡先","name":"お名前","email":"メールアドレス","phone":"電話番号"},"de":{"title":"Support-Anfrageformular","lede":"Kunden melden ein Problem so genau, dass es mit der ersten Antwort gelöst werden kann.","submit":"Senden","thanks":"Gesendet. Vielen Dank.","file_too_big":"Bis zu 3 Dateien, je 5 MiB und insgesamt 10 MiB.","error":"Senden fehlgeschlagen. Bitte versuchen Sie es erneut.","section.issue":"Problem","category":"Wobei brauchen Sie Hilfe?","category.account":"Konto oder Anmeldung","category.billing":"Abrechnung","category.bug":"Etwas funktioniert nicht","category.how_to":"Wie kann ich …?","category.other":"Sonstiges","urgency":"Wie dringend ist es?","urgency.blocking":"Es blockiert meine Arbeit","urgency.soon":"Bald, aber nicht blockierend","urgency.later":"Wann immer es passt","details":"Beschreiben Sie das Problem und die Schritte, die dazu führen","screenshot":"Screenshot, bis 5 MiB","screenshot_url":"Oder ein Link","section.contact":"Kontakt","name":"Name","email":"E-Mail","phone":"Telefon"}}</script>
<script>
function mountCaptcha(node, siteKey) {
  if (!node || !siteKey) return () => {};
  let disposed = false;
  let widget;
  function render() {
    if (disposed || !window.turnstile) return;
    window.turnstile.ready(() => {
      if (disposed) return;
      widget = window.turnstile.render(node, { sitekey: siteKey, language: node.dataset.language || document.documentElement.lang || "auto" });
      node.dataset.widgetId = widget;
    });
  }
  if (window.turnstile) render();
  else {
    let script = document.querySelector('script[src^="https://challenges.cloudflare.com/turnstile/v0/api.js"]');
    if (!script) {
      script = document.createElement("script");
      script.src = "https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit";
      script.async = true;
      document.head.appendChild(script);
    }
    script.addEventListener("load", render, { once: true });
  }
  return () => { disposed = true; if (widget !== undefined) window.turnstile?.remove(widget); };
}
function resetCaptcha(form) {
  const widget = form.querySelector("[data-turnstile]")?.dataset.widgetId;
  if (widget !== undefined) window.turnstile?.reset(widget);
}
(function () {
  var MAX = 5242880;
  var form = document.getElementById("fg-form");
  var packNode = document.getElementById("fg-labels");
  if (!form || !packNode) return;
  var pack = JSON.parse(packNode.textContent);
  function code() {
    var q = new URLSearchParams(location.search).get("lang") || "";
    // ?lang= preview override, then the form language chosen when copying, then the page and browser.
    var raw = (q || form.getAttribute("data-lang") || document.documentElement.lang || (navigator.language || "en")).slice(0, 2).toLowerCase();
    return pack[raw] ? raw : "en";
  }
  function apply() {
    var dict = pack[code()];
    document.querySelectorAll("[data-i18n]").forEach(function (node) {
      var key = node.getAttribute("data-i18n");
      if (key && typeof dict[key] === "string") node.textContent = dict[key];
    });
  }
  apply();
  var status = form.querySelector("[data-status]");
  form.addEventListener("submit", function (event) {
    event.preventDefault();
    var dict = pack[code()];
    var body = new FormData(form);
    var files = Array.from(body.values()).filter(function (value) { return value instanceof File && value.size; });
    if (files.length > 3 || files.some(function (file) { return file.size > MAX; }) || files.reduce(function (sum,file) { return sum + file.size; },0) > 10 * 1024 * 1024) {
      if (status) status.textContent = dict.file_too_big;
      return;
    }
    var button = form.querySelector("button[type=submit]");
    if (button) button.disabled = true;
    fetch(form.action, { method: "POST", headers: { Accept: "application/json" }, body: body })
      .then(function (response) { return response.json(); }).then(function (result) {
        if (status) status.textContent = result && result.success ? dict.thanks : ((result && result.message) || dict.error);
      }).catch(function () { if (status) status.textContent = dict.error; })
      .finally(function () { if (button) button.disabled = false; resetCaptcha(form); });
  });
  mountCaptcha(form.querySelector("[data-turnstile]"), form.dataset.sitekey);

})();
</script>
</body>
</html>

Código para otros frameworks

React
Vue
Svelte

Cómo recibir más solicitudes

  • Di en la página de agradecimiento cuándo responderás, por ejemplo «en un día laborable».
  • Enlaza tus páginas de ayuda junto al formulario para las preguntas que ya tienen respuesta.
  • Responde desde una dirección a la que los clientes puedan contestar, para que la conversación se quede en un solo sitio.

Responde a cada solicitud

Envía los problemas que bloquean a un grupo de Telegram para que alguien los vea en minutos. Los estados muestran qué solicitudes se están atendiendo, y el recordatorio diario lista las solicitudes que nadie ha recogido todavía.

Preguntas y respuestas

¿Pueden los clientes adjuntar capturas de pantalla?

Sí. Activa los archivos adjuntos en los ajustes del formulario y añade Turnstile a tu web. Los archivos de hasta 5 MiB se guardan de forma privada.

¿Pueden las solicitudes ir a mi help desk?

Sí. Envía cada solicitud con un webhook firmado a tu help desk, o mediante Make, n8n o Zapier.

¿Puedo enviar las consultas de facturación a otra persona?

Sí. En Pro, las reglas de enrutamiento envían las solicitudes a otro correo o chat según el tema.