Propojte formulář na webu s Cold Leads: HTML, WordPress a Webflow

Než začnete

1. V Nastavení → API klíče vytvořte klíč pro web (lk_…) a nastavte jeho povolený web na adresu vašeho webu, například https://www.example.com.
2. Zvolte výchozí fázi, štítky a seznam klíče. Štítky, které pošlete s formulářem, se přidají ke štítkům klíče.
3. Poznamenejte si názvy polí, které endpoint čte: email (povinné), name, company, phone, message, tag, stage (přijímá se jen lead), redirect a honeypot website.

Čisté HTML

Nasměrujte atribut action formuláře na endpoint a klíč vložte do skrytého pole. Názvy polí musí odpovídat seznamu výše.

<form action="https://coldleads.app/api/hooks/lead" method="POST">
  <input type="hidden" name="_key" value="lk_your_website_key">
  <input type="hidden" name="redirect" value="https://www.example.com/thanks">
  <input type="hidden" name="tag" value="contact-page">
  <label>E-mail <input name="email" type="email" required></label>
  <label>Name <input name="name"></label>
  <label>Company <input name="company"></label>
  <label>Phone <input name="phone"></label>
  <label>Message <textarea name="message"></textarea></label>
  <input name="website" tabindex="-1" autocomplete="off" style="display:none">
  <button type="submit">Send</button>
</form>

WordPress: WPForms

WPForms odesílá webhooky pomocí doplňku Webhooks, který vyžaduje licenci WPForms Elite.

1. Nainstalujte a aktivujte doplněk Webhooks (WPForms → Addons).
2. Otevřete formulář v editoru, přejděte do Settings → Webhooks a zapněte Enable Webhooks.
3. Nastavte Request URL na https://coldleads.app/api/hooks/lead, Request Method na POST a Request Format na JSON.
4. V části Request Headers přidejte x-api-key s vaším klíčem pro web.
5. V části Request Body namapujte email, name, company, phone a message na pole formuláře a přidejte tag s pevnou hodnotou, například wpforms.
6. Uložte a jednou formulář odešlete se svou vlastní adresou; kontakt se objeví v Cold Leads.

WordPress: Contact Form 7

Contact Form 7 nemá nastavení webhooků, ale po odeslání svého e-mailu spouští akci WordPressu. Uložte tento kód jako wp-content/mu-plugins/coldleads-cf7.php (must-use plugin) a upravte názvy polí, pokud váš formulář nepoužívá výchozí your-email, your-name a your-message.

<?php
// Sends every Contact Form 7 submission to Cold Leads.
add_action('wpcf7_mail_sent', function ($contact_form) {
    $submission = WPCF7_Submission::get_instance();
    if (!$submission) {
        return;
    }
    $data = $submission->get_posted_data();
    wp_remote_post('https://coldleads.app/api/hooks/lead', [
        'timeout' => 10,
        'headers' => [
            'Content-Type' => 'application/json',
            'x-api-key'    => 'lk_your_website_key',
        ],
        'body' => wp_json_encode([
            'email'   => $data['your-email'] ?? '',
            'name'    => $data['your-name'] ?? '',
            'message' => $data['your-message'] ?? '',
            'tag'     => 'cf7',
        ]),
    ]);
});

infoNávštěvník dál vidí vlastní zprávu o úspěchu Contact Form 7 a vy dál dostáváte jeho e-mail; Cold Leads obdrží kopii odeslaných údajů.

Webflow

Vlastní webhook formulářů ve Webflow posílá pole vnořená pod payload.data, která lead endpoint nečte. Místo toho použijte vlastní akci formuláře.

1. V Designeru vyberte Form Block a otevřete jeho nastavení.
2. Nastavte Action na https://coldleads.app/api/hooks/lead?key=lk_your_website_key a Method na POST.
3. Pojmenujte každé pole tak, jak endpoint očekává (email, name, company, phone, message).
4. Do formuláře přidejte prvek Embed se skrytými poli: <input type="hidden" name="redirect" value="https://www.example.com/thanks"> a <input type="hidden" name="tag" value="webflow">.
5. Publikujte a otestujte. S vlastní akcí Webflow nezobrazí svou zprávu o úspěchu ani odeslání neuloží ve Webflow, takže návštěvníka na váš web vrátí právě pole redirect.

Otázky