הוספת כפתורים מותאים אישית לעורך התוכן של וורדפרס

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

המונח המדויק הוא של כפתורי הקיצור שאנו כל כך אוהבים הוא quicktags.
הוספת quicktags מותאם אישית היא פעולה פשוטה מאוד והיא הוספת קוד javascript באמצעות פונקציה שניצור.
את הפונקציה נמקם כמובן בדף functions.php של תבנית הוורדפרס שלנו.
קוד ה-javascript די פשוט:

QTags.addButton( id, display, arg1, arg2, access_key, title, priority, instance );

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

id – שדה חובה מסוג string, ה-html id שהכפתור יקבל.
display – שדה חובה מסוג string, השם של הכפתור (מה שיופיע בעורך התוכן)
arg1 – שדה חובה מסוג string – התג הפותח
arg2 – שדה חובה מסוג string – התג הסוגר
access_key – שדה אופציונלי מסוג string, קיצור דרך לכפתור
title – שדה אופציונלי מסוג string, ערך ה-html title של הכפתור
priority – שדה אופציונלי מסוג int – מיקום הכפתור בעורך, ערך בין 1-9 ימקם את הכפתור במקום הראשון, בין 11-19 במקום השני, בין 21-29 במקום השלישי ונראה לי שהבנתם את ההמשך 🙂
instance – שדה אופציונלי מסוג string, הגבלת הכפתור ל-instance ספציפי של ה-quicktags.

דוגמא:

function add_custom_quicktags() {
?>
    <script type="text/javascript">
    QTags.addButton( 'fullwidthdiv', 'Full width div', '<div class="full_width_div">', '</div>');
    </script>
<?php
}
add_action( 'admin_print_footer_scripts', 'add_custom_quicktags' );

סיימנו, הכפתור שלנו נוסף אל עורך התוכן ולחיצה עליו תפתח לנו div עם class בשם full_width_div, לחיצה נוספת תסגור את ה-div.

בהצלחה!

נהנת ממאמר זה? הירשם לרשימת התפוצה וקבל עדכונים על מאמרים חדשים!


רק רגע! :)
כשאני לא כותב פוסטים ב-CodeBrain אני מספק שרותי פיתוח, ייעוץ והדרכה.
אם נראה לך שאני האיש המתאים עבורך, כדאי שנדבר :)

2 תגובות בנושא “הוספת כפתורים מותאים אישית לעורך התוכן של וורדפרס”

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *