מדריך התאמת תבנית ישנה לוורדפרס 3 – חלק א’

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

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

בוורדפרס 3 עם תבנית תומכת יש לנו אפשרויות לערוך את הרקע, ליצור תפריט מותאם אישית ועוד מגוון רחב של אפשרויות, עליהן תוכלו לקרוא בהרחבה בבלוג אֶקְסְפֶּרִימֶנְט דוֹט אֶפֶס. בין כל האפשרויות החדשות, אני בחרתי להתמקד היום בהתאמת תבנית בלוג ישנה המותאמת לגרסה 2, לעבודה עם האפשרויות החדשות של וורדפרס 3 וכך לחסוך לכם זמן בחיפוש תבנית חדשה במקומה.

נתחיל באפשרות שנקראת “תפריטים”

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

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

תבנית ישנה אשר לא מותאמת לאפשרות של תפריטים. לחץ להגדלה

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

אין אפשרות להוספת תפריט בתבנית לא מותאמת. לחץ להגדלה

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

ראשית ניגש לקבצים של התבנית ונאתר את הקובץ שנקרא functions.php בו נבצע את השינויים שלנו.
1. נוסיף את הקוד הבא:

if (function_exists('wp_nav_menu')) {
add_action( 'init', 'register_my_menus' );
function register_my_menus() {
register_nav_menus(
array(
'Menu-1' => __( 'Menu 1' ),
)
);
}
}
?>

שמרו וסגרו את הקובץ וזהו, מזל טוב כעת התבנית שלכם תומכת בתפריט אחד.
במידה ותרצו שהתבנית שלכם תתמוך ביותר מתפריט אחד עשו זאת כך, שימו לב לתוספת בשורה 7:
if (function_exists('wp_nav_menu')) {
add_action( 'init', 'register_my_menus' );
function register_my_menus() {
register_nav_menus(
array(
'Menu-1' => __( 'Menu 1' ),
'Menu-2' => __( 'Menu 2' ),
)
);
}
}
?>

וכך תראה התבנית בלוח הבקרה כאשר היא תומכת כעת ב 2 תפריטים:

תבנית אשר תומכת בשני תפריטים בו זמנית

על מנת להציג את התפריט החדש שיצרנו נערוך את הקובץ header.php ונוסיף את קטע הקוד הבא במיקום בו נרצה שיוצג התפריט:
<div id="nav">
<?php wp_nav_menu( array( 'theme_location' => 'menu-1' ) ); ?>
</div>

שימו לב שאת הקוד שלנו ב- header.php עטפנו ב- div שקראנו לו nav וזאת על מנת שנוכל לשלוט על העיצוב שלו כמו שצריך בקובץ ה- style.css.

טיפ קטן – עיצבתי את התפריט בדוגמא שיהיה בשורה (ולא בטור) ובצבע רקע + צבע מעבר לפי הקוד הבא. אתם כמובן יכולים לקחת את הקוד ולהחליט לאיזה כיוון אתם רוצים לקחת אותו.
/*--Menu Navigation--*/
#nav{direction: rtl; display: block; background: url(images/navbg.gif) left repeat-x; height: 52px; margin: 0 auto; border-bottom: 1px solid #e6e6e6}
#nav, #nav ul {list-style: none}
#nav li{float: right;list-style:none}
#nav li a {color: #fff; display: block; font-weight: bold; padding: 5px 10px; background: #99AA99;}
#nav li a:hover {color: #000; background: #556655 }

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

בהצלחה!

הפוסט פורסם במקור בבלוג Pintolog

Avatar

מאיר פינטו

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

הגב

הגב ראשון!

avatar
Photo and Image Files
 
 
 
Audio and Video Files
 
 
 
Other File Types
 
 
 

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

wpDiscuz

תגיות לכתבה: