יצירת תפריט עם HTML משלכם בוורדפרס

כך תשלטו שליטה מלאה על התפריט שלכם ותוכלו לשלב בו קריאה ל-Custom fields

רן בר-זיק
אפריל 6, 2014
קטגוריה: פתרונות ומאמרים על פיתוח אינטרנט
תגיות: וורדפרס
אין תגובות

יוצא לי לא מעט לעבוד עם וורדפרס שמשתבחת מגרסה לגרסה (חוץ מזה שהיא כתובה ב-PHP והספגטי כמו באיטליה!). אחד מהתוספים שאני הכי אוהב לעבוד איתם הוא התוסף Advanced custom field שהופך את כל ההגדרה והממשקולוגיה של custom fields שאפשר להצמיד לדפים ולפוסטים לממש ממש קל. אני בדרך כלל משתמש ב-custom fields באופן די מקיף באתר ואפילו משתמש בפונקציה גנרית עם static caching כדי לקרוא לערכים שאני רוצה בלי להעיק יותר מדי על מסד הנתונים. הנה דוגמה לפונקציה כזו שקוראת לתמונה שמוגדרת כ-custom field:


function get_image_type($id = NULL, $image_custom_name) {
    if($id == NULL) {
        $id = get_the_ID();
    }
    static $result = array();
    if(isset($result[$image_custom_name][$id]))
        return $result[$id];
    $icon_meta = get_post_meta($id, $image_custom_name);
    $result[$image_custom_name][$id] = wp_get_attachment_image($icon_meta[0]);

    return $result[$image_custom_name][$id];
}

ואפשר כמובן לשחק עם זה עוד ועוד.

אחד הדברים שמעצבים אוהבים לעשות זה להצמיד כל מיני אייקונים קטנים לתפריטים. במקום להגדיר את האייקונים ב-CSS וכך לשנות את הקוד בכל פעם שלמעצב מתחשק לשנות איזה אייקון ארור, אני מאוד אוהב להגדיר לדפים/פוסטים שיש בתפריט custom field בתור תמונה ואז הלקוח צריך להגדיר את התמונה במקום שאני אתעסק איתה. מה הבעיה? הבעיה היא שליצור walker לכל תפריט כדי להדפיס את התמונה הקטנה מאוד מאוד מבאס. למה? כי אני נורא שונא לערבב OO עם פרוצדורלי וזה מטריף אותי הברדק הזה. לא רוצה להשתמש ב-Walker אם אני יכול להמנע מזה. חוץ מזה, עבור רוב הדברים שאני צריך זה די להשמיד יתוש עם תותח.
איך פתרתי את זה? באמצעות פונקציה קטנה שבונה את התפריט מאפס ומאפשרת לי שליטה מלאה על ה-HTML שלו – כולל גישה ל-ID של כל פריט בתפריט (ה-ID האמיתי, לא ה-ID של התפריט).

איך זה נראה? ממש ממש כך:


function internet_il_get_my_menu($menu_name) {
    $current_id = get_the_ID();
    if (($locations = get_nav_menu_locations()) && isset($locations[$menu_name])) {
        $menu = wp_get_nav_menu_object($locations[$menu_name]);
        $menu_items = wp_get_nav_menu_items($menu->term_id);

        $menu_list = "\n";
        $menu_list .= "\n";
        foreach ($menu_items as $key => $menu_item) {
            $title = $menu_item->title;
            $url = $menu_item->url;
            if($current_id == $menu_item->object_id) {
                $current_class = "current";
            } else {
                $current_class = '';
            }
            $menu_list .= "$title\n";
        }
        $menu_list .= "\n";
        $menu_list .= "\n";
    } 
    return $menu_list;
}

באופן עקרוני אין כאן גליק גדול ובסופו של דבר מדובר בקוד מבחיל אך שימושי למדי שמייצר HTML מאובייקט באופן לא אלגנטי אבל מאוד לעניין. מה שחשוב הוא שאני יכול בכל שלב להשתמש ב $menu_item->object_id על מנת לעשות קריאה לפונקציה כמו הפונקציה הראשונה על מנת לקבל את נתוני ה-custom field ולהשתמש בהם בתפריט. בין אם מדובר באייקון או בין אם מדובר במשהו אחר. מאוד מאוד שימושי לתפריטי 'מומלצים' או תפריטים של 'מוצרים נבחרים' ושאר הג'אז הזה.