‏Column formatting מאפשר לשנות את אופן ההצגה של שדה מבלי לגעת בנתונים המאוחסנים. בקשה נפוצה היא “בורר צבעים”: עמודה המכילה ערך צבע, שמוצגת כדגימת צבע במקום טקסט גולמי כמו #2E86C1. כך בונים זאת כעמודת אתר לשימוש חוזר.

יצירת עמודת האתר

1. ‏Site Settings → Site columns → Create.
2. תנו לה שם (לדוגמה Color) ושייכו אותה לקבוצה לצורך שימוש חוזר.
3. בחרו את הסוג:
   • ‏Single line of text — מקבל כל ערך (#2E86C1 או red).
   • ‏Choice — מגביל את הקלט לפלטה מוגדרת מראש (מומלץ; ראו בהמשך).
4. הוסיפו את העמודה לכל רשימה או ספרייה.

החלת ה-JSON של העיצוב

בכותרת העמודה: ‏Column settings → Format this column → Advanced mode, הדביקו ושמרו.

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "style": {
    "display": "flex",
    "align-items": "center",
    "gap": "8px"
  },
  "children": [
    {
      "elmType": "div",
      "style": {
        "width": "16px",
        "height": "16px",
        "border-radius": "4px",
        "background-color": "@currentField",
        "border": "1px solid #ccc"
      }
    },
    {
      "elmType": "span",
      "txtContent": "@currentField"
    }
  ]
}

• ‏@currentField מתורגם לערך המאוחסן בתא — טקסט או בחירה שנבחרה.
• הצאצא הראשון הוא דגימת הצבע בגודל 16×16; ‏background-color: @currentField ממלא אותה. הגבול בעובי 1px שומר על נראות של צבעים לבנים או בהירים.
• ‏ה-span מציג את הערך הגולמי לצד הדגימה.

אותו JSON עובד גם עבור עמודות טקסט וגם עבור עמודות Choice — ללא שינוי.

שמות צבעים מול hex

‏background-color הוא CSS תקני, ולכן השדה מקבל כל צבע CSS חוקי: שם (red, royalblue, seagreen) או hex (#2E86C1). שניהם מוצגים באופן זהה. ערכים לא חוקיים (שגיאות כתיב, קודים פנימיים) מוצגים כשקופים, כך שטעויות בולטות מיד.

שימוש בשדה Choice לקלט מבוקר

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

red
green
gold
royalblue
tomato
seagreen

החילו את אותו JSON ללא שינוי. הגדירו ברירת מחדל אם תרצו שפריטים חדשים יקבלו צבע מראש. כדי להציג תוויות עסקיות (למשל High / Medium / Low) במקום צבעים גולמיים, השאירו את התוויות כאפשרויות הבחירה והוסיפו לוגיקה מותנית ב-JSON שתמפה כל תווית ל-background-color.

הערות

• היקף של עמודת אתר (site column) מאפשר הגדרה אחת לשימוש חוזר בכל רשימה וספרייה באתר.
• העיצוב הוא לתצוגה בלבד; הנתונים הקיימים והתצוגות אינם מושפעים.
• עובד ברשימות וספריות מודרניות בלבד (לא במצב classic).

מעוניינים לשמוע עוד? אנחנו כאן בשבילכם.

יצירת קשר