כיצד להוסיף תמונות ממוזערות וורדפרס קטגוריות & תגיות

לפעמים אתר וורדפרס ייראה הרבה יותר נחמד אם הצלחנו להציג תמונה ליד קטגוריות או תגים. לדוגמה, אנו יכולים להוסיף תמונה על CSS ב “CSS” הקטגוריה או הלוגו של HTML5 “HTML” (כמוצג להלן).

חזרה גרסה 2.9, וורדפרס הוסיף את היכולת הוסף תמונה ממוזערת (מאוחר יותר שמם תמונה מצורפת) עבור פוסט, דף וכן סוג פוסט מותאם אישית. התכונה 'תמונה ממוזערת' זו אינה מכסה את הקטגוריה, התגים והטקסטונומיה המותאמת אישית, אפילו בגרסאות מאוחרות יותר (למעט טקסונומיה מותאמת אישית, אולי ב- WordPress 4.4).

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

מתחילים

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

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

התמונה תוצג ב קטגוריה טבלה, ומאפשר לך לראות איזו קטגוריה יש קטגוריה המצורפת.

תגי התבניות

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

• get_term_thumbnail_id ($ term_taxonomy_id): כדי לקבל את המונח טקסונומיה המונח מזהה.
• has_term_thumbnail ($ term_taxonomy_id): כדי לבדוק אם המונח טקסונומיה יש תמונה ממוזערת או לא.
• get_term_thumbnail ($ term_taxonomy_id, $ size = 'post-thumbnail', $ attr = ” ): כדי לחזור לתמונה ממוזערת של טקסונומיה.

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

כיצד להציג תמונות ממוזערות

קבל רשימת תנאים

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

  ',' include '=' ASC ',' hide_empty '=> true,' exclude '=> array (),' exclude_tree '=> array (),' include '=> array (),' number ' = '', '' all ',' slug '=>', 'parent' = '', 'היררכי' => true, 'child_of' => 0, 'childless' => false, 'get '=' ',', ',', ',', ',' cache_domain '=>' core ',) ; $ terms = get_terms ($ taxonomy, $ args); ?> 

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

 '. $ טקסונומיה ':
' הד '
' (במונחים $ $ טווח) echo $ term-> שם;  הד '
' ?> 

התוצאה נראית כך:

כאן יש לנו CSS, HTML, JavaScript, jQuery ו- PHP. צירפנו את התמונה המתאימה (לוגו או סמל) עבור כל אחד מהם מונחים. עכשיו, אנחנו צריכים לדעת איך להציג אותם.

הצגת התמונות הממוזערות

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

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

 אם (!) ריק ($ terms) &&! is_wp_error ($ terms)) echo '
' (במונחים $ $ term) הד '
'  הד '
'  

והתוצאה (לאחר ה- CSS הנוסף) מוצגת להלן:

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

 $ taxonomy = 'category'; $ args = array ('with_thumbnail' => true, // true = אחזור מונחים הכוללים תמונה ממוזערת, false = אחזר את כל המונחים); $ terms = get_terms ($ taxonomy, $ args); 

החל על טקסונומיה אחרת

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