טופס יצירת קשר ל-Jekyll ב-GitHub Pages

Formgong team ·

טופס יצירת קשר ל-Jekyll ב-GitHub Pages הוא HTML רגיל. GitHub מפעיל מצב בטוח, ולכן תוסף לא נתמך לא נבנה. שימו את הטופס ב-include של Liquid ושלחו אותו אל Formgong. הפניות מגיעות בדואר וב-Telegram, והאתר נשאר סטטי. אין צורך בתוסף. הדף נשאר HTML.

Jekyll
<form action="https://formgong.com/submit" method="POST">
  <input type="hidden" name="access_key" value="fk_your_access_key">
  <input type="hidden" name="_lang" value="he">
  <label>שם <input type="text" name="name" autocomplete="name" placeholder="השם שלך" required></label>
  <label>אימייל <input type="email" name="email" autocomplete="email" placeholder="you@example.com" required></label>
  <label>הודעה <textarea name="message" placeholder="איך נוכל לעזור?" required></textarea></label>
  <div aria-hidden="true" style="position:absolute;inset-inline-start:0;top:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)">
  <label>השאירו שדה זה ריק<input type="text" name="botcheck" tabindex="-1" autocomplete="off"></label>
</div>
  
  <button type="submit">שליחה</button>
</form>

איך טפסים עובדים ב-Jekyll

Jekyll בונה Markdown ו-HTML לאתר סטטי. GitHub Pages הוא האירוח הרגיל והוא מריץ את Jekyll בשבילכם. אין שרת שמחכה ל-POST של הטופס.

GitHub Pages נועל safe: true בהגדרות Jekyll. gem לא נתמכת לא רצה אף פעם. טופס ב-_includes/contact-form.html מספיק, כי הדפדפן שולח את ה-HTML.

הגדרה ב-Jekyll

  1. צרו טופס ב-Formgong והעתיקו את מפתח הגישה.
  2. הוסיפו את ה-include. כוונו את action אל https://formgong.com/submit והגדירו access_key, _lang ו-botcheck.
  3. בדף הקשר הוסיפו front matter ו-{% include contact-form.html %}. באתר פרויקט הגדירו _redirect אל {{ site.url }}{{ site.baseurl }}/thanks/.
  4. אל תוסיפו gem לטפסים. GitHub Pages שומר על safe: true ולא יבנה תוסף לא נתמך.
  5. דחפו את המאגר. GitHub מגדיר את JEKYLL_ENV ל-production. שלחו ניסיון בכתובת github.io החיה.

Formgong או תוסף Jekyll?

תוסף מקומי עוזר כשאתם בונים את האתר בעצמכם וצריכים Ruby בזמן הבנייה.

ב-GitHub Pages תוספים לא נתמכים לא רצים. HTML שנשלח אל Formgong עדיין עובד אחרי הדחיפה.

שאלות ותשובות

האם זה עובד ב-GitHub Pages?

כן. הטופס הוא HTML. GitHub Pages רק צריך להגיש את הקובץ. אין צורך ב-gem משלכם.

אפשר לשמור את המפתח בהגדרות?

כן. שימו אותו ב-_config.yml והדפיסו אותו ב-include. המפתח ציבורי. אל תשמרו שם סיסמת דואר.

למה קישור התודה נשבר באתר פרויקט?

אתרי פרויקט חיים תחת נתיב משנה. בנו את _redirect עם site.baseurl, אחרת הדפדפן פותח דף חסר.

האם צריך את ה-gem של github-pages במחשב?

רק אם אתם רוצים את אותה קבוצת תוספים מקומית. הטופס עצמו לא צריך אותה. דחפו HTML ובדקו את הכתובת החיה.

התחילו חינם