יצירת כפתור WhatsApp באתר ווקומרס שיאפשר ללקוחות לשלוח הודעה עם פרטים ספציפיים על המוצר או הפוסט שבו הם צופים כרגע. הינו פתרון אידיאלי לאתרי מכירות, קטלוגים או בלוגים שרוצים לשפר את חווית התקשורת עם הלקוחות.
כדי ליצור את כפתור הוואטסאפ הדינמי והמתקדם הזה באתר הוורדפרס שלכם, תצטרכו להכין את הדברים הבאים:
קוד PHP: זהו הליבה של המערכת, המכיל את הלוגיקה ליצירת הכפתור, עיצובו, וקביעת אופן שליפת הפרטים הדינמיים.
שורטקודים: נשתמש בשני סוגי שורטקודים שונים: אחד כללי וגמיש לשליטה מלאה, ואחד דינמי ואוטומטי שמתאים במיוחד לשימוש בתוך תבניות של JetEngine או עמודי מוצר/פוסטים יחידים.
פרטים מוכנים להעתקה והתאמה אישית: מספר הטלפון שלכם, בחירות עיצוביות לכפתור (כמו צבעים וטקסט), ועוד.
קוד PHP, במיוחד כזה שמוסיף פונקציונליות חדשה כמו שורטקודים, חייב להיות ממוקם במקום שוורדפרס יוכל להריץ אותו. קיימות מספר אפשרויות, ולכל אחת מהן יתרונות, חסרונות והשלכות שכדאי להכיר:
אזהרה חשובה: לפני ביצוע כל שינוי בקוד האתר, מומלץ בחום לגבות את כל קבצי האתר ומסד הנתונים שלו. שינויים שגויים בקוד עלולים לגרום לשגיאות באתר (White Screen of Death – מסך לבן) או אף להשבתה מלאה. כמו כן, לעולם אל תערכו קבצים ישירות בתבנית הפעילה (Parent Theme), מכיוון שעדכוני תבנית ידרסו וימחקו את השינויים שלכם. השתמשו תמיד בתבנית בת (Child Theme) או בפלאגין ייעודי.
זוהי הדרך המומלצת ביותר, במיוחד אם אינכם מרגישים בנוח עם עריכת קבצים ישירה בשרת. פלאגינים אלו מיועדים בדיוק למטרה זו, ומציעים סביבה בטוחה יחסית להוספת קוד.
דוגמאות לפלאגינים: Code Snippets, WPCode ודומיו.
כיצד לבצע:
התקינו והפעילו את אחד הפלאגינים הללו דרך לוח הבקרה של וורדפרס (תוספים > תוסף חדש).
עברו להגדרות הפלאגין (לרוב תחת "קטעי קוד" / "Code Snippets" בתפריט הראשי).
צרו "קטע קוד חדש" (Add New Snippet)
הדביקו את קוד ה-PHP המלא שסידרתם והתאמתם מראש.
וודאו שסוג הקוד מוגדר כ-PHP Snippet.
שמרו והפעילו את קטע הקוד.
השלכות:
יתרונות: בטוח יחסית (חלקם מציעים אפשרות לבדוק את הקוד לפני הפעלה מלאה), קל לנהל מספר קטעי קוד, ואינו מושפע מעדכוני תבנית.
חסרונות: מוסיף פלאגין נוסף לאתר (שעלול להשפיע מעט על ביצועים, אם כי פלאגינים אלה לרוב קלים), דורש התקנה ותחזוקה של הפלאגין עצמו.
זוהי שיטה נפוצה וטובה להוספת קוד מותאם אישית, אך היא דורשת שימוש ב"תבנית בת" (Child Theme) והיא מחייבת עריכה ישירה של קבצים בשרת.
כיצד לבצע:
וודאו שיש לכם תבנית בת פעילה. אם אין לכם, צרו אחת (יש פלאגינים כמו Child Theme Configurator שיכולים לעזור, או ליצור ידנית).
התחברו לשרת באמצעות FTP או מנהל קבצים.
נווטו לתיקיית תבנית הבת שלכם (לרוב: wp-content/themes/your-child-theme-name/).
פתחו את הקובץ functions.php (אם אינו קיים, צרו אותו).
הדביקו את קוד ה-PHP המלא שסידרתם והתאמתם מראש בתחתית הקובץ (רצוי מעל תגית הסגירה ?> אם קיימת, אך לא חובה).
שמרו את הקובץ.
השלכות:
יתרונות: קוד "נקי" שאינו דורש פלאגין נוסף, קל לניהול עבור פונקציונליות ספציפית לתבנית.
חסרונות: דורש יצירה ותחזוקה של תבנית בת. שינויים שגויים עלולים לגרום לשגיאות באתר (מסך לבן). אם אין תבנית בת ונוגעים בקובץ functions.php של התבנית הראשית – השינויים יימחקו בעדכוני תבנית!
זוהי הדרך המקצועית והבטוחה ביותר להוספת פונקציונליות נרחבת לאתר, ומפרידה את הקוד מהתבנית. זהו למעשה מה שפלאגינים כמו "Code Snippets" עושים מאחורי הקלעים, אך בניהול ידני.
כיצד לבצע:
התחברו לשרת באמצעות FTP או מנהל קבצים.
נווטו לתיקייה: wp-content/plugins/.
צרו תיקייה חדשה, לדוגמה: my-custom-whatsapp-plugin.
בתוך התיקייה החדשה, צרו קובץ PHP חדש, לדוגמה: my-whatsapp-code.php.
הדביקו את קוד ה-PHP המלא שסידרתם והתאמתם מראש לתוך קובץ זה, ובראשו הוסיפו את כותרת הפלאגין הבא:
הטבלה הבאה מפרטת את המקומות בקוד ששילבת בקובץ functions.php, בהם תוכלו לשנות טקסטים ומספרי טלפון חשובים. חפשו את הטקסט או את מספר השורה המצוינים בקוד שלכם.
| תיאור השינוי | היכן למצוא בקוד? | מה לשנות בפועל? | דוגמה לשינוי |
|---|---|---|---|
| **מספר הטלפון הראשי (ברירת מחדל) לשורטקוד מוצר** (המספר שאליו נשלחות הודעות דרך כפתור הוואטסאפ הכללי או כפתור מוצר, אם לא צוין אחרת). |
חפשו את השורה שמכילה:'phone' => '972541234567',זוהי כנראה שורה מספר 7 או בסמוך לה, תלוי איך הקוד שלכם מתחיל. |
שנו את מספר הטלפון המופיע בגרשיים ('972541234567') למספר הטלפון הרצוי שלכם. הקפידו על פורמט בינלאומי (ללא +, רווחים או מקפים). |
`'972501112233'` |
| **טקסט הכפתור הראשי (ברירת מחדל)** (הטקסט שיופיע על כפתור הוואטסאפ הכללי או כפתור מוצר, אם לא צוין אחרת). |
חפשו את השורה שמכילה:'button_text' => 'דברו איתנו',זוהי כנראה שורה מספר 11 או בסמוך לה. |
שנו את הטקסט המופיע בגרשיים ('דברו איתנו') לטקסט הרצוי לכם בכפתור. |
`'שלחו הודעה'` |
| **הודעה אוטומטית ללקוח (בכפתור מוצר)** (טקסט ההקדמה שמופיע אוטומטית בהודעת הווטסאפ כשלוחצים על כפתור מוצר ספציפי). |
חפשו את השורה שמכילה:$message = "שלום! אני מעוניין/ת במוצר: "זוהי כנראה שורה מספר 18 או בסמוך לה. |
שנו את הטקסט המופיע בגרשיים ("שלום! אני מעוניין/ת במוצר: ") לטקסט ההקדמה הרצוי לכם. |
`"היי, אני מתעניין ב:"` |
| **מספר הטלפון לכפתור הוואטסאפ הדינמי** (המספר שאליו תישלח הודעה דרך השורטקוד הדינמי [whatsapp_dynamic]). |
חפשו את השורה שמכילה:$phone = '972541234561'; // המספר שלךזוהי כנראה שורה מספר 95 או בסמוך לה. |
שנו את מספר הטלפון המופיע בגרשיים ('972541234561') למספר הטלפון הרצוי עבור הכפתור הדינמי. הקפידו על פורמט בינלאומי. |
`'972529876543'` |
// הוסף את הקוד הזה לקובץ functions.php של הערכה שלך
// 1. יצירת שורטקוד WhatsApp חדש
function create_whatsapp_button_shortcode($atts) {
// הגדרות ברירת מחדל
$atts = shortcode_atts(array(
'phone' => '972545621061', // המספר שלך בפורמט בינלאומי
'message' => '',
'product_title' => '',
'product_url' => '',
'button_text' => 'דברו איתנו',
'button_class' => 'whatsapp-button'
), $atts);
// אם יש כותרת מוצר ולינק, בנה הודעה אוטומטית
if (!empty($atts['product_title']) && !empty($atts['product_url'])) {
$message = "שלום! אני מעוניין/ת במוצר: " . $atts['product_title'] . "\n";
$message .= "לינק למוצר: " . $atts['product_url'];
} else {
$message = $atts['message'];
}
// קידוד ההודעה לכתובת URL
$encoded_message = urlencode($message);
// יצירת לינק WhatsApp
$whatsapp_url = "https://wa.me/{$atts['phone']}?text={$encoded_message}";
// HTML של הכפתור
$button_html = '
' . esc_html($atts['button_text']) . '
';
return $button_html;
}
add_shortcode('whatsapp_product_button', 'create_whatsapp_button_shortcode');
// 2. הוספת CSS לכפתור WhatsApp
function add_whatsapp_button_styles() {
echo '';
}
add_action('wp_head', 'add_whatsapp_button_styles');
// 3. פונקציה ליצירת כפתור WhatsApp עם נתוני מוצר דינמיים
function get_dynamic_whatsapp_button() {
global $post;
if (!$post) return '';
$product_title = get_the_title($post->ID);
$product_url = get_permalink($post->ID);
$phone = '972545621061'; // המספר שלך
$shortcode = '[whatsapp_product_button phone="' . $phone . '" product_title="' . $product_title . '" product_url="' . $product_url . '"]';
return do_shortcode($shortcode);
}
// 4. שורטקוד לכפתור דינמי
function dynamic_whatsapp_shortcode($atts) {
return get_dynamic_whatsapp_button();
}
add_shortcode('whatsapp_dynamic', 'dynamic_whatsapp_shortcode');
// 5. הוספת Font Awesome אם לא קיים
function add_font_awesome() {
if (!wp_style_is('font-awesome', 'enqueued')) {
wp_enqueue_style('font-awesome', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css');
}
}
add_action('wp_enqueue_scripts', 'add_font_awesome');
כדי להטמיע את כפתורי ה-WhatsApp באתר שלכם בקלות, אתם תשתמשו בשורטקודים (Shortcodes). אלו למעשה "פקודות" קצרות שאתם מכניסים לעמודים או לפוסטים באתר, והן הופכות אוטומטית לכפתור WhatsApp פעיל. ישנם שני סוגים עיקריים של שורטקודים בקוד ששילבתם:
[whatsapp_product_button]זהו השורטקוד העיקרי והשימושי ביותר שלכם. הוא מיועד להופיע בעמודי מוצרים או פוסטים בודדים, והוא חכם מספיק כדי לזהות אוטומטית את שם המוצר/פוסט ואת הקישור אליו. כך, כשהלקוח לוחץ על הכפתור, נשלחת אליכם הודעת וואטסאפ עם שם המוצר המדויק והקישור הישיר אליו – חוסך לכם וללקוח זמן יקר!
שימושים נפוצים:
בעמודי מוצרים בחנות וירטואלית (לדוגמה, מתחת לתיאור המוצר).
בסוף פוסט בבלוג או עמוד שירות, כדי לאפשר לגולשים לשאול שאלה ספציפית על התוכן.
אפשרויות התאמה אישית (לא חובה): אף על פי שהכפתור עובד "מחוץ לקופסה", אתם יכולים להתאים אותו אישית ישירות בתוך השורטקוד:
שינוי מספר הטלפון לאותו כפתור בלבד:
ברירת המחדל מוגדרת בקוד ה-PHP שלכם (בשורה 7). אם תרצו שהודעה מכפתור ספציפי זה תגיע למספר אחר, הוסיפו את הפרמטר phone:
[whatsapp_product_button phone="972501234567"]
שינוי טקסט הכפתור:
ברירת המחדל היא "דברו איתנו" (מוגדר בשורה 11). כדי לשנות טקסט לכפתור ספציפי זה, הוסיפו את הפרמטר button_text:
[whatsapp_product_button button_text="שאלה על המוצר"]
הגדרת הודעה מותאמת אישית (במקום שם המוצר/קישור):
אם במקרה מסוים אתם לא רוצים שההודעה תכלול את שם המוצר והקישור, אלא טקסט אחר לחלוטין, השתמשו בפרמטר message:
[whatsapp_product_button message="אני מעוניין בייעוץ כללי!"]
שימו לב: שימוש בפרמטר message יבטל את ההוספה האוטומטית של שם המוצר והקישור.
[whatsapp_dynamic]שורטקוד זה הוא למעשה קיצור דרך לכפתור ה-[whatsapp_product_button], והוא נועד בעיקר להטמעה נוחה במקומות כמו תבניות (Templates) של אלמנטור או JetEngine (כמו "Listing Grid"). הוא מבצע את אותה פעולה של זיהוי מוצר/פוסט באופן אוטומטי ושליחת הודעה עם פרטיו.
שימושים נפוצים:
בתבניות של רשימת מוצרים או פוסטים (Listing Grids) באלמנטור/JetEngine.
בכל מקום בו תרצו כפתור וואטסאפ גנרי שמתאים את עצמו למוצר/פוסט שבו הוא נמצא.
התאמה אישית של מספר הטלפון לכפתור הדינמי:
מספר הטלפון אליו תשלח ההודעה דרך שורטקוד זה מוגדר בקוד ה-PHP שלכם (בשורה 95). אם תרצו לשנות אותו, עליכם לערוך את המספר ישירות שם.
שלבי הטמעה:
פתחו את תבנית ה-Listing (Listing Template) באלמנטור:
לכו ללוח הבקרה של וורדפרס > JetEngine > Listings.
רחפו מעל ה-Listing Template הרצויה (לדוגמה, תבנית עבור מוצרים או פוסטים שלכם) ולחצו על "Edit with Elementor" (עריכה עם אלמנטור).
גררו "ווידג'ט קוד קצר" (Shortcode Widget) לתוך התבנית:
בסרגל הצד של אלמנטור, חפשו את הווידג'ט שנקרא "Shortcode" (קוד קצר) או "טקסט" (Text Editor).
גררו את הווידג'ט למקום הרצוי בתוך פריט ה-Listing (לדוגמה, מתחת לכותרת המוצר או לתיאורו).
הכניסו את השורטקוד:
בתוך הווידג'ט שגררתם, פשוט הקלידו את השורטקוד:
[whatsapp_dynamic]
הווידג'ט יציג לכם תצוגה מקדימה של הכפתור, וכשתצפו ב-Listing Grid האמיתי (בעמוד כלשהו), הכפתור יופיע עם פרטי המוצר/פוסט הנכונים לכל פריט.
4. שמרו את השינויים בתבנית ה-Listing.
השורטקוד [whatsapp_product_button] הוא גמיש וניתן להטמיע אותו בכל עורך תוכן של וורדפרס (עורך הגוטנברג, אלמנטור, או כל עורך קלאסי אחר). הוא יעבוד אוטומטית אם הוא נמצא בתוך עמוד/פוסט של מוצר, וימשוך את הפרטים הרלוונטיים. אם תטמיעו אותו בעמוד רגיל שאינו מוצר/פוסט, הוא יציג את הכפתור עם הטקסט שהגדרתם לו כברירת מחדל בקוד ה-PHP.
שלבי הטמעה (באמצעות עורך גוטנברג / אלמנטור):
פתחו את הפוסט/עמוד לעריכה:
לכו ללוח הבקרה של וורדפרס > פוסטים / עמודים.
בחרו את הפוסט או העמוד בו תרצו להטמיע את הכפתור ולחצו "עריכה".
הוספת השורטקוד:
בעורך גוטנברג: לחצו על כפתור ה-+ כדי להוסיף בלוק חדש. חפשו את הבלוק "Shortcode" או "קוד קצר" והכניסו בתוכו את השורטקוד.
באמצעות אלמנטור: גררו "Shortcode" ווידג'ט או "Text Editor" (עורך טקסט) למיקום הרצוי בעמוד, והכניסו את השורטקוד.
בעורך קלאסי: פשוט הדביקו את השורטקוד ישירות בתוכן העמוד/פוסט.
הכניסו את השורטקוד הרצוי:
לאלמנטור / עמוד מוצר (ברירת מחדל):
[whatsapp_product_button]
שורטקוד זה יציג את הכפתור, ובמידה והוא בתוך עמוד מוצר/פוסט, הוא כבר יזהה את הפרטים וישלח הודעה בהתאם.
4. שמרו/עדכנו את הפוסט/עמוד.
שעות פעילות:
שעות פעילות: א-ה 8:00-24:00 יום ו וערבי חג- 10:00-14:00
טלפון:
054-8964830
אימייל:
webstudio@nuritmellmatis.co.il
כתובת:
בני משה 13, רחובות
20+ שנות פעילות מאות לקוחות ונכסים ברחבי הדיגיטל
הסטודיו של מל: סטודיו בוטיקי המתמחה בבניית אתרים מקצועיים בעיצובים יוצאי דופן.
מייסדת הסטודיו: נורית מל מאטיס מעצבת ויוצרת נכסים ברשת עבור סוכנויות דיגיטליות ולקוחות פרטיים עם ניסיון של 20+ שנים, מאות לקוחות ואלפי עיצובים ברחבי הדיגיטל.
(מוזמנים לצפות בהיסטוריה העסקית) עם הרבה מחשבה ותכנון מדויק הצוות ואני נעצב גם לך אתר אינטרנט אישי וחדשני, מותאם לגלישה בנייד-כזה שמביא עוד לקוחות.
זמינה עבורכם בטלפון: 0548964830
גילוי נאות: בדפי האתר נמצא תוכן רב הנכתב מנסיונינו האישי ומרצונינו החופשי לשתף בידע שצברנו, על מנת להעשיר את הידע של המבקרים באתר.
באם מוצגים חידושים והמלצות הן אינם מהווים בשום אופן תחליף לייעוץ מקצועי. בדפי האתר יתכנו פרסומות אפיילייט.
התוכן באתר נעזר בכלי AI ועובר בדיקה אנושית ומחקר מקיף.