ערכת צבעים מותאמת אישית לממשק הניהול
בגרסה 2.5 של וורדפרס התווסף מאפיין נחמד שמאפשר לנו לבצע התאמה אישית של ערכת הצבעים בממשק הניהול. בצורה זו יכולים המשתמשים להתאים את המראה של ממשק הניהול מתוך תפריט "פרופיל המשתמש" לפי רצונם. ישנם 2 עיצובים קיימים במערכת אך ניתן להוסיף עיצובים נוספים, והיום נלמד איך עושים זאת.
ערכות הצבעים הבסיסיות בממשק הניהול
הוספת ערכת עיצוב
הוספת ערכת צבעים חדשה מתאפשרת בעזרת הפונקציה wp_admin_css_color(), להלן הרכב הפונקציה:
ארבע פרמטרים לפונקציה. הפרמטר הראשון הוא המפתח של ערכת הצבעים (שם כללי), הפרמטר הבא השם שיוצג בעמוד פרופיל המשתמש (כחול/אפור), הפרמטר שלישי מציין את המיקום של קובץ ה-CSS והפרמטר הרביעי מגדיר את הצבעים שיוצגו לצד השם בעמוד פרופיל המשתמש.
יצרתי ערך לפונקציה בקודקס של וורדפרס, כדי שתוכלו לקבל מידע נוסף.
תוסף לשינוי ערכת הצבעים
הכנתי תוסף שמוסיף ערכת עיצוב מותאמת אישית לממשק הניהול של וורדפרס. ניתן לשנות אותו ולהתאים לצרכים שלהם.
/*
Plugin Name: Custom Admin Color Scheme
Plugin URI: http://www.wp-tricks.co.il/ערכת-צבעים-מותאמת-אישית-לממשק-הניהול/
Description: Add a custom admin color scheme to your wordpress profile
Version: 1.0
Author: Rami
Author URI: http://www.wp-tricks.co.il/
*/
function custom_admin_color_scheme() {
$plugin_url = get_option('siteurl') . '/wp-content/plugins/' . plugin_basename(dirname(__FILE__)) ;
wp_admin_css_color(
'bdihot',
__('bdihot.co.il'),
$plugin_url . '/custom_admin_color_scheme.css',
array('#9DC45A','#FFD34D','#FE984E','#71A1EB')
);
}
add_action('admin_init','custom_admin_color_scheme');
?>
הסברים נוספים
בוורדפרס קיימות שתי ערכות הצבעים מובנות, עיצוב "קלאסי" (כחול) ועיצוב "רענן" (אפור). העיצובים מוגדרים כברירת מחדל בעזרת הפונקציה register_admin_color_schemes() והם מוגדרים בקבצים הבאים:
- כחול – wp-admin/css/colors-classic.css
- אפור – wp-admin/css/colors-fresh.css
כשיוצרים עיצוב מותאם אישית יש ליצור קובץ CSS חדש המכיל את כל האלמנטים הרצויים. אבל אנחנו נרצה לקצר את התהליך כדי להקל על העבודה. נעשה זאת בעזרת יבוא של עיצוב קיים ונוסיף לו שינויים במקומות מסוימים (למשל שינוי צבע רקע, שינוי צבע כותרות וצבעי טקסטים).
כדי לעשות זאת, בקובץ ה-CSS שלנו אנו נייבא תחילה את את העיצובים ואז נוסיף את השינויים, להלן דוגמא:
html, body, .wrap {
background:#FFFFFF;
}
.form-table td, .form-table th {
border-bottom-color:#FFFFFF;
}
#wphead, #footer, #footer-upgrade {
background:#71A1EB;
color:#FE984E;
border:0;
}
#wphead a:link, #wphead a:visited, #wphead p, #footer a:link, #footer a:visited, #footer p {
color:#FE984E;
}
סיכום
התוצאה של כל הסיפור הזה היא:
ערכות צבעים מותאמת אישית בממשק הניהול
להורדת התוסף המלא לחץ כאן.
אז מה עשינו פה? יצרנו תוסף עם שני קבצים, הקובץ הראשון מכיל את הקוד שמוסיף ערכת עיצוב נוספת לממשק הניהול והקובץ השני הוא קובץ CSS בו השינויים שאנו רוצים להכניס לעיצוב של ממשק הניהול. אתם יכולים לערוך את התוסף ולהתאים אותו לצרכים שלכם.
נ.ב: כמו שציינתי למעלה, תוך כדי כתיבת הפוסט יצרתי בקודקס של וורדפרס ערכים לשתי הפונקציות שהזכרתי, אני ממליץ להיכנס לקישורים האלה כדי לקבל מידע נוסף.
באותו נושא
- שינוי עיצובים בעורך הויזואלי של וורדפרס
- לשנות טקסט של הפוטר במערכת הניהול
- לוגו מותאם אישית במערכת הניהול
איך אני משנה את הערכת העיצוב לממשק הניהול שהכנתי לברירת המחדל של האתר ?
שאלה יפה, התשובה היא שאינני יודע, לא חקרתי את הנושא. במאמר זה ניסיתי להסביר איך להוסיף ערכה חדשה, ואז למשתמש יש אפשרות לבחור. אבל אני אבדוק את הנושא כשיהיה לי קצת יותר זמן ואפרסם על זה פוסט.
הוסף תגובה !
להיכנס
ברוכים הבאים
ניווט באתר
תפריט נושאים
ראו גם
פוסטים אחרונים
פרסומת