Hugo

Hugo menghasilkan HTML biasa, dan kiriman formulir biasa sudah cukup untuk Ikiform, jadi tidak ada JavaScript yang perlu ditambahkan. Satu-satunya jebakan khas Hugo adalah Markdown: renderer Hugo membuang HTML mentah dari file konten kecuali Anda mengaktifkan markup.goldmark.renderer.unsafe, dan formulir yang ditempel berubah menjadi <!-- raw HTML omitted -->. Shortcode menyimpan HTML di template sebagai gantinya.

Penyiapan

1. Tambahkan ID formulir ke config

   baseURL = "https://example.com/"
   
   [params.ikiform]
   formId = "frm_xxxxxxxxxxxxxxxx"
   thanks = "/thanks/"

   baseURL harus berupa alamat https: Anda yang sebenarnya. Partial memakainya untuk mengubah thanks menjadi URL absolut, dan Ikiform hanya mengikuti redirect https:.

2. Buat partial

   {{ $id := .id | default site.Params.ikiform.formId }}
   {{ $thanks := .thanks | default site.Params.ikiform.thanks }}
   <form class="ikiform" action="https://ikiform.com/f/{{ $id }}" method="post">
     <label>Email <input name="email" type="email" autocomplete="email" required></label>
     <label>Message <textarea name="message" rows="5"></textarea></label>
     {{ with .subject }}<input type="hidden" name="_subject" value="{{ . }}">{{ end }}
     {{ with $thanks }}<input type="hidden" name="_redirect" value="{{ . | absURL }}">{{ end }}
     <input name="_gotcha" type="text" tabindex="-1" autocomplete="off" hidden>
     <button type="submit">{{ .button | default "Send" }}</button>
   </form>

   Selalu panggil dengan dict, meskipun kosong. Setiap key bersifat opsional dan kembali ke site params jika tidak diisi.

3. Bungkus dalam shortcode

   {{ partial "ikiform-form.html" (dict "id" (.Get "id") "subject" (.Get "subject") "button" (.Get "button")) }}

   Hugo 0.146 memindahkan template ke layouts/_partials dan layouts/_shortcodes. Di versi lebih lama, gunakan layouts/partials dan layouts/shortcodes.

4. Gunakan

   Di file konten mana pun:

   ---
   title: Contact
   ---
   
   Questions about pricing? Write to us.
   
   {{< ikiform subject="Pricing question" >}}

   Atau di layout, untuk formulir di setiap halaman:

   <footer>
     {{ partial "ikiform-form.html" (dict "subject" "Footer enquiry") }}
   </footer>

Tambahkan halaman content/thanks.md untuk redirect. Ikiform mengikuti _redirect hanya jika formulir punya domain yang diizinkan yang mencakup situs Anda; tanpanya, pengunjung melihat halaman terima kasih Ikiform. Lihat Aturan untuk _redirect.

Domain yang diizinkan

Cantumkan domain produksi Anda plus setiap tempat Anda melihat pratinjau situs hasil build.

• Jangan pernah menambahkan netlify.app, pages.dev, atau github.io saja. Setiap situs di host itu akan cocok, termasuk milik orang lain.

Daftar periksa pengujian

1. Jalankan hugo server, buka halamannya, dan lihat source-nya. Anda seharusnya melihat <form>, bukan <!-- raw HTML omitted -->.
2. Kirim secara lokal dengan localhost di domain yang diizinkan. Anda akan mendarat di halaman terima kasih Ikiform, karena absURL menghasilkan alamat http://localhost dan hanya redirect https: yang diikuti.
3. Deploy pratinjau, kirim dari sana, dan pastikan kirimannya tercantum di Ikiform dan tidak ditandai spam.
4. Kirim di domain produksi Anda dan pastikan Anda mendarat di /thanks/.

Pemecahan masalah

Terkait

• JekyllInclude, dan penyiapan GitHub Pages.
• EleventyShortcode untuk Nunjucks, Liquid, dan Markdown.
• Formulir HTMLRedirect, field reserved, dan honeypot.
• Domain yang diizinkanCara origin dicocokkan, dan apa akibat ketidakcocokan.