# Jekyll

> Include Jekyll yang merender formulir Ikiform dari _config.yml, dengan redirect yang berfungsi di GitHub Pages dan domain kustom.

Situs Jekyll bersifat statis, cocok untuk kiriman formulir biasa. Simpan formulir di include agar setiap halaman memakai markup yang sama dan ID formulir ada di satu tempat.

## Penyiapan

### Langkah 1: Tambahkan pengaturan ke _config.yml

`_config.yml`:

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

Include membuat redirect dengan `absolute_url`, yang butuh `url`. Tanpanya, redirect hanya berupa path, dan Ikiform mengabaikan apa pun yang bukan URL `https:` lengkap. Di situs proyek GitHub Pages, atur juga `baseurl: /repo`; `absolute_url` akan menambahkannya untuk Anda.

### Langkah 2: Buat include

`_includes/ikiform-form.html`:

```liquid
{%- 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>
```

### Langkah 3: Gunakan

`contact.md`:

```liquid
---
layout: page
title: Contact
---

Questions about pricing? Write to us.

{% include ikiform-form.html subject="Pricing question" %}
```

Include ini berfungsi di page, post, dan layout. Berikan `form_id` untuk memakai formulir lain, `thanks` untuk redirect lain, dan `button` untuk teks tombol.

### Langkah 4: Tambahkan halaman terima kasih

`thanks.md`:

```liquid
---
layout: page
title: Thanks
permalink: /thanks/
---

Thanks, we got your message.
```

`_redirect` hanya diikuti jika formulir punya domain yang diizinkan yang mencakup situs Anda. Lihat [Aturan untuk _redirect](https://ikiform.com/id/docs/html.md#redirect-rules).

## Domain yang diizinkan

GitHub Pages adalah host yang umum untuk Jekyll, jadi Anda sering butuh dua entri: host `github.io` dan domain kustom Anda.

| Tempat formulir berjalan | Tambahkan ke Domain yang diizinkan |
| --- | --- |
| `bundle exec jekyll serve` | `localhost`. Ini cocok dengan `http://localhost:4000`: Ikiform hanya membandingkan nama host, tidak pernah port. |
| GitHub Pages | `username.github.io`. Situs proyek di `username.github.io/repo` memakai host yang sama, jadi satu entri mencakup semuanya. |
| Domain kustom di GitHub Pages | `example.com`, yang juga mencakup `www.example.com` |
| Netlify | `your-site.netlify.app`. Deploy preview (`deploy-preview-12--your-site.netlify.app`) dan branch deploy (`branch--your-site.netlify.app`) bukan subdomainnya, jadi tambahkan host pratinjau persisnya selama Anda menguji. |

- Jangan pernah menambahkan `github.io` saja. Setiap situs di host itu akan cocok, termasuk milik orang lain.

## Daftar periksa pengujian

1. Jalankan `bundle exec jekyll serve` dan lihat source halamannya. `action` seharusnya berakhir dengan ID formulir Anda.
2. Kirim secara lokal. Anda akan mendarat di halaman terima kasih Ikiform: `jekyll serve` mengatur `url` ke `http://localhost:4000`, dan redirect `http:` tidak diikuti.
3. Push, tunggu build Pages selesai, lalu kirim dari `username.github.io`. Pastikan kirimannya tidak ditandai spam.
4. Kirim di domain kustom Anda dan pastikan Anda mendarat di `/thanks/`.

## Pemecahan masalah

| Yang Anda lihat | Alasan | Solusi |
| --- | --- | --- |
| `Could not locate the included file 'ikiform-form.html'` | File-nya tidak ada di `_includes`, atau namanya berbeda | Pindahkan ke `_includes/ikiform-form.html`. |
| Halaman terima kasih Ikiform, bukan `/thanks/`, di situs live | `url` tidak ada di `_config.yml`, atau formulir tidak punya domain yang diizinkan | Atur `url` ke alamat `https:` Anda dan tambahkan domain Anda. |
| `404 not_found` setelah dikirim | `site.ikiform.form_id` kosong, jadi action berakhir di `/f/` | Periksa indentasi di bawah `ikiform:` di `_config.yml`. |
| Kiriman masuk ke filter spam dengan `origin_mismatch` | Halaman yang mengirim tidak ada di domain yang diizinkan formulir | Tambahkan host dari tabel di atas. Jika **Reject** dipilih, kiriman yang sama mendapat `403 origin_not_allowed`. |

## Terkait

- [Hugo](https://ikiform.com/id/docs/guides/hugo.md): Partial dan shortcode untuk file konten.
- [Eleventy](https://ikiform.com/id/docs/guides/eleventy.md): Shortcode untuk Nunjucks, Liquid, dan Markdown.
- [Formulir HTML](https://ikiform.com/id/docs/html.md): Redirect, field reserved, dan honeypot.
- [Domain yang diizinkan](https://ikiform.com/id/docs/spam.md#allowed-domains): Cara origin dicocokkan, dan apa akibat ketidakcocokan.