בניית תבנית לוורדפרס

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

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

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

קובץ index.php וקובץ style.css ללא הקבצים הללו וורדפרס לא יקבל את התבנית , המבנה של מרבית התבניות נראה כך –

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

השאר הם תוספות בלבד בעצם , ואפשר להוסיף קבצים נוספים ולטעון אותם.

הבה נתחיל במלאכת בניית תבנית הוורדפרס שלנו !

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

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

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

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

כמובן שעל תבנית וורדפרס להציג גם footer וגם לכך קיימת פונקציה מובנית –

כמובן שבדף זה הפלט שאנחנו אמורים לקבל הוא הכותרת של העמוד + תוכן העמוד בין התגיות שהצבנו אותם.
לאחר שסיימנו לבנות את הקבצים הללו , אנחנו ניגש לעבוד על הקובץ header.php שיכיל למעשה את כל החלק העליון של האתר + התוכן בין תגיות הhead שלנו , למעשה החלק שמכיל את תגיות הmeta ותגיות הtitle שבהם עושים הדפדפנים ומנועי החיפוש שימוש.

נתחיל מהצגת הדוגמה המלאה –

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

באמצעות פונקציה זו אנחנו למעשה קוראים לקידוד של וורדפרס (בדרך כלל בוואב בכלל עושים שימוש בUTF8).

הגדרת פינגבאק.

הכותרת של אתר בלוג וורדפרס.

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

ועכשיו נעבור , לחלק התחתון של האתר לfooter.php –

בfooter למעשה מה שאני רוצה לעשות זה לקרוא לתפריט תחתון , אני רוצה להדגים כאן את הקריאה לתפריט באמצעות הפונקציה wp_nav_menu , למעשה השימוש בפונקציה פשוט יחסית והוא ממש כמו בדוגמה שאתה רואים בקוד שצירפתי כאן למעלה . איך אני קורא לתפריט ובעצם קובע את המיקום של התפריט בקוד.
אבל בזאת המלכה שלנו לא הסתיימה ועלינו גם להגדיר את התפריט בקובץ functions.php –

למעשה הקובץ functions.php מכיל את כל ההגדרות של התבנית , שם אנחנו גם נגדיר מיקום לוידג’טים בתבנית .

למעשה כך הגדרנו , וידג’ט שאנחנו רוצים להציב אותו בדף הראשי לשם כך , נערוך את הקובץ index.php –

לוידג’ט קראנו home_widget ולשם אנחנו יכולים לשפוך טקסטים שלמעשה יופיעו בדף הראשי של הדף.

זהו , למעשה , הצגתי לפניכם את הפונקציות העיקריון לבניית תבנית וורדפרס בסיסית , כמובן , קיימות פונקציות נוספות לבניית תבנית וורדפרס , אך עליהם ניתן לקרוא רבות בדוקומנטציה של וורדרפס –
https://codex.wordpress.org/Theme_Development

ועוד על הפונקציות שעשינו בהם שימוש כיום –
wp_nav_menu (תפריטים) –
https://codex.wordpress.org/Function_Reference/wp_nav_menu
register_sidebar (וידג’טים) –
https://codex.wordpress.org/Function_Reference/register_sidebar

אני אשמח לשמוע הערות בפייסבוק או במייל בטופס יצירת הקשר של האתר.

המון המון בהצלחה!

UP