הוקים בוורדפרס – WordPress Hooks

מערכת ההוקים בוורדפרס מאפשרת לכם להכניס פונקציונליות בכל מקום שתבחרו בתבנית שלכם.

אם אתם בענייני פיתוח וורדפרס, לא תוכלו להתעלם מהוקים (Actions & Filters) להרבה זמן לפני שתהיו מוכרחים לרדת לעומק ולהבין את המשמעות של אותם הוקים בוורדפרס וכיצד להשתמש בהם. שינויים בפונקציות הליבה של וורדפרס אסורות בהחלט, כך שבמידה ואתם מעוניינים לשנות פונקציונליות מסויימת או לחילופין ליצור חדשה, הוקים הינם הדרך לבצע זאת.

הוקים בוורדפרס מאפשרים למפתחי וורדפרס להצמיד את הקוד שהם כתבו לליבה של וורדפרס, לתבניות ולתוספים. בפוסט זה נסביר מהם הוקים, נעבור על סוגים שונים של הוקים, נראה מספר דוגמאות להוקים בפעולה ואף נראה כיצד ליצור הוקים משלכם.

הסבר על המונחים

הוק (Hook) הינו מונח גנרי בוורדפרס המתייחס למיקומים בהם אתם יכולים להוסיף קוד משלכם או לשנות את הפעולות אותן וורדפרס מבצעת או מדפיסה כברירת מחדל. קיימים שני סוגי הוקים – Actions & Filters, לצורך הנוחות נתייחס אליהם בפוסט כפעולות ופילטרים.

פעולה (Action) בוורדפרס היא הוק המתבצע בזמן ספציפי כאשר וורדפרס רצה ומאפשר לכם לבצע פעולה מסויימת באותו זמן. פעולה זו יכולה להיות יצירת פוסט מותאם אישית (Custom Post Type) כאשר וורדפרס מאותחלת או אף שיתוף הפוסט שלכם בפייסבוק כאשר אתם מפרסמים פוסט.

פילטר (Filter) בוורדפרס מאפשר לכם לבצע מודיפיקציה למידע בוורדפרס לפני שהוא נשלח למסד הנתונים או לדפדפן. דוגמא מצויינת לשימוש בפילטר היא הוספה של קוד מסויים בסוף כל פוסט או שינוי אורך התקציר (excerpt) המוצג לכל פוסט ופוסט.

בתחילה, יכול להיות קצת קשה להבדיל בין פעולות לפילטרים. ההבדל המהותי בינהם הינו שכאשר אתם עובדים עם פילטר, אתם מקבלים פיסת מידע כלשהי ולאחר מכן, בסוף הפונקציה עליכם להחזיר את אותה פיסת מידע (לאחר השינוי שביצעתם על אותו מידע). לעומת זאת, בעבודה עם פעולה אתם לא מקבלים או משנים מידע, אלא פשוט מקבלים מקום להוסיף ולהריץ קוד משלכם בזמן מסויים המהלך הריצה של וורדפרס (WordPress Runtime).

סוגים של פעולות ופילטרים

ב WordPress Codex ישנם שני דפים חשובים היכולים לעזור לכם להתמצא באילו הוקים קיימים לרשותכם. בעמוד הרפרנס של פעולות בוורדפרס ישנה רשימה של סוגי הפעולות הקיימות והן מחולקות לפי הקטגוריות הבאות:

תמצאו ב WordPress Codex עמוד דומה המציג את הפילטרים הקיימים לרשותכם ואותם פילטרים מחולקים גם כן לפי קטגוריות:

רבים מאותם פילטרים מחולקים לשתי תת קטגוריות, קריאה ממסד הנתונים וכתיבה למסד הנתונים. אלו תלויים באם אתם מבצעים קריאה ממסד הנתונים לפני שאתם מציגים תוכן בדף או בעמוד העריכה, או שאתם כותבים תוכן לפני שאתם שומרים אותו במסד הנתונים.

הצטרפו לרשימת התפוצה!

העבודה עם הוקים בוורדפרס מתחילה בהבנה לאיזה הוק אתם צריכים להצמיד את הקוד ורק אחר כך לכתוב את הקוד המבצע מודיפיקציה למידע שאתם צריכים (פילטר) או מריץ פעולה שאתם מעוניינים להריץ (פעולה).

כיצד להצמד להוקים או להסיר צימוד להוקים?

אם ברצונכם להצמיד פונקציות משלכם, הפרוצדורה היא די פשוטה, אך אתם צריכים קודם לדעת מספר דברים. עבור פעולות, תרצו לדעת את שם ההוק (hook name) ומתי עליו לרוץ. עבור פילטרים, אתם נדרשים לדעת את שם ההוק גם כן, אך אתם נדרשים לדעת בנוסף גם איזה סוג ערך אתם מקבלים ואיזה עליכם להחזיר. בנוסף לאלו אתם צריכים לדעת את שם הפונקציה בה נמצא הקוד שלכם.

כיצד להצמד לפעולה

add_action( $hook, $function_to_add, $priority, $accepted_args );

הפרמטרים הדרושים לפונקציה add_action הינם ההוק אליו אתם מעוניינים להצמד ושם הפונקציה שברצונכם להצמיד אליו.  הפרמטר priority הוא אופציונלי ומייצג מספר שלם בין 1 ל 999 הקובע את סדר העדיפויות של הפונקציות המוצמדות לאותו הוק ספציפי. ערך גבוה יותר ירוץ בשלב מאוחר יותר ולהפך. הפרמטר האחרון הינו פחות שימושי וקיים למצבים בהם אתם מעוניינים להעביר או לקבל מספר ארגומנטים.

לידיעתכם, פרמטר ה priority בברירת המחדל שלו הוא 10.

כיצד להצמד לפילטר

add_filter( $tag, $function_to_add, $priority, $accepted_args );

הפונקציה add_filter עובדת בצורה זהה כמו add_action, אך זכרו כי עבור פילטר – על הפרמטר function_to_add לקבל ערך ולהחזיר אותו בסוף הפונקציה.

כיצד להסיר צימוד להוקים

הסרת צימוד להוקים הוא מאד פשוט. השתמשו בפונקציה remove_action או remove_filter יחד עם שם ההוק, שם הפונקציה והעדיפות. גם במקרה זה ה priority הוא אופציונלי ועוזר למצבים בהם אתם נדרשים להסיר צימוד לפונקציה אשר מוצמדת יותר מפעם אחת ואתם מעוניינים להסיר רק צימוד אחד של אותה פונקציה.

remove_action( $tag, $function_to_remove, $priority );
remove_filter( $tag, $function_to_remove, $priority );

לאחר שהבנו את הבסיס של כיצד להסיר ולהצמיד פונקציות, בואו ניתן מבט במספר דוגמאות מהעולם האמיתי של מספר הוקים בפעולה.

דוגמאות שימוש בהוקים – וורדפרס

ישנם מעבר ל 200 הוקים בוורדפרס. כמובן שלתוספים ותבניות ישנם הוקים משל עצמם כך שמספר ההוקים הוא בעצם כמעט אינסופי. תנו מבט מטה ותראו מספר דוגמאות לשימוש בהוקים של וורדפרס ושל התוסף WordPress SEO by Yoast.

הוספת קישור לעמוד הבית בפוטר (footer)

<?php
/****** BEGIN HERE ******/
function add_footer_link() { ?> 
    <a href="https://savvy.co.il">Savvy.co.il - WordPress Developer &amp Designer</a>
<?php
}
add_action( 'wp_footer', 'add_footer_link' );

בדוגמא מעלה ניתן לראות פונקציה בשם add_footer_link המוצמדת להוק (פעולה) של וורדפרס בשם wp_footer. פעולה זו מאפשרת להוסיף קוד מסויים (במקרה שלנו קישור לעמוד הבית), במיקום של אותו הוק (מיקומו בפוטר).

שינוי אורך התקציר (excerpt)

function excerpt_length_example( $words ) {
    return 15;
}
add_filter( 'excerpt_length', 'excerpt_length_example' );

בדוגמא זו אנו נצמדים להוק (פילטר) בשם excerpt_length המספק לנו מספר (שלם) הקובע את מספר המילים שיופיע כשאשר משתמשים בפונקציה the_excerpt() בתבנית שלכם.

אם אינכם בטוחים איזה סוג ערך הפילטר אמור לקבל, חפשו בקוד הליבה של וורדפרס את apply_filters( 'filter_name' ותנו מבט עמוק יותר במה שקורה עם אותו פילטר.

להצמד לשלב בו מפרסמים פוסט

function publish_post_tweet($post_ID) {
    global $post;
    // Code to send a tweet with post info
}
add_action('publish_post', 'publish_post_tweet');

בדוגמה חלקית זו, תוכלו לראות שאנו נצמדים להוק (פעולה) בשם publish_post הרצה בזמן שפוסט מפורסם. אתם יכולים להשתמש בה בכדי לבצע משהו בשלב זה כמו לפרסם את הפוסט שלכם בטוויטר. הקוד המלא מעט יותר מסובך ומעבר לסקופ של מדריך זה, אך זה מספק דוגמה מצויינת לפעולה שאתם יכולים לבצע בכל פעם שפוסט מפורסם באתר וורדפרס שלכם.

להצמד לשלב בו מוסיפים נכסים (סקריפטים וקבצי CSS)

function themeslug_enqueue_style() {
	wp_enqueue_style( 'core', 'style.css', false ); 
}

function themeslug_enqueue_script() {
	wp_enqueue_script( 'my-js', 'filename.js', false );
}

add_action( 'wp_enqueue_scripts', 'themeslug_enqueue_style' );
add_action( 'wp_enqueue_scripts', 'themeslug_enqueue_script' );

אני מניח שראיתם משהו דומה לקוד הבא ברבים מהמאמרים בבלוג זה. הוא נמצא בשימוש רבות ולומדים אותו בשלב מאד מוקדם בעולם של פיתוח וורדפרס. במקרה זה אנו נצמדים להוק (פעולה) בשם wp_enqueue_scripts בכדי להוסיף נכסים – קבצי Javascript וקבצי CSS בצד לקוח (Frontend) בתבנית הוורדפרס שלכם. זוהי הדרך המועדפת להוסיף נכסים באתרי וורדפרס ונכונה יותר מאשר ״תכנות נוקשה״ הלא הוא hard coding.

זה המקום לציין, אם לא הייתי ברור – ניתן להצמיד כמה פונקציות שתרצו לאותו הוק!

הוספת מספר העמוד בכותרת המטא הנוצרת על ידי Yoast SEO

כפי שהזכרנו בתחילת המאמר, תוספים רבים מספקים לנו הוקים על מנת לבצע מודיפיקציה לפונקציונליות שלהם.

function change_yoast_title($title) {
   $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
   if ( is_paged() ) {
      return $title . ' - Page ' . $paged;
   }
   else {
      // first page of pagination
      return $title;
    }
}
add_filter('wpseo_title','change_yoast_title');

במקרה אמיתי זה, איש הקידום של אחת החברות להן אני מספק שירות, ביקש להוסיף בעמודים הממוספרים (paginated pages) של האתר את המילה Page ומספר העמוד בסופה של כותרת המטא (meta title) באותם עמודים.

לדוגמה, בעמוד שלוש יופיע Page 3 בסוף כותרת המטא וכנ״ל לגבי הכותרות בשאר העמודים הממוספרים, כל זאת כאשר בעמוד מספר אחד שינוי זה לא יתבצע. מכיוון ובמקרה של אותו אתר ספציפי כותרת המטא נוצרה באמצעות התוסף WordPress SEO by Yoast, נכון היה לחפש פילטר של Yoast המאפשר לבצע מודיפיקציה לכותרת העמוד.

חיפוש זריז הוביל להוק (פילטר) בשם wpseo_title המקבל כערך את כותרת העמוד ומחזיר את הכותרת לאחר השינוי שביצעתם. יצרנו פונקציה בשם change_yoast_title בה אנו בודקים האם העמוד ממוספר או לא, ובמידה וכן תוסיף את הטקסט המבוקש בסוף הכותרת.

הסרת כתובות קנוניות מעמודי תוצאות החיפוש באתר שלכם

פעולה שמקדמי אתרים יאהבו סביר להניח. בהנחה ואתם משתמשים ב Yoast SEO הפילטר הבא יסיר את ה canonical url מעמודי תוצאות החיפוש של וורדפרס:

function yoast_remove_canonical_search( $canonical ) {
	if( is_search() ) {
		return false;
	} else {
		return $canonical;
	}
}
add_filter('wpseo_canonical', 'yoast_remove_canonical_search');

יצירת הוקים (משלכם)

על מנת להשתמש בפונקציונליות של הוקים ליצירת הוקים משלכם, אינכם צריכים ליצור פונקציות מיוחדות – אתם יכולים להשתמש באותה פונקציה בה וורדפרס משתמשת בשם do_action.

הגדירו את ההוק שלכם

הוסיפו את הקוד הבא לקובץ functions.php (או לתוסף שלכם):

function custom_hook() {
   do_action('custom_hook');
}

הקוד המופיע מעלה יוסיף פעולה בשם custom_hook לספריית ההוקים של וורדפרס ויאפשר לכם להשתמש בו בכל מקום שתרצו בתבנית שלכם. כמובן, שעליכם לקרוא להוק בשם הגיוני יותר המתאר את הפונקציה המתבצעת.

הוסיפו את הקריאה לפונקציה

הוסיפו את הקריאה לפונקציה היכן שתרצו בתבנית שלכם:

<?php custom_hook(); ?>

עם שני סניפטים אלו, התבנית שלכם מצויידת בהוק חדש שדרכו אתם יכול להריץ כל פונקציה שחשקה נפשכם באמצעות הפונקציה add_action עליה הסברנו קודם לכן. כעת נשאר רק להוסיף את הפונקציה שמבצעת פעולה כלשהי.

הוסיפו את הפונקציה עצמה

בכדי לשמור על פשטות, נשתמש בפונקציה מאד בסיסית בכדי להדגים שלב זה. הוסיפו את הקוד הבא בקובץ functions.php:

function hello_wordpress() {
   echo '<h1>שלום וורדפרס</h1>';
}
add_action('custom_hook', 'hello_wordpress');

הפונקציה תדפיס ״שלום וורדפרס״ בדיוק במיקום בתבנית בו הוספתם את הקריאה לפונקציה בשלב הקודם. כעת בכדי להבין את הכח של הוקים – שנו את המיקום של הקריאה לפונקציה למיקום אחר בתבנית ותגלו כי ״שלום וורדפרס״ תודפס במיקום החדש.

אז מה למדנו?

אני מקווה שלמדנו עבור מה משמשים הוקים, פעולות ופילטרים בוורדפרס ואת הבסיס של כיצד הם עובדים.  וורדפרס משתמשת בפעולות ופילטרים על מנת להרחיב את היכולות שלה – מדוגמאות פשוטות כפי שהצגנו ועד לתוספים מורכבים במיוחד כגון ווקומרס.

אם אהבתם את המדריך הרגישו חופשי לשתף ולספר מחשבות בתגובות מטה…  🙂

רועי יוסף
רועי יוסף

מפתח וורדפרס, מאמין ביצירת הזדמנויות לעסקים קטנים, סטארטאפים נועזים ואנשים עצמאים לשנות את העולם. אוהב טיפוגרפיה, צבעים וכל מה שבינהם ומכוון לספק אתרי וורדפרס עם ביצועים גבוהים, תמיכה בכל הדפדפנים, בעלי קוד ולידי, סמנטי ונקי. צרו איתי קשר.

{ 4 תגובות… הוסף אחת }
  • לאה כהן 31 בינואר 2018, 8:51

    כרגיל, הסבר יפה ודוגמאות מועילות. ישר כח! וכרגיל, יש לי מה להוסיף 😉 :

    הראית בדוגמה של wp_enqueue_scripts שאפשר להצמיד כמה פונקציות שרוצים לכל hook, אבל לא כתבת את זה במפורש אז נראה לי שזה לא מודגש מספיק: אפשר להצמיד כמה פונקציות שרוצים לכל hook! 🙂 . פעם נשאלה שאלה כזאת ב-WPSE, ואחת התשובות הייתה משעשעת במיוחד: Hook-ים של וורדפרס הם כמו הוליווד: אתה לא קורא להם, הם קוראים לך (באנגלית זה נשמע יותר טוב…). אבל בניגוד להוליווד, הם קוראים לכל מי שברשימה.

    ועוד דבר: הראית איך ליצור action (עם do_action) אבל לא הראית איך ליצור פילטר (עם apply_filter). למה?

    ודבר אחרון: הפוסט שלך הזכיר לי מאמר מאד מעניין על דרכים שונות לכתוב תוסף שמאפשר לתבנית להרחיב אותו. מובן שהמאמר מציין יצירת action-ים ופילטרים בתור אחת הדרכים לעשות זאת, ויש שם דוגמאות חביבות.

    ולהשומע ינעם. תודה על עוד פוסט מעניין ומועיל.

    • רועי יוסף 31 בינואר 2018, 16:14

      היי לאה!

      תודה על התגובה ועל הרעיונות. הוספתי משפט האומר כי אפשר להצמיד כמה פונקציות שרוצים לכל hook…

      את צודקת, לא הסברתי לגבי יצירת פילטרים – מבטיח להוסיף בהמשך.. אם שמת לב או לא, אני מעדכן פוסטים באתר על בסיס קבוע בכדי לשפר אותם וכך יקרה גם עם פוסט זה..

      תודה שוב 🙂

  • רון 31 בינואר 2018, 19:30

    היי, אני מתכנת פרונט כבר כמה שנים, ורציתי להתחיל לעבוד עם וורדפרס. מה רמת הידע שצריך לדעת בphp על מנת לעשות דברים מורכבים משלך באתר שכן יש לי ידע בסיסי בphp וידע רחב ב js. אשמח אם תשלח קישור למקום שממנו ניתן ללמוד php מוכוון וורדפרס.

    • רועי יוסף 31 בינואר 2018, 19:35

      היי רון 🙂

      אני חושב שהלימוד הכי טוב הוא ניסוי וטעייה. אם יש לך ידע בסיסי ב PHP ואתה מגיע מעולם הפיתוח, עקומת הלמידה שלך לא תהיה תלולה מדי. תרים לעצמך סביבה לוקלית, קח אתר לבחירתך, ונסה לבנות אותו בעצמך (בתבנית שאתה יוצר מאפס).

      לא תמצא שיעור או קורס טוב מזה… בהצלחה!

השאירו תגובה

פעימות
Up!
הוספת פירורי לחם (Breadcrumbs) באתרי וורדפרס
הוספת פירורי לחם באתרי וורדפרס (Breadcrumbs)

פירורי לחם, או בשפה במקצועית Breadcrumbs הם מערכת לניווט משני באתר וורדפרס. המערכת מראה למשתמש...