איך מוסיפים CSS לADMIN בוורדפרס דרך קובץ functions.php?

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

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

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

*** שימו לב!!! אם אתם לא מתמצאים בPHP, קחו בעל מקצוע שיעשה בשבילכם את העבודה, מה שאני הולך להראות כאן יכול להפיל לכם את האתר עם התו הלא נכון! ***

 

קודם כל, למה בכלל שנרצה לעשות שינויי CSS בחלק של הAdmin בוורדפרס?

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

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

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

אנחנו יודעים שאנחנו רוצים להכניס למשל שינוי CSS שיפעל על החלק של הAdmin ואנחנו רוצים להכניס אותו דרך הקובץ functions.php ושיפעל רק על תפקיד משתמש מסוים ולא על כולם.

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

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

בנוסף אנחנו נבחר (שרירותית) את שם הפונקציה שלנו.

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

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

במקרה הנוכחי בחרתי בשם הפונקציה "change_things_from_admin" והגדרתי פונקציה בשם הזה.

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

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

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

אנחנו נעביר את המערך למשתנה שלנו כדי שנוכל לעבוד איתו בקלות.

				
					$user = wp_get_current_user();
				
			

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

כעת המשתנה מכיל את כל פרטי המשתמש במה שנקרא name value pair – משתנה שהגישה אליו היא דרך שם מסוים, במקרה שלנו roles ונבדוק אם הערך (value) שווה לתפקיד המשתמש שכתבנו בבדיקה.

				
					in_array( 'administrator', (array) $user->roles )
				
			

המתודה in_array מקבלת שני פרמטרים, הראשון זה הפרמטר לחיפוש, השני זה הפרמטר לחיפוש (המיקום), במקרה שלנו בתוך המערך $user לפי השם (name) שהוא roles.

מבצעים תנאי IF על תפקיד המשתמש שלנו, במידה והתשובה של התנאי היא 1 (true), הקוד שנמצא בתוך התנאי יתקיים, כלומר העיצוב CSS שמוגדר בתוך התנאי יופעל.

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

ואיך אנחנו מחברים את הכל ביחד?

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

				
					<?php
add_action('admin_head', 'change_things_from_admin');
function change_things_from_admin() {
$user = wp_get_current_user();
if ( in_array( 'administrator', (array) $user->;roles ) ) {
  ?>

<style>
    #adminmenu #menu-posts > a {
        color:yellow;
        font-weight:bold;
    }
</style>

<?php
    }
}
?>
				
			

וזאת התוצאה הסופית שלנו:

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

 

באותה דרך ניתן גם להכניס סניפטים של JavaScript, PHP ועוד…

באיזה מקרה אתם הייתם משתמשים בקוד וכדי לעשות מה?

ניתן להגיב בסוף העמוד.

שיתוף

קבלו הצעת מחיר משתלמת: