Grav Blueprints וטפסים: שדות מותאמים אישית, דוא"ל, לידים

טפסי Grav סטנדרטיים לרוב אינם מכסים את דרישות העסק: צריך שדות העלאת תמונות, ולידציה מורכבת, אינטגרציה עם CRM. עורכים מבזבזים זמן על קלט ידני, ומנהלים מקבלים נתונים חלקיים. אנו מגדירים Blueprints וטפסי Grav כולל שדות YAML מותאמים אישית, טפסי יצירת קשר עם התראות דוא"ל דרך SMTP, טפסים מרובי-שלבים, ותבניות דוא"ל גמישות. מעל 50 פרויקטים על Grav — מטפסי יצירת קשר פשוטים ועד שאלונים מרובי-שלבים עם שדות מותנים.

לדוגמה, עבור חברת שירות הגדרנו עמוד עם טאבים: תוכן, SEO והגדרות. בעבר עורכים מילאו שדה טקסט יחיד; עכשיו הם בוחרים בלוקים מותאמים אישית דרך filepicker ורשימה. התוצאה — זמן המילוי קטן פי שלושה, ושגיאות הקלט ירדו ב-70%. זמן מילוי הטופס הממוצע ירד מ-10 ל-2 דקות.

אילו בעיות אנו פותרים

• שדות לא נוחים בניהול. עורכים מבזבזים זמן על קלט ידני של שדות מיותרים. Blueprints מסירים את כל העודף: אנו מציגים רק טאבים נחוצים (תוכן, SEO, הגדרות), מוסיפים filepicker לתמונות, רשימה ליתרונות, ו-toggle להצגה/הסתרה של בלוקים.
• אובדן לידים. ללא SMTP, הודעות דוא"ל מגיעות לספאם או לא מגיעות כלל. אנו מחברים שרת דוא"ל אמין (Gmail, Yandex, Mailgun), מגדירים DKIM/SPF, ומבטיחים אספקה של 99.9%.
• טופס חד-שלבי לא מספיק. להזמנות מורכבות, יש צורך בטפסים מרובי-שלבים עם ולידציה בכל שלב. אנו מיישמים זאת דרך תוסף Form Wizard או JS מותאם אישית — הנתונים נשמרים אפילו בריענון.
• ולידציה מורכבת של שדות. סוגי שדות סטנדרטיים לא תמיד עומדים בדרישות העסק. אנו מוסיפים ולידטורים מותאמים אישית ב-PHP ובצד הלקוח כדי לדחות נתונים שגויים.

איך להגדיר Blueprints לעמודי Grav?

מקרה עומק אחד: עמוד שירות עם טאבים "תוכן", "SEO", "הגדרות". קובץ לדוגמה user/blueprints/pages/service-detail.yaml:

---
title: Service Detail Page
extends@:
  type: default
  context: blueprints://pages
form:
  fields:
    tabs:
      type: tabs
      active: 1
      fields:
        content:
          type: tab
          title: Контент
          fields:
            header.intro:
              type: textarea
              label: Вступление
              help: Краткое описание для превью
              size: large
              rows: 3
            header.hero_image:
              type: filepicker
              label: Главное изображение
              preview_images: true
              folder: '@self'
              accept: ['image/jpeg', 'image/png', 'image/webp']
            header.features:
              type: list
              label: Преимущества
              style: vertical
              fields:
                .icon:
                  type: text
                  label: CSS-класс иконки
                  placeholder: 'icon-check'
                .text:
                  type: text
                  label: Текст преимущества
        seo:
          type: tab
          title: SEO
          fields:
            header.metadata.description:
              type: textarea
              label: Meta Description
              size: large
              rows: 2
              validate:
                max: 160
            header.metadata.keywords:
              type: text
              label: Meta Keywords
            header.canonical:
              type: url
              label: Canonical URL
        options:
          type: tab
          title: Настройки
          fields:
            header.show_sidebar:
              type: toggle
              label: Показывать боковую панель
              default: 1
              options:
                1: Да
                0: Нет
            header.template:
              type: select
              label: Шаблон вывода
              options:
                default: Стандартный
                wide: Широкий
                fullscreen: На весь экран
---

סוגי שדות Blueprint ומטרתם:

טופס יצירת קשר ודוא"ל

הטופס מתואר ב-frontmatter של editor:

---
title: Контакты
template: form
form:
  name: contact-form
  fields:
    name:
      label: Имя
      type: text
      validate:
        required: true
        min: 2
    email:
      label: Email
      type: email
      validate:
        required: true
    phone:
      label: Телефон
      type: tel
      placeholder: '+375 XX XXX-XX-XX'
    service:
      label: Интересующая услуга
      type: select
      options:
        web: Разработка сайта
        app: Мобильное приложение
        seo: SEO-продвижение
        other: Другое
    message:
      label: Сообщение
      type: textarea
      validate:
        required: true
        min: 20
      rows: 5
    honeypot:
      type: honeypot # защита от ботов
  buttons:
    submit:
      type: submit
      value: Отправить
      classes: btn btn-primary
  process:
    - email:
        from: "{{ form.value.email }}"
        to: [email protected]
        subject: "Заявка с сайта: {{ form.value.name }}"
        body: "{% include 'forms/email/contact.html.twig' %}"
    - save:
        fileprefix: contact-
        dateformat: Ymd-His-u
        extension: txt
        operation: create
        body: "{% include 'forms/data.txt.twig' %}"
    - message: Спасибо! Мы свяжемся с вами в течение 1 рабочего дня.
    - display: /thank-you
---
## Свяжитесь с нами
Оставьте заявку, и мы ответим в течение рабочего дня.

תבנית התראת דוא"ל:

{# user/themes/my-theme/templates/forms/email/contact.html.twig #}
<h2>Новая заявка с сайта</h2>
<table>
    <tr><td><strong>Имя:</strong></td><td>{{ form.value.name }}</td></tr>
    <tr><td><strong>Email:</strong></td><td>{{ form.value.email }}</td></tr>
    <tr><td><strong>Телефон:</strong></td><td>{{ form.value.phone }}</td></tr>
    <tr><td><strong>Услуга:</strong></td><td>{{ form.value.service }}</td></tr>
    <tr><td><strong>Сообщение:</strong></td><td>{{ form.value.message }}</td></tr>
</table>

הגדרת תוסף הדוא"ל:

---
# user/config/plugins/email.yaml
enabled: true
mailer:
  engine: smtp
  smtp:
    server: smtp.gmail.com
    port: 587
    encryption: tls
    user: [email protected]
    password: app-specific-password
    from: [email protected]
    from_name: Мой Сайт
    to: [email protected]
---

למה הגדרת דוא"ל נכונה חשובה?

ללא SMTP, הודעות דוא"ל לרוב מגיעות לספאם. אנו מגדירים רשומות SPF ו-DKIM, משתמשים בשירותי דוא"ל אמינים. התוצאה — אספקה של 99.9%. הודעות מגיעות עם נושא נכון ותבנית קריאה. השוואת שיטות שליחה:

איך ליישם טופס מרובה-שלבים ב-Grav?

להזמנות מורכבות או סקרים, אנו משתמשים בטפסים מרובי-שלבים. דוגמת הגדרה:

---
form:
  name: multistep-order
  fields:
    step1:
      type: section
      title: Шаг 1. Контакты
      fields:
        name:
          type: text
          label: Имя
        email:
          type: email
          label: Email
    step2:
      type: section
      title: Шаг 2. Детали заказа
      fields:
        budget:
          type: select
          label: Бюджет
          options:
            small: до $1000
            medium: $1000–5000
            large: более $5000
        details:
          type: textarea
          label: Описание задачи
---

להצגה שלב-אחר-שלב, נדרש JS מותאם אישית או תוסף contact.md. כל שלב הוא סקשן עם שדות. הנתונים נשמרים בסשן, אחרי השלב האחרון — שליחה. אנו מבצעים ולידציה בכל שלב: דוא"ל חייב להיות תקין, טלפון בפורמט הנדרש. טפסים מרובי-שלבים מעלים המרה ב-40% לעומת חד-שלביים.

תהליך העבודה

1. בדיקת טפסים ו-Blueprints קיימים — זיהוי צווארי בקבוק, איסוף דרישות עורכים.
2. עיצוב סכמת שדות — טאבים, סוגים, ולידציה.
3. יישום Blueprints — קבצי YAML לעמודים ולהגדרות.
4. הגדרת טופס ודוא"ל — תוסף Form, SMTP, תבנית דוא"ל.
5. בדיקות — בדיקת כל התרחישים, שליחה, ולידציה.
6. פריסה והדרכה — העלאה לסביבת ייצור, הדרכה קצרה לעורכים.

מה כלול בעבודה

• סכמות YAML Blueprint לכל סוגי העמודים הנדרשים (תיעוד בקוד).
• טופס יצירת קשר עם הגנת בוטים (honeypot + הגבלת קצב).
• תבנית דוא"ל ב-Twig.
• הגדרת שרת SMTP.
• הוראות לעריכת שדות.
• אחריות לאספקת דוא"ל (תיקון אם לא עובד).

לוחות זמנים ועלות

הגדרה בסיסית — מיומיים עסקיים. פרויקט מורכב (טפסים מרובי-שלבים, שדות מותאמים אישית, תבניות דוא"ל) — 3–5 ימים. אנו מספקים הערכה מדויקת אחרי בריף. העלות מחושבת באופן אישי. חיסכון בתקציב עם הזמנה מקיפה מגיע ל-25%. הפתרונות שלנו מחזירים את ההשקעה בתוך החודש הראשון.

בעיות נפוצות והפתרון שלהן

• שוכחים Honeypot — הטופס מוצף בספאם.
• ולידציה בצד השרת לא נבדקת (רק JS) — תוקפים עוקפים.
• גיבוי דוא"ל לא מוגדר — במקרה של תקלת SMTP, לידים אובדים.

אנו נמנעים מאלה בשלב התכנון. צרו קשר — נבדוק את הפרויקט שלכם תוך יום אחד. הזמינו הגדרת Grav Blueprints וטפסים היום. קבלו ייעוץ על אינטגרציה עם ה-CRM שלכם.

ללא הגדרה נכונה, סכמות YAML Blueprint עשויות להיראות מורכבות, אבל למעשה הן כלי עוצמתי להתאמה אישית של Grav.