טאבים לחלופת עמודים מבוססת jquery

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

הדבר הראשון שעשינו היה לבדוק את היצע התוספים והספריות הקיימים היום עבור jquery. מהר מאד הגענו לפרוייקט jqueryui שכולל גם את הטיפול בממשק טאבים.

קבצי הג'אווהסקריפט הנדרשים הם:

קוד ה-HTML נראה כך:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<div id="tabs">
    <ul>
        <li>
            <a href="#tabs-1">tab 1</a>
        </li>
        <li>
            <a href="#tabs-2">tab 2</a></li>
        <li>
            <a href="#tabs-3">tab 3</a></li>
    </ul>
    <div id="tabs-1">
        <p>
            Text for tab 1.</p>
    </div>
    <div id="tabs-2">
        <p>
            text for tab 2.</p>
    </div>
    <div id="tabs-3">
        <p>
            text for tab 3.</p>
    </div>
</div>

להמשך בבלוג של קוד-ארט

025 טאבים לחלופת עמודים מבוססת jquery נהניתם ? הרשמו לעדכוני RSS !

תבנית לפוסט יחיד בקטגוריה ספציפית

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

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

ישנן שתי דרכים לעשות זאת:

להכניס תנאי לתוך single.php שבודק האם הפוסט שייך לקטגוריה האמורה, אם כן -להפנות לקובץ א' אחרת לקובץ ב'

1
2
3
4
5
if (in_category('portfolio')) {
include "single-work.php";
} else {
include "single.php";
}

להמשך בבלוג של קוד-ארט

025 תבנית לפוסט יחיד בקטגוריה ספציפית נהניתם ? הרשמו לעדכוני RSS !

שימוש בפונקציה query_posts

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

1
query_posts($query_string."showposts=10");

שימו לב שלפונקציה צריך לקרוא לפני הלולאה.

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

  • showposts - מספר הפוסטים לשליפה עבור הלולאה
  • cat - הצג רק פוסטים מהקטגוריה מספר…
  • category_name – הצג רק פוסטים מהקטגוריה ששמה… (שימושי לתבנית שמיועדת להפצה למספר בלוגים)
  • meta_key,meta_value – מאפשר שליפת פוסטים בעלי ערך מסויים בשדה מיוחד
  • author - פוסטים של מחבר מספר…
  • author_name – פוסטים של מחבר ששמו…

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

כמה קטעי קוד שימושיים:

לתבניות מגזין נשמתש בד"כ במספר לולאות, הראשית תציג featured post ותראה כך:

1
2
3
4
5
6
query_posts("category_name=featured&showposts=1");
if (have_posts()) :
    while(have_posts()) : the_post();
        //do stuff ...
    endwhile;
endif;

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

1
query_posts("cat=7&showposts-1"); //change 7 to your glossary cat #.

את הקוד בתוך הלולאה שנו כך:

1
2
3
4
<div class="single_term">
    <span class='term_name'>< ? the_title(); ?></span>
    <span class="term_data'>< ? the_content(); ?></span>
</div>

אל תשכחו להוסיף תחילית של תבנית

1
2
3
4
5
< ?
/*
 * Template Name: Glossary
 */

?>

עכשיו נותר לדאוג שהפוסטים הללו לא יופיעו בשאר הבלוג.
אפשרות ראשונה:
להשתמש ב-query_posts

1
query_posts($query_string."cat=-7");

צריך להוסיף שורה זו לקובץ index.php
אפשרות שניה וקלה יותר,
להשתמש בתוסף Advance Category Excluder

025 שימוש בפונקציה query posts נהניתם ? הרשמו לעדכוני RSS !