התאמה אישית של תבניות קטעי HTML

דרישות והמטרה של המדריך

אתה זקוק לגישה ל-עורך HTML ול-מנהל הקבצים של CMS bluetronix וגם להרשאות מפתח המתאימות לתיקיית התבניות. במדריך הזה תלמד כיצד להתאים חלקי עמוד קיימים, ליצור תבניות HTML Section משלך ולהציע לעורכים שלך, אם צריך, תבניות מאושרות בלבד.

אנחנו עובדים עם תבניות דוגמה Clients ו-Banner. הקבצים הסטנדרטיים נשארים ללא שינוי; שינויים אישיים נעשים באמצעות הסימון _own.

1. מציאת תבניות קטעי עמודים בעורך

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

בח窗口 חלק עמוד יוצגו התבניות הזמינות עם תצוגה מקדימה. 

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

2. היכן נשמרות התבניות

קבצי התבניות נמצאים בתיקיית המפתח /bx_Layout/. פתח ב-מנהל הקבצים את התיקייה הזו. שם תמצא בין השאר קבצים עבור חלקי עמוד (Section*.txt) ובלוקי טקסט (Tag*.txt).

שם הקובץ קובע את ההקצאה לבחירת התבניות. תבנית חלק עמוד מתחילה תמיד ב-Section; אחריה יש את השם הפרטי שלה. עבור גרסאות משלך, יש להוסיף לפני סיומת הקובץ את התוסף _own.

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

3. מדוע לא כדאי לערוך קבצים סטנדרטיים ישירות

הקבצים הסטנדרטיים שמגיעים עם ה-CMS מתוך /bx_Layout/ יוחלפו בעדכוני מערכת. שינויים ישירות ב-SectionClients.txt או SectionBanner.txt אינם קבועים. העתק את הקובץ הסטנדרטי הרצוי וסמן את הגרסה שלך עם _own. הגרסאות _own המתאימות מיועדות להתאמות האישיות שלך שקיימות לאחר העדכון.

SectionClients.txt
        ↓ kopieren
SectionClients_own.txt

אם קיימים שני הקבצים, ה-CMS ישתמש ב-SectionClients_own.txt המתאימה במקום בתבנית הסטנדרטית SectionClients.txt. אינך צריך לשנות את הקטגוריה Clients בעורך.

אם תיצור קובץ משלך בשם חדש, לדוגמה SectionMyTemplate_own.txt, תבנית הסטנדרטית Clients תישאר גם היא זמינה.

4. מבנה של תבנית קטע HTML: סימון ההפרדה

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

<!--__SP_SectionTemplate__-->

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

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

<!--__SP_SectionTemplate__-->
<Section class="section py-5 py-lg-6">
   <div class="container py-3">
      <div class="row align-items-center g-4">
         <div class="col-lg-8 wow fadeInLeft">
            <span class="badge text-bg-warning mb-3">&#x00AD;New&#x00AD;</span>
            <h2 class="mb-2">&#x00AD;Designed for everyday success&#x00AD;</h2>
            <p class="mb-0">&#x00AD;Explore practical solutions created to make everyday work easier, clearer and more effective.&#x00AD;</p>
         </div>
         <div class="col-lg-4 text-lg-end wow fadeInRight">
            <a href="#"><button class="btn btn-light btn-lg">&#x00AD;Learn more&#x00AD;</button></a>
         </div>
      </div>
   </div>
</Section>
<!--__SP_SectionTemplate__-->

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

לא צריך להוסיף את הכיתה sectionAll בעצמך: עורך ה-bluetronix מוסיף אותה אוטומטית כשהכנסת קטע עמוד.

5. העתקת תבנית לקוחות ושינוי הכותרת

פתח את התבנית הקיימת SectionClients במנהל הקבצים וצפה בקוד ה-HTML שלה. בדוגמה שלנו היא כוללת כותרת, תיאור וכמה מסגרות שותפים.

העתק את התבנית המתאימה כSectionClients_own.txt ופתח את ההעתק דרך עריכה. הוסף לכותרת עבור הבדיקה שלנו את המחרוזת NEW!!!!. אתה יכול גם לשנות את הטקסט, את מספר הלוחות, את הסמלים או את ה-CSS באופן אישי.

<!-- Vorher -->
<h2>&#x00AD;Trusted by growing organizations&#x00AD;</h2>

<!-- Nachher in SectionClients_own.txt -->
<h2>&#x00AD;NEW!!!! Trusted by growing organizations&#x00AD;</h2>

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

6. הצעת תבנית משלך תחת שם חדש

במקום קובץ חלופי בשם זהה אפשר ליצור תבנית נפרדת. העתק, למשל, וריאציה של לקוחות ושמור אותה כSectionMyTemplate_own.txt. החלק אחרי Section הוא שם התבנית האישית; הוא קובע את הבחירה החדשה בעורך. תבנית הלקוחות המקורית לא תוחלף אם יהיה שם אחר.

SectionClients.txt          → Standard: Clients
SectionClients_own.txt      → eigene Version von Clients
SectionMyTemplate_own.txt   → zusätzliche eigene Vorlage MyTemplate

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

7. הצגת תבניות אישיות בלבד עם Only_own.txt

אם הלקוח הסופי צריך להשתמש רק בתבניות שהענית, צור בתיקייה /bx_Layout/ את הקובץ הדגל Only_own.txt. לפי תצורת התבניות המוצגת, יוגשו רק קבצים אישיים מתאימים עם התוספת _own בבחירת התבניות. הקובץ לא זקוק לקוד HTML עבור הפונקציה הזו.

/bx_Layout/Only_own.txt

דוגמה: אם קיימים בתיקייה SectionClients.txt, SectionBanner.txt וSectionMyTemplate_own.txt, הבחירה לאחר הפעלת הגדרת זו תכיל רק את התבנית האישית המתאימה. בכך תוכל לספק ללקוח בחירה ממוקדת ומותאמת לפרויקט.

8. תבניות תג אישיות עבור בלוקי טקסט

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

TagTemplate.txt
        ↓ kopieren
TagTemplate_own.txt

9. שכפול עמודות ניתנות לעריכה עם colAll

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

<div class="colAll col-md-6">
   <h2>&#x00AD;Hello world&#x00AD;</h2>
   <p>&#x00AD;Writing&#x00AD;</p>
</div>

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

10. הדגשות טקסט ותבניות רב-לשוניות

הסקשנים הסטנדרטיים המסופקים כוללים בתוך הטקסטים לדוגמה את המחרוזת ­, למשל לפני ואחרי כותרות. הסימונים הללו לא צריכים להיות מבלבלים עם סימון ההפרדה <!--__SP_SectionTemplate__-->. בזמן העתקת תבניות קיימות, אתה צריך לשמור את הסימונים של ה-CMS כך שהתנהגות העורך הקיימת תישמר.

<h2>&#x00AD;Designed for everyday success&#x00AD;</h2>

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

11. פונקציות אישיות וכוללים נדרשים

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

if(!function_exists("MyTestFunction")) {
   function MyTestFunction($Test) {
      return $Test;
   }
}

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

<!--bxInclude--/bx_Mod/Blog_Detail-->

הקבצים הפנימיים של התבניות עם הסיומות .txt או .bx אינם מיועדים לשליפה ישירה דרך כתובות HTTP/HTTPS ציבוריות בתצורת ה-CMS המתוארת. הם נקראים ומעובדים בצד השרת.

12. מדוע תבניות מוגבלות הן שימושיות עבור צוותי עריכה

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

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

13. תוצאה וסיכום

אתה פותח את /bx_Layout/, מעתיק קובץ סקשן קיים, מוסיף _own, מתאים את קוד ה-HTML ובודק את הפלט תחת הכנס → קטע עמוד. עבור קטגוריות בחירה חדשות תשתמש בשם קובץ אישי שמתחיל עם Section.

SectionClients.txt
       ↓ kopieren
SectionClients_own.txt
       ↓ HTML und Texte bearbeiten
<!--__SP_SectionTemplate__-->
       ↓ Varianten im Editor
Einfügen → Seiten-Abschnitt → Clients

אם אתה מפעיל בנוסף את Only_own.txt ומגביל את זכויות העורך בהתאם, העורכים שלך יוכלו לעבוד במדויק עם תבניות ה-HTML Section האישיות שסופקו.