המדריך לחיבור אתר HTML/סטטי לוואטסאפ
חיבור אתר HTML סטטי לוואטסאפ - בלי בילדר, בלי תוסף
האתר שלך נכתב ידנית או על ידי מפתח - קבצי HTML, CSS ו-JS פשוטים, בלי וורדפרס, בלי וויקס, בלי שום מערכת ניהול תוכן. המדריך הזה מראה איך לחבר כל טופס בו לוואטסאפ עם שורת קוד אחת לפני התג הסוגר `</body>`, כדי שכל פנייה תגיע תוך שניות - בלי תלות בפלטפורמה כלשהי.
ללא כרטיס אשראי · 7 ימי ניסיון- עובד על כל HTML נקי, בלי תלות בפלטפורמה
- שורה אחת לפני </body>, בכל דף שיש בו טופס
- מ-19 ₪/חודש · 7 ימי ניסיון בלי כרטיס אשראי
בקצרה
בלי בילדר, בלי לוח ניהול - אבל בדיוק כמו כל אתר אחר
אתרי HTML סטטיים - כאלה שנכתבו ידנית, נבנו עם מחולל תבניות (Jekyll, Hugo, כל SSG) או נמסרו על ידי מפתח כקבצים גולמיים - הם למעשה הבסיס שכל בילדר אחר בסופו של דבר מייצא. אין להם לוח ניהול, אין תוסף להתקין ואין Custom Code Injection - יש רק את קבצי ה-HTML עצמם. אבל בדיוק בגלל זה, החיבור לוואטסאפ פשוט יותר, לא פחות: מדביקים שורה אחת ישירות בקוד המקור, בלי לחפש תפריט הגדרות.
הכלל: מדביקים את תג `<script>` ממש לפני התג הסוגר `</body>` בכל דף HTML שיש בו טופס שרוצים לתפוס. זה מבטיח שהתג נטען אחרי שכל שאר תוכן הדף כבר קיים ב-DOM, כך שהוא רואה את הטופס ולא מפריע לזמן הטעינה הנתפס של העמוד.
אם באתר שלך יש כמה דפים עם טופס (למשל דף בית ודף צור קשר נפרד) והם לא בנויים עם include/template משותף, צריך להדביק את השורה בכל דף בנפרד. זו הסיבה שמפתחים שמנהלים HTML גולמי בדרך כלל משתמשים ב-partial/include משותף לפוטר (PHP include, SSI, או שכבת build) - כך מדביקים פעם אחת ב-partial, וזה משפיע על כל הדפים שמשתמשים בו.
מצבי HTML נפוצים
בין אם זה קובץ יחיד או פרויקט build
התג עצמו זהה בכל המקרים - ההבדל הוא כמה פעמים צריך להדביק אותו.
עמוד HTML בודד עם טופס
אתר עמוד-נחיתה אחד: מדביקים את השורה פעם אחת, לפני </body> באותו קובץ index.html. הכי פשוט שיש.
כמה דפי HTML נפרדים
כל דף (index.html, contact.html וכו') הוא קובץ עצמאי - מדביקים את השורה לפני </body> בכל דף שיש בו טופס שרוצים לתפוס.
אתר עם PHP include או SSI לפוטר
אם הפוטר משותף לכל הדפים דרך include, מדביקים שם פעם אחת - זה מתפשט אוטומטית לכל דף שמשתמש בו.
אתר Static Site Generator (Jekyll/Hugo/11ty)
מדביקים בקובץ ה-layout/partial המשותף (למשל _includes/footer.html) ומריצים build מחדש - חל על כל הדפים שנבנים מהתבנית.
שלב-אחר-שלב
לחבר אתר HTML לוואטסאפ בארבעה צעדים
בלי לוח ניהול - עורכים את קובץ ה-HTML ישירות.
- 1
נכנסים ומחברים וואטסאפ
נכנסים לחשבון עם גוגל ומחברים את הוואטסאפ שלך בשליחת הודעה אחת מהטלפון - בלי QR ובלי אפליקציה.
- 2
מעתיקים את שורת הקוד
מקבלים תג <script> אחד. זו אותה שורה שצריך להופיע בכל דף שיש בו טופס.
- 3
מדביקים לפני </body> בקובץ המקור
פותחים את קובץ ה-HTML (בעורך קוד, ב-FTP, או ב-Git) ומדביקים את השורה ממש לפני התג הסוגר </body>, בכל דף רלוונטי או ב-partial/footer המשותף.
- 4
מעלים ובודקים עם פניית דמה
שומרים ומעלים את הקובץ לשרת (העלאת קבצים, Git deploy או build מחדש, לפי איך שהאתר מתפרסם). ממלאים את הטופס באתר החי עם פרטים לדוגמה - תוך שניות ההודעה נוחתת בוואטסאפ ונשמרת בלוח הבקרה.
מה אם הטופס שולח ל-mailto: או ל-PHP script ולא ל-fetch?
לא כל טופס HTML זהה. אם הטופס משתמש ב-`<form action="mailto:...">` (שליחה ישירה לתוכנת מייל של המבקר, בלי שרת), התג עדיין תופס את אירוע השליחה (`submit`) בדפדפן ברגע שהמבקר לוחץ, ושולח את הפרטים לוואטסאפ - בלי תלות בכתובת המייל שהוגדרה בטופס.
אם הטופס שולח בקשה לקובץ PHP או Node בצד השרת (למשל `action="send.php"`), התג עדיין תופס את השליחה בדפדפן לפני שהיא יוצאת, כך שהוא לא תלוי בהצלחת השרת. חשוב לוודא רק שהתג נטען בעמוד עצמו שבו נמצא הטופס - אם הטופס נטען דרך iframe מאתר אחר, נדרש פתרון אחר.
כל טופס באתר ה-HTML שלך - יצלצל בוואטסאפ
שורה אחת לפני </body>, מ-19 ₪ לחודש, 7 ימי ניסיון בלי כרטיס אשראי. עובד על כל HTML נקי, בלי תלות בפלטפורמה.
שאלות נפוצות
איך מחברים אתר HTML פשוט לוואטסאפ בלי וורדפרס או וויקס?
מדביקים תג <script> אחד ישירות בקובץ ה-HTML, ממש לפני התג הסוגר </body>. הוא מזהה את שליחת הטופס הקיים בעמוד ושולח כל פנייה לוואטסאפ תוך שניות - בלי צורך בפלטפורמת ניהול תוכן או בשרת נוסף.
למה דווקא לפני </body> ולא ב-<head>?
הדבקה לפני </body> מבטיחה שהתג נטען אחרי שכל תוכן הדף (כולל הטופס) כבר קיים ב-DOM, ושהוא לא מעכב את הצגת התוכן למבקר. אפשר גם ב-head עם התג async, אבל לפני </body> היא הדרך הפשוטה והבטוחה ביותר לאתר HTML גולמי.
יש לי כמה דפי HTML נפרדים - צריך להדביק בכל אחד?
כן, אם כל דף הוא קובץ עצמאי בלי partial משותף. הדרך הנוחה יותר היא לרכז את הפוטר (או ה-body הסוגר) ב-include משותף - PHP include, SSI, או קובץ layout במחולל סטטי - כך שהדבקה אחת שם משפיעה על כל הדפים.
זה עובד עם Static Site Generator כמו Jekyll או Hugo?
כן. מדביקים את התג בקובץ ה-layout או partial המשותף (לרוב footer.html), ומריצים build מחדש. התג יופיע אז בכל עמוד שנבנה מאותה תבנית, בדיוק כמו בכל HTML גולמי אחר.
מה קורה אם הטופס שולח ל-mailto: או ל-PHP script?
לא משנה. התג תופס את אירוע השליחה בדפדפן (submit) ברגע שהמבקר לוחץ על הכפתור, לפני שהבקשה יוצאת ל-mailto או לשרת - כך שהוא לא תלוי ביעד המקורי של הטופס ועובד גם אם השרת לא זמין.
צריך גישת FTP או Git כדי להדביק את הקוד?
צריך גישה כלשהי לעריכת קבצי המקור של האתר - בין אם דרך FTP, לוח בקרה של האחסון, או ריפוזיטורי Git שממנו האתר נבנה. אין דרך להוסיף את הקוד ״מבחוץ״ באתר HTML סטטי, בניגוד לפלטפורמות עם לוח ניהול.
זה מאט את זמן הטעינה של אתר HTML קליל?
בפועל לא מורגש. אתרי HTML סטטיים כבר טוענים מהר, והתג עצמו קל וטוען אסינכרונית - כך שהוא לא מוסיף עיכוב משמעותי לזמן ההצגה הראשוני של הדף.