רשימת קישורים מופרדת בפסיקים

לוורדפרס יש פונקציה מובנית שמאפשרת לקבל רשימת קישורים ממשק הקישורים של המערכת.
הדבר היחיד שלא הצלחתי עד כה לעשות בעזרתה בקלות הוא רשימות המופרדות ב-פסיקים\נקודות\מקפים\משהו…

יש פתרון
הקוד לרשימת הקישורים הוא:

1
2
3
4
5
6
7
</p>
<div class="links">
<ul>
        < ? wp_list_bookmarks("title_li=&category=2"); ?>
    </ul>
</div>
<p>

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

הקוד שנקבל כתוצאה מהפונקציה הוא:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
</p>
<div class="links">
<ul>
<li><a href="http://art-blog.no-ip.info/newpress/blog/">ארתיום טונקיך</a></li>
<li><a href="http://www.dakars.info/">חנית כהן</a></li>
<li><a href="http://firefang.net/blog/">עמרי ידן</a></li>
<li><a href="http://tzafrir.net/">צפריר ריהן</a></li>
<li><a href="http://ranh.co.il/">רן יניב הרטשטיין</a></li>
<li><a href="http://blog.shemesh.biz/">שחר שמש</a></li>
<li><a href="http://www.my-paradox.net/">שרית עמר</a></li>
<li><a href="http://www.dontsmile.info">תום סלע</a></li>
</ul>
</div>
<p>

עכשיו נותר רק להוסיף את העיצוב (כן, כאן יתווספו לנו הפסיקים):

1
2
3
4
5
6
7
8
9
.links ul {
    list-style: none;
    margin: 0 0 1.5em 0;
    padding: 0;
}
.links ul li { display: inline; }
.links ul li:after { content: " , "; }
.links ul li:last-child:after { content: ""; }
.links a {color:#fff; font-size:13px; font-weight: normal;}

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

1
2
3
4
5
6
<div class="links">
    <ul>
        <li class="first"><a href="<?bloginfo('url');?>">דף הבית</a></li>
        < ? wp_list_bookmarks("title_li=&#038;category=2"); ?>
    </ul>
</div>

סימנו את האיבר הראשון בצורה יחודית ולכן ה-css ייראה כך:

1
2
3
4
5
6
7
8
.links ul {
    list-style: none;
    margin: 0 0 1.5em 0;
    padding: 0;
}
.links ul li { display: inline; border-right: 1px solid #f5f5f5;}
.links ul li.first { border-right: none;}
.links a {color:#fff; font-size:13px; font-weight: normal;}

הפתרון האחרון הוא תוכנתי:
נוסיף לקובץ functions.php את הפונקציה הבאה:

1
2
3
4
5
6
7
8
9
10
11
function mylinks($args, $sep) {
    $links=get_bookmarks($args);
    $first = true;
    foreach ($links as $link) {
        if ($first)
            $first=false;        
        else
            echo $sep;
        echo "<li><a href='".$link->link_url."'>".$link->link_name."</a></li>\n";
    }
}

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

1
2
3
4
5
<div class="links">
    <ul>
        < ? mylinks("category=2", ","); ?>
    </ul>
</div>

והעיצוב ייראה כך:

1
2
3
4
5
6
7
.links ul {
    list-style: none;
    margin: 0 0 1.5em 0;
    padding: 0;
}
.links ul li { display: inline;}
.links a {color:#fff; font-size:13px; font-weight: normal;}

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

פילטרים בוורדפרס – קוד שימושי

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

כיווניות תגובות

הקוד הבא יכול לשמש ליישור התגובה לימין או לשמאל כתלות בשפה בה נכתבה

1
2
3
4
5
6
7
8
9
10
11
12
/* Comments directionality filter */
add_filter('comment_text', 'lang_dir');

function lang_dir($content) {
    $eng = preg_match_all('/[a-zA-Z].?/', $content, $matches);
    $heb = preg_match_all('/[א-תץףךםן].?/', $content, $matches);
    if ($eng > $heb) {
        return "&lt;div class='lcomment'>&lt;p>$content &;lt;/p>&lt;/div>";
    } else {
        return "&lt;div class='rcomment'>&lt;p>$content&lt;/p>&lt;/div>";
    }
}

כמובן שצריך להוסיף גם את קוד ה-css הבא:

1
2
3
4
5
6
7
8
.lcomment {
    direction: ltr;
    text-aliggn: left;
}
.rcomment {
    direction: rtl;
    text-align: right;
}

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

מחליף שפות

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
/* Language 'plugin' for the theme */
function ShowHideJs() {
?>
&lt;script>
function setElementVisibility(eShow, eHide){
    document.getElementById(eShow).style.visibility = "visible";
    document.getElementById(eShow).style.display = "block";
    document.getElementById(eHide).style.visibility = "hidden";
    document.getElementById(eHide).style.display = "none";
}

function ShowHeb(){
    setElementVisibility("heb", "eng");
}

function ShowEng(){
    setElementVisibility("eng", "heb");
}
&lt;/script>
&lt;?
}

function add_buttons($content) {
    if ((strstr($content, "[heb]") !== false) && (strstr($content, "[eng]") !== false)) {
                $hebbtn = get_bloginfo('template_url')."/img/hBtn";
                $engbtn = get_bloginfo('template_url')."/img/eBtn";
        $buttons .= "&lt;img src='".$engbtn.".png'  onMouseover='this.src=\"".$engbtn."_Hover.png\"' onMouseout='this.src=\"".$engbtn.".png\"' onClick='ShowEng()' />\n";
        $buttons .= "&lt;img src='".$hebbtn.".png'  onMouseover='this.src=\"".$hebbtn."_Hover.png\"' onMouseout='this.src=\"".$hebbtn.".png\"' onClick='ShowHeb()' />\n";
        return "&lt;div id='lang'>".$buttons."".$content;
    }
    return $content;
}

function heb($content) {
    return str_replace ("[/heb]", "&lt;/div>",
        str_replace("[heb]", "&lt;div id='heb' name='heb' style='visibility:display;'>", $content));
}

function eng($content) {
    return str_replace ("[/eng]", "&lt;/div>",
        str_replace("[eng]", "&lt;div id='eng' style='visibility:hidden; display:none;'>", $content));
}

add_filter('wp_head', 'ShowHideJs');
add_filter('the_content', 'add_buttons');
add_filter('the_content', 'eng');
add_filter('the_content', 'heb');

שימו לב שהקוד למעלה משתמש במספר פילטרים שונים:

  1. פילטר JS שיושב בהדר של העמוד
  2. פילטר שמוסיף את כפתורי השפה
  3. פילטר אנגלית, פילטר עברית

את השנים האחרונים היה נניתן כמובן לשלב לפילטר יחיד, אבל אני החלטתי שזה יותר יפה כך :-)

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

ויש עוד לא מעט כאלו :-)

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

פילטרים בוורדפרס

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

מהם פילטרים בוורדפרס ?

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

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

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

אז למה אני צריך פילטרים בוורדפרס?

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

למשל: בואו נניח שאנחנו רוצים להכניס תוכן מוסכם (למשל תמונה או קוד HTML) במקום בו המשתמש יבקש זאת.

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

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

ואיך עושים את זה ?

פונקציית ההחלפה היא קלה למימוש

1
2
3
function insert_sig($data) {
    str_replace("{sig}", "<img src='myimage-url.jpg' alt='mysig' />");
}

עכשיו צריך להגיד לוורדפרס להפעיל את הפונקציה הזו על התוכן לפני שיוצג לקורא:

1
add_filter('the_content', 'insert_sig');

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

דוגמאות לעוד שימושים:

  • יישור תגובות לימין\שמאל
  • החלפת מילים באחרות\צנזור מילים
  • יצירת קישורים אוטומטיים
  • פיתוח תוספים לוורדפרס

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

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

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