איך להוסיף כפתור וואטסאפ לאתר
נכתב ע"י יוחאי ירמיהו21 תגובות
אין ספק שבשנים האחרונות וואטסאפ (WhatsApp) הפכה להיות אחת האפליקציות המובילות בחנות האפליקציות. אחרי שלימדנו אתכם איך לפתוח חשבון וואטסאפ עסקי וגם איך להתקין וואטסאפ במחשב כעת מה שנשאר לעשות זה להוסיף כפתור וואטסאפ לאתר של העסק ולאפשר ללקוחות שלכם לשלוח הודעות וואטסאפ בלחיצת כפתור בודדת.
במדריך הבא נלמד אתכם איך עושים קישור לוואטסאפ וגם איך להוסיף כפתור וואטסאפ לאתר באמצעות קישור שהגדרתם או באמצעות קוד של GetButton (קוד להוספת כפתורי יצירת קשר).
ניתן לצפות בסרטון הדרכה הבא המסביר איך ליצור קישור לוואטסאפ ואיך להוסיף כפתור וואטסאפ לאתר
בסרטון הדרכה הבא תוכלו ללמוד כיצד להוסיף שורת יצירת קשר הכוללת גם כפתור וואטסאפ וטלפון
איך לבנות אתר בחינם בשעה וחצי?
יש לי הצעה מעניינת עבורך, יצרתי הדרכה מלאה של למעלה משעה וחצי שתלמד אותך איך לבנות אתר מ-0 בחינם כולל רכישת אחסון ודומיין. נשמע מעניין? אשמח לשלוח לך אותה למייל.
איך עושים קישור לוואטסאפ?
וואטסאפ מאפשרים לנו לעשות שימוש באפשרות של הקלקה לצ'אט וכאן בעצם מדובר על היכולת ליצור קישור פשוט באתר עם לינק שיאפשר לשלוח את הצופה לשיחה איתנו בוואטסאפ (גם אם אנחנו לא נמצאים באנשי הקשר שלו). ניתן להשתמש בטכניקה הבאה על ידי הוספת קישור טקסט פשוט באתר או קישור של תמונה המכילה כפתור וואטסאפ. למי שמחפש תמונות של וואטסאפ בחינם נסו למצוא את מבוקשכם במאמר שפרסמנו המציג אתרי תמונות בחינם.
כאשר אנחנו רוצים ליצור/להוסיף קישור לוואטסאפ בתוך האתר נשתמש בקוד קישור הבא:
https://api.whatsapp.com/send?phone=מספר-טלפון
את מספר הטלפון שלכם אתם צריכים להוסיף לקישור שהצגנו ולהחסיר את כל התווים המיותרים ואת הספרה הראשונה (הספרה 0).
אז אם למשל מהספר טלפון הוא 077-9999999 נוריד את הספרה הראשונה (הספרה 0) ואם במספר יש מקף או תווים נוספים נוריד גם אותם ונקבל את המספר 779999999.
לתחילת המספר אנחנו גם צריכים להוסיף את הקידומת של ישראל שהיא 972 והמספר הסופי יהיה 972779999999.
אחרי שביצעתם את אותו תהליך שינוי עבור המספר האמיתי שלכם פשוט תחליפו אותו עם הטקסט "מספר טלפון" בקישור שהצגנו מעל וזה יהיה הקישור שבו תוכלו להשתמש באתר שלכם.
https://api.whatsapp.com/send?phone=972779999999
נכון להיום וואטסאפ מאפשרים לנו לעשות שימוש בקישור מקוצר שמבצע הפניית 302 אל הקישור הארוך שהצגנו מעל. למי שרוצה תוכלו גם להשתמש בקישור המקוצר מתחת על מנת להוסיף כפתור לאתר וכאשר מישהו יכנס לקישור המקוצר הוא יגיע לקישור שהצגנו מעל.
https://wa.me/מספר-טלפון
https://wa.me/972779999999
יצירת קישור לוואטסאפ עם הודעה
אופציה נוספת ויעילה היא הוספת קישור להודעת וואטסאפ, וזה בעצם אומר שכאשר ילחצו על הכפתור וואטסאפ האפליקציה תיפתח על מספר הטלפון שלכם ביחד עם הודעה מוגדרת מראש. מתחת אתם יכולים לראות איך להוסיף הודעה שתבחרו בכתובת הקישור הארוכה של וואטסאפ ובכתובת המקוצרת.
https://api.whatsapp.com/send?phone=טלפון&text=הודעה
https://wa.me/טלפון?text=טקסט
ניתן לקחת את הקוד שמופיע מעל, להוסיף את מספר הטלפון כפי שהסברנו בחלק הראשון של המדריך ולהוסיף הודעה טקסט מותאמת לכל קישור על ידי החלפת המילה "טקסט" עם התוכן שאתם רוצה שיופיע.
חשוב לציין שעל מנת ליצור קישור תקין אתם תצטרכו להוסיף את הקוד %20 בין מרווחי המילים שבהודעה שאתם רוצים לשלוח (הקוד הזה מסמל רווח בקישור).
אז אם לדוגמא אתם רוצים לשלוח את ההודעה "שלום אני מעוניין בשירותי בניית אתרים" תחליפו את כל המרווחים בהודעה עם הקוד %20 וההודעה החדשה שלכם תהיה "שלום%20אני%20מעוניין%20בשירותי%20בניית%20אתרים".
תוכלו לראות מתחת איך יראה הקוד עם ההודעה ומספר הטלפון בכתובת וואטסאפ הארוכה והמקוצרת.
https://api.whatsapp.com/send?phone=972779999999&text=שלום%20אני%20מעוניין%20בבניית%20אתר
https://wa.me/972779999999?text=שלום%20אני%20מעוניין%20בבניית%20אתר
ברגע שמישהו ילחץ על הקישור שהגדרתם אז אפליקציית הוואטסאפ שלו תיפתח עם המספר שלכם וההודעה שהגדרתם תטען באופן אוטומטי ותהיה לו האפשרות לבחור האם לשלוח את ההודעה שהזנתם או לא.
אם התוצאה הסופית שלכם היא קישור מאוד ארוך ולא נעים תוכלו לקצר את הקישור באמצעות אתרים כמו bitly שיאפשרו לכם להכניס את הקישור הקיים ולקבל כתובת מקוצרת שמפנה אל הקישור שהגדרתם.
הוספת כפתור וואטסאפ באמצעות GetButton
לאלו מכם שלא יודעים איך להוסיף את הכפתור לאתר באופן ישיר קיימים גם תוספים לוורדפרס ואפילו אתרים חיצוניים ופופולריים כמו GetButton שמאפשרים לנו להגדיר ולהוסיף לאתר כפתורי וואטסאפ, כפתורים לפייסבוק Messenger וכו… בחלק זה של המדריך נסביר איך להוסיף את GetButton לתוך אתר וורדפרס.
יצירת כפתור וואטסאפ באמצעות GetButton
על מנת שתוכלו ליצור כפתור וואטסאפ באמצעות GetButton כנסו לקישור מתחת:
בתוך העמוד תהיה לכם האפשרות להגדיר את סוג הלחצנים שאתם רוצים: וואטסאפ, פייסבוק מסנגר, טלפון, אימייל כו'… ותהיה לכם גם האופציה להגדיר את ההודעה שאתם רוצים שתופיע בכפתור. קיימות גם כמה אפשרויות עריכה נוספות בתשלום כמו הוספת עיצוב לוגו ושינוי מיקומים לכפתור למי שרוצה אבל בדרך כלל ניתן להסתפק בפתרון החינמי.
לאחר שהגדרתם את הפרטים בחלק העליון של העמוד אתם תתבקשו להכניס כתובת מייל בחלק התחתון על מנת לקבל את הקוד HTML של הכפתור. זה לא חובה להכניס את כתובת המייל האמיתית שלכם ואם תכניסו מייל מזויף לאחר לחיצה על הכפתור של "Get Button Code" אתם תקבלו את הקוד שתוכלו להכניס לאתר כפי שנסביר בפסקה הבאה.
הוספת כפתור וואטסאפ לאתר וורדפרס
בשביל שתוכלו להוסיף את הקוד שקיבלתם מ-GetButton לתוך האתר שלכם אתם תצטרכו להכניס את הקוד בתחתית של כל עמוד ועמוד באתר מעל תגית הסגירה של.
על מנת להוסיף את הקוד לתוך אתר וורדפרס תצטרכו להתקין את התוסף Tag Manager – Header, Body And Footer. אם אתם לא יודעים איך להתקין תוספים תוכלו לצפות במדריך של תוספים לוורדפרס ששם הסברנו את הנושא.
לאחר התקנה והפעלה של התוסף וכאשר אתם נמצאים בתוך אזור הניהול של וורדפרס תלחצו בתפריט הימני על "Tag Manager". בתוך עמוד התוסף תחת הכותרת של "Insert footer tags code below, code above :" תכניסו את הקוד שקיבלתם ותשמרו את השינויים. דרך אגב למי שסקרן מדובר כאן בתוסף לוורדפרס שפיתחנו ותוכלו באמצעותו להטמיע באתר את גוגל אנליטיקס, גוגל Tag Manager וגם את Pixel של פייסבוק.
אם ביצעתם את התהליך בהצלחה אז לאחר מכן יופיע הכפתור של וואטסאפ באתר שלכם עם הטקסט שהגדרתם. מתחת אתם יכולים לראות איך נראה הכפתור לוורדפרס שאנחנו יצרנו בתוך האתר.
מהניסיון שלנו הוספת כפתור וואטסאפ לאתר יכולה להגדיל את אחוזי ההמרות ואת כמות הפניות שאתם תקבלו באופן משמעותי ולכן מדובר בפעולה שאנחנו ממליצים לעשות בכל אתר ואתר.
עוד לא צפיתם בהדרכה? זה בחינם!
אני רוצה ללמד אתכם לבנות אתר אחד בחינם. מדובר על הדרכה של למעלה משעה וחצי שבה אני אלמד אותך מ-0 לבנות אתר כולל רכישת אחסון ודומיין. לקבלת ההדרכה למייל באופן מיידי יש להשאיר פרטים מתחת.
אם אהבתם את המדריך ואתם רוצים לשתף אותו ניתן לעשות זאת על ידי לחיצה על כפתורי השיתוף מתחת:
יוחאי ירמיהו
בעל תואר ראשון בלוגיסטיקה וכלכלה ותואר הנדסאי בתעשייה וניהול עם התמחות בשיווק.
מעצב גרפי ומפתח אתרים עם ניסיון מעשי של למעלה מעשור בכל מה שקשור לעולם הדיגיטלי. נינג'ה מומחה למערכת המופלאה לבניית אתרים שנקראת וורדפרס, וזהו בסך הכל :-).
מאמרים נוספים שעשויים לעניין אתכם:
יש לכם שאלות או משהו להוסיף? שתפו אותנו בתגובות מתחת!
אם יש לכם שאלות או משהו להוסיף נשמח לשמוע מכם בתגובות מתחת ולסייע במידת הצורך.
21 תגובות
לא ניתן לפרסם תגובות
איך עושים כפתורי שיתוף של וואצפ כמו שלך?
היי, אתה מתכוון לכפתורי שיתוף שמופיעים במאמר?
אם אפשר לעשות את זה באמצעות תוסף לוורדפרס שנקרא Mashshare. יכול להיות שצריך לרכוש הרחבה בתשלום בשביל שזה יוצג ככה.
איך אני מוחקת את הכפתור ווצאפ שלכם? הוא לא עובד באתר או בטלפון. זה דחוף לי
היי, את מוחקת את זה באותה צורה שאת מוחקת כל תוסף אחר באתר, אולי זה יעזור:
https://www.yydevelopment.co.il/wordpress-website/wordpress-plugins/
שאלה לגבי כפתור הווצאפ?
האם אפשר ליצר אוטומציה שברגע שהלקוח לוחץ על הכפתור באתר תהיה הודעה מהיכן באתר לחץ על הווצאפ? (למשל מאיזה דף נחיתה)?
היי תמר,
בתוסף אפשר להגדיר הודעה אחת שתופיע ברגע שמישהו לוחץ על הכפתור. כאשר מדובר על אותו אתר עם עמודים שונים אז לא אפשרי להגדיר הודעה שונה לכל עמוד (לפחות לא בתוספים שהצגתי במדריך).
אם זה חשוב לך שלכל עמוד תהיה הודעה נפרדת סביר להניח שזה משהו שתצטרכי ליצור בפיתוח אישי.
היי, הדרכה מצויינת!
איך אפשר אבל בלחיצה על האייקון שהווצאפ ווב יפתח בחלון חדש ולא יגרוס את האתר הפתוח?
היי אתי, תודה על התגובה
לצערי כרגע זה לא אפשרי באמצעות התוסף.
אני אוסיף כנראה את האפשרות לעשות את זה באחד מסבבי העדכונים הבאים, אבל זה יכול לקחת קצת זמן אז אם זה ממש חשוב לך תצטרכי לנסות תוסף אחר.
שלום רב,
אחלה אפליקציות אבל תראה בבקשה בקישור מה קורה שאני מתקין את שתי האפליקציות.
ניסיתי לשנות את המרווחים בין האייקונים אך ללא הצלחה.
תודה
היי, אני לא כך כך בטוח מה אני רואה שם. אם אני מנחש נכון התקנת במקביל גם את התוסף של הוואטסאפ וגם את התוסף של הטלפון נכון?
אתה יכול לנסות ולהיכנס לאפליקציה של הטלפון ותחת האפשרות של Horizontal Position לשנות את זה מ-Right ל-Left ואז הכפתור יוצג בצד שמאל במקום.
אתה יכול גם לנסות את התוסף הבא במקום שניהם והוא יציג שורת יצירת קשר גם עם וואטסאפ וגם עם טלפון במקביל:
https://www.yydevelopment.co.il/mobile-contact-line/
אתה יכול לנסות ולהיכנס לאפליקציה של הטלפון ותחת האפשרות של Horizontal Position לשנות את זה מ-Right ל-Left ואז הכפתור יוצג בצד שמאל במקום – ניסיתי וזה לא הצליח.
אנסה את מה שהצעת בקישור, תודה .
שים לב שיש 2 אפשרויות של שליטה במיקום של הכפתור. אחת בחלק העליון של התוסף ואחת תחת הכותרת של Mobile Positioning.
אתה כנראה משנה את המיקום ב-Mobile Positioning וזה עובד רק אם תסמן את האפשרות של Choose different button position on mobile. בעצם על ידי בחירה של האפשרות הזאת יש לך את האופציה להגדיר מיקום אחד במסך של מחשב ומיקום אחר במובייל.
אם אתה משנה את המיקום באזור העליון של הגדרות התוסף זה ישנה את המיקום גם במחשב וגם במובייל ככה שזה כנראה כן ישפיע עם האופציה האחרת לא עבדה.
באתר אחד זה הצליח חלקית ושני לוקח זמן אולי להתעדכן.
אני על זה אפנה במידה ולא אצליח לסיים בצורה ראויה .
תודה
היי
הצלחתי מעולה תודה ורק עוד שאלה, יש תוסף ליצירת טופס צור קשר קבוע חינמי ? אני מתכוון לכזה שתמיד נמצא בחלק התחתון של העמוד בכל עמוד ויש בו שדות לשם וטלפון . צירפתי דוגמא:
היי בקשר להודעה עם הוואטאספ כנראה יש לך Cache (זיכרון מטמון) באחסון או באתר עצמו אז לוקח זמן עד שאתה רואה את השינויים שאתה מבצע, אבל אני שמח שזה נפתר.
בקשר לתמונה שצירפת התמונה היא לשורת יצירת קשר ולא לטופס יצירת קשר. אבל אם אתה מדבר על טופס כמו שמופיע בתחתית העמוד הזה אז במקרה שלי מדובר על קוד אישי שלי אבל התוסף שאני משתמש בו שאני בונה אתרים ללקוחות זה Contact Form 7.
אבל קח בחשבון שמדובר על תוסף יחסית מורכב שלא מגיע עם עיצוב אז אתה תצטרך למצוא עיצוב לקוד מהאינטרנט ובנוסף תצטרך למצוא את הדרך להציג אותו בחלק התחתון של העמוד (כל עוד זה לא החלק הכי תחתון) ובשביל לעשות את זה צריך לדעת איך האתר בנוי אז לצערי בזה לא אוכל לסייע.
זה אכן היה בגלל שלא מחקתי באותו רגע זיכרון מטמון ואז חשבתי על זה וזה הצליח.
לגבי התוסף שרשמת אני מכיר כמובן ויש לי בכל האתרים אבל כמו שאמרת צריך עיצוב לזה ודרך איך להשאיר את זה קבוע בתחתית העמוד כל זמן של גלילה או ללא גלילה.
תודה רבה, אחלה תוספים בנית, המשך הצלחה!
הי יוחאי,
אחלה אתר יש לך עם הרבה אינפומציה מועילה ומחכימה ,פשוט תענוג רב תודות לך על התכנים שאתה מעלה ועל העזרה שלך,זה ממש ממש לא מובן מאליו.
שאלתי היא איך ניתן להחליף את מספר הטלפון של תוסף וואטסאפ באתר וורדפרס?
החלפנו מספר טלפון חדש לאתר והכפתור וואטסאפ מקושר למספר טלפון הישן ואני רוצה להחליפו בחדש.
תודה רבה לך מראש.
היי יהודה, כן זה לא אמור להיות בעיה להחליף את המספר.
אם התקנת את התוסף שבסרטון אז יש כאן הסבר לאיך לערוך אותו ובמידה ומדובר בתוסף אחר אז פשוט תצטרך למצוא את המיקום שממנו נטען התוסף או הכפתור ולשנות את המספר.
תודה על המענה המהיר יוחאי.
מדובר בתוסף אחר,איך ניתן למצוא את המיקום שממנו נטען התוסף או הכפתור?
הגעתי לשורת קוד החלפתי את המספר אבל המספר לא נשמר…יש איזה דרך לגרום לשמור את המספר אולי בשינוי איזה שהוא פרמטר בקוד או מה שעשתיתי הוא לא כך צריך להיות?
אם זה תוסף אחר לצערי אני לא יודע איך להגיע אל המספר.
בקשר לנושא שלא השתנה הקוד יכול להיות שיש לך גם תוסף של זיכרון מטמון שצריך לנקות כדי שיראו את השינויים בעמוד. ממליץ לך לנסות לפנות למי שבנה את האתר בשביל סיוע.
תודה רבה על העזרה שלך יוחאי.