| התמיכה בבוקסות היא משהו שדווקא אינו מובנה בתוך וורדפרס ודווקא מצריך עבודה ניכרת. רמת הבוקסות יכולה לנוע מטמפלטים בסיסיים ביותר (מסגרת מסביב לפוסט למשל, או שני פוסטים אחד לצד השני) ויכולים להסתיים בטמפלטים מורכבים כפי שניתן לראות בשלל אתרי האינטרנט. ההגבלה היחידה למורכבות היא הנכונות של היוצר לשבת ולקודד את הפונקציות הרלוונטיות.
* הערה: ברוורדפרס מתייחסים לטמפלט כאל כל ה"סקין" או הערכת עיצוב, אני די רגיל לכנות במילה טמפלט דווקא את אותן הבוקסות שמוצבות בתוך העמודים באתרים. זה יצר פה התנגשויות קלות בזמן הכתיבה, ברוב המקומות כתבתי טמפלטים מתוך הרגל, אבל הכוונה היא ל"בוקסות תוכן".
לצורך יצירת הטמפלטים נצטרך לעדכן גם את קובץ העיצוב (style.css) וגם ליצור את הטמפלטים. במצב הטבעי, וורדפרס מציגה את כל הפוסטים בתוך ה loop כאשר היא קוראת להם אחד אחרי השני ומציגה אותם לפי הסדר – כל אחד כפוסט בפני עצמו. הדרך הפשוטה היא לערוך את השורות בתוך ה loop עצמו ולהחיל ידנית את העיצוב.
הטמפלט הבסיסי – תיבה מסביב לפוסט.
בטמפלט הזה, אין שום שינוי חוץ מכך שמסביב לפוסט תופיע תיבה. לצורך כך, נוסיף בקובץ העיצוב את השורות הבאות:
-
.buxa{
-
float: right;
-
margin: 5px ;
-
padding: 0 5px;
-
width: 100%;
-
border: 1px solid green;
-
background: #eeeeee;
-
}
על מנת להחיל את העיצוב הלז על פוסט, עלינו לקרוא לו בכך שנעטוף את הפוסט בתגיות המתאימות:
-
<div class="buxa">
-
The Post
-
</div>
התוצאה – כל פוסט יוקף בתיבה אפורה בעלת מסגרת ירוקה ברוחב של 100% מהעמודה. היתרון בשימוש באחוזים, מתבטא בקלות ההתאמה של טמפלטים בין ערכות עיצוב. בין אם מדובר בעמודה ברוחב של 450 פיקסלים או של 600 - אין צורך לבצע התאמה נוספת.
הטמפלט הבסיסי – שלישיות.
הטמפלט הבסיסי הוא אומנם אפשרי, אבל אין בו כל ייחוד והוא לא שונה למעשה ממה שניתן לעשות באמצעות עיצוב של תג ה post בתוך ה css. הדוגמא הבאה, תדגים מבנה של שלישיות בהן הלופ אוסף 3 פוסטים ומציג אותם בשורה אחת. לאחר מכן הוא יורד שורה ופותח שורת שלישיות חדשה.
-
.tripel {
-
float: right;
-
margin: 5px 5px 0px 0 ;
-
padding: 0 2px ;
-
width: 30%;
-
height: 200px;
-
border: 1px solid green;
-
background: #eeeeee;
-
}
בדומה לטמפלט הבסיסי, גם כאן נעטוף את הקריאה לפוסט בתגיות המתאימות:
-
<div class=”tripel”>
-
the post
-
</div>
והתוצאה – שורה המכילה שלושה פוסטים, כל פוסט בתוך תיבה אפורה מוקפת במסגרת ירוקה עם ריווח של 5 פיקסלים בין תיבה לתיבה ובין שורה לשורה.
* הערה לסיום: יש לי כבר ערכת עיצוב מוכנה למדי לדמו, קיוויתי להעלות את הבלוג הדגמה כבר היום אבל בגלל פערי עדכון של שרתי DNS ושאר מרעין בישין - זה עדיין לא מוכן ויעלה ככל הנראה רק מחר. אני מזהיר מראש שזה נראה מכוער לחלוטין, בחרתי שם צבעים מזעזעים רק כי זה מקל על העבודה ועל ההסברים בקבצים וגם הניראות הרבה יותר בולטת. כאמור - בתקווה שמחר.
Popularity: 11% [?]
נכתב ע"י
עידכונים ב RSS
שלח לשווה קריאה
Stumble it
Digg it
Deli.icio.us
Technorati
בטעינה ...
מריץ FireStats
אהבתי מאוד את הרעיון של הפוסטים בשלשות אבל לא הבנתי איך אני משנה את זה בקובץ סטייל הקיים אצלי.. האם צריך למחוק שורה מסויימת ולכתוב את מה שציינת או פשוט להוסיף ואיפה ?
אשמח מאוד לקבל ממך תשובה
האתר שלי
http://www.freaks.co.il
תודה מראש
[תגובה]
אתה פשוט צריך להדביק בסוף קובץ ה style.css שלך את הקטע הרלוונטי ולקרוא לו כמודגם.
[תגובה]
אני מקווה שאני לא חוצפן מידי.. אבל זה קובץ הסטייל והוספתי בסוף את מה שציינת לעיל ואין שום שינוי:
.tripel {
float: right;
margin: 5px 5px 0px 0 ;
padding: 0 2px ;
width: 30%;
height: 200px;
border: 1px solid green;
background: #eeeeee;
}
the post
[תגובה]
הכיתוב the post הוא לא חלק מקובץ העיצוב, הוא סתם טקסט שכתבתי בשביל להמחיש איפה נכנס הפוסט.
אני לא יודע עם איזה עיצוב אתה עובד אבל בטח יש שם עמוד שנקרא archive.php, ערוך אותו ותקיף את הקריאה לפוסטים בDIV המתאים. אחר כך, כנס לדף ארכיון ותראה את התוצאה
[תגובה]
ניצן אני כנראה אדיוט מידי בשביל להבין את זה, זה תוכן קובץ הארשיב..אם תוכל להראות לי מה טוב אם לא … תודה בכל מקרה אני אוהב את האתר שלך:
ארכיון חודשים:
ארכיון נושאים:
[תגובה]
היי יחיאל, אני לא רואה את הקובץ, בכל מקרה, אתה מוזמן לשלוח לי את התוכן שלו במייל ואני אנסה לעזור משם. בראש העמוד יש קישור "צור קשר"
[תגובה]