Jekyll

Jekyll-Sites sind statisch, was gut zu einem einfachen Formular-Post passt. Lege das Formular in ein Include, damit jede Seite dasselbe Markup nutzt und die Formular-ID an einer Stelle liegt.

Einrichten

1. Füge die Einstellungen zu _config.yml hinzu

   url: "https://example.com"
   ikiform:
     form_id: frm_xxxxxxxxxxxxxxxx
     thanks: /thanks/

   Das Include baut die Weiterleitung mit absolute_url, und das braucht url. Ohne diese Angabe ist die Weiterleitung nur ein Pfad, und Ikiform ignoriert alles, was keine vollständige https:-URL ist. Setze auf einer GitHub-Pages-Projektseite außerdem baseurl: /repo; absolute_url hängt es für dich an.

2. Erstelle das Include

   {%- assign form_id = include.form_id | default: site.ikiform.form_id -%}
   {%- assign thanks = include.thanks | default: site.ikiform.thanks -%}
   <form class="ikiform" action="https://ikiform.com/f/{{ form_id }}" method="post">
     <label>Email <input name="email" type="email" autocomplete="email" required></label>
     <label>Message <textarea name="message" rows="5"></textarea></label>
     {%- if include.subject %}
     <input type="hidden" name="_subject" value="{{ include.subject | escape }}">
     {%- endif %}
     {%- if thanks %}
     <input type="hidden" name="_redirect" value="{{ thanks | absolute_url }}">
     {%- endif %}
     <input name="_gotcha" type="text" tabindex="-1" autocomplete="off" hidden>
     <button type="submit">{{ include.button | default: "Send" }}</button>
   </form>

3. Verwenden

   ---
   layout: page
   title: Contact
   ---
   
   Questions about pricing? Write to us.
   
   {% include ikiform-form.html subject="Pricing question" %}

   Das Include funktioniert in Seiten, Posts und Layouts. Übergib form_id für ein anderes Formular, thanks für eine andere Weiterleitung und button für den Button-Text.

4. Füge die Dankesseite hinzu

   ---
   layout: page
   title: Thanks
   permalink: /thanks/
   ---
   
   Thanks, we got your message.

_redirect wird nur befolgt, wenn das Formular erlaubte Domains hat, zu denen deine Site gehört. Siehe Regeln für _redirect.

Erlaubte Domains

GitHub Pages ist der übliche Host für Jekyll, daher brauchst du oft zwei Einträge: den github.io-Host und deine eigene Domain.

• Füge niemals github.io allein hinzu. Jede Site auf diesem Host würde passen, auch die von anderen Leuten.

Test-Checkliste

1. Starte bundle exec jekyll serve und sieh dir den Seitenquelltext an. Die action sollte mit deiner Formular-ID enden.
2. Sende lokal ab. Du landest auf der Dankesseite von Ikiform: jekyll serve setzt url auf http://localhost:4000, und http:-Weiterleitungen werden nicht befolgt.
3. Pushe, warte auf den Pages-Build und sende von username.github.io ab. Prüfe, dass die Einsendung nicht als Spam markiert ist.
4. Sende auf deiner eigenen Domain ab und prüfe, dass du auf /thanks/ landest.

Fehlerbehebung

Verwandte Themen

• HugoEin Partial und ein Shortcode für Inhaltsdateien.
• EleventyEin Shortcode für Nunjucks, Liquid und Markdown.
• HTML-FormulareWeiterleitungen, reservierte Felder und der Honeypot.
• Erlaubte DomainsWie Origins abgeglichen werden und was eine Abweichung bewirkt.