top of page
BestSite logo

אתרי WIX מתקדמים

ניהול צבעים דינמי באתרי Wix עם שדות Color ב-CMS

שפר את העיצוב באתר שלך על ידי הוספה וחיבור של שדות 'Color' בבסיסי הנתונים (collections) של ה‑CMS. שדות 'Color' מאפשרים ניהול דינמי של צבע לכל פריט באתר—טקסט, כפתורים, רקעים—מה שמאפשר לשנות צבעים בלחיצה מ‑CMS בלבד מבלי לערוך ידנית כל אלמנט.


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


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


כדי להוסיף שדה 'Color' :

  1. עבור ל‑CMS בלוח הבקרה.

  2. בחר את בסיס הנתונים הרצוי.

  3. לחץ Manage Fields.

  4. לחץ + Add Field.

  5. בחר Color ולחץ Choose Field Type.

  6. הזן שם בשדה Field name.

  7. (רק לתכנות) ערוך את Field ID ב‑code.

  8. (אופציונלי) הוסף Help text ככלי עזר.

  9. לחץ Save.

    הוספת שדה צבע ל CMS

לאחר מכן:

  • העבר את הסמן על שדה ה‑Color ולחץ על סמל בחירה לבחירת צבע.

  • תוכל להדביק HEX אם תרצה.

  • בחר צבע מתוך Theme Colors או My Colors, הוסף צבע חדש במידת הצורך.

בחירת צבעים מהאתר

חיבור רכיבי טקסט לשדה מסוג 'Color'

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


עבור WIX Editor גש לעמוד הרלוונטי בעורך שלך.הוסף רכיב טקסט לעמוד שלך:

  1. לחץ על Add Elements בצד שמאל של העורך.

  2. לחץ על Text.

  3. לחץ על סוג הטקסט שברצונך להוסיף: Themed Text, Titles או Paragraphs.

  4. לחץ וגרור את הטקסט שבחרת כדי להוסיף אותו לעמוד.

    חיבור טקסט לצבע

  5. לחץ על סמל Connect to CMS ברכיב הטקסט.

  6. לחץ על התפריט הנפתח Choose a dataset ובחר dataset קיים שמחובר לאוסף שלך. לחלופין, לחץ על Add a New Dataset, ואז בחר את האוסף שברצונך לחבר.

  7. לחץ על התפריט הנפתח Text connects to ובחר את השדה שברצונך לחבר אליו את הטקסט.


עבור WIX Studio

גש לעמוד הרלוונטי בעורך שלך.הוסף רכיב טקסט לעמוד:

  1. לחץ על Add Elements בצד שמאל של העורך.

  2. לחץ על Text.

  3. לחץ וגרור את סוג הטקסט שבחרת כדי להוסיף אותו לעמוד.


חיבור טקסט לצבע בוויקס סטודיו
  1. לחץ על סמל Connect to CMS ברכיב הטקסט.

  2. לחץ על התפריט הנפתח Choose a dataset ובחר dataset קיים שמחובר לאוסף שלך. לחלופין, לחץ על Add a New Dataset, ואז בחר את האוסף שברצונך לחבר אליו.

  3. לחץ על התפריט הנפתח Text connects to ובחר את השדה שברצונך לחבר אליו את הטקסט.


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

  2. לחץ על Publish אם אתה מוכן לפרסם את השינויים באתר החי.



חיבור כפתור לשדה מסוג 'Color'

חבר כפתורים לשדות מסוג 'Color' כדי לנהל את צבעי הכפתורים ישירות מתוך אוספי ה‑CMS שלך. ניתן לחבר מצבים שונים של הכפתור (regular, hover, ו‑disabled) לשדות 'Color' שונים.בכל מצב של הכפתור ניתן לבחור אילו שדות 'Color' ישמשו לצבעי הטקסט, האייקון, הגבול והרקע של הכפתור.


עבור WIX Editor


גש לעמוד הרלוונטי בעורך שלך.

  1. לחץ על הכפתור שברצונך לחבר ל־CMS.

  2. לחץ על סמל Connect to CMS.

  3. לחץ על התפריט הנפתח Choose a dataset ובחר dataset קיים שמחובר לאוסף שלך. לחלופין, לחץ על Add a Dataset, בחר את האוסף שברצונך לחבר, תן ל-dataset שם ולחץ על Create.

  4. לחץ על התפריט הנפתח Click action connects to ובחר את האפשרות הרלוונטית.

  5. גלול מטה אל Colors בפאנל החיבור של הכפתור בצד ימין.

  6. לחץ על הלשונית הרלוונטית כדי לבחור באיזה מצב של הכפתור אתה רוצה להתחבר: Regular, Hover או Disabled.

  7. לחץ על התפריטים הנפתחים כדי לבחור את שדות ה־'Color' שברצונך לחבר:


    - Text color connects to: חבר שדה 'Color' לצבע הטקסט של הכפתור.

    - Icon color connects to: חבר שדה 'Color' לאייקון של הכפתור (אם יש).

    - Border color connects to: חבר שדה 'Color' לצבע הגבול של הכפתור.

    - Background color connects to: חבר שדה 'Color' לרקע של הכפתור.



חיבור כפתור לצבע
  1. חזור על שלבים 7–8 עבור כל מצב כפתור שברצונך לחבר לשדה 'Color' באוסף.

  2. לחץ על Preview כדי לבדוק את החיבורים.

  3. לחץ על Publish כדי לפרסם את השינויים באתר החי.

    עבור


עבור WIX Studio


  1. גש לעמוד הרלוונטי בעורך שלך.

  2. בחר את ה־section שברצונך לחבר לשדה 'Color' באוסף.

  3. לחץ על סמל Connect to CMS.

  4. לחץ על התפריט הנפתח Choose a dataset ובחר dataset קיים שמחובר לאוסף שלך. לחלופין, לחץ על Add a Dataset, בחר את האוסף שברצונך לחבר, תן ל-dataset שם ולחץ על Create.

  5. תחת Connections, השאר את השדה Section background connects to על Not connected.

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

  1. תחת Colors, לחץ על התפריט Section background color connects to ובחר את שדה ה־'Color' שברצונך לחבר.


חיבור כפתור לצבע בוויקס סטודיו
  1. לחץ על Preview כדי לבדוק את החיבורים.

  2. לחץ על סמל Preview בפינה הימנית העליונה כדי לבדוק את החיבורים בזמן אמת.




Comments


bottom of page