מרכז התמיכה של Wix
    ראשי
  1. יצירת האתר
  2. Editor X
  3. הוספת אלמנטים ב-Editor X
    4. Editor X: שימוש ברפיטרים (Repeaters)

Editor X: שימוש ברפיטרים (Repeaters)

זמן קריאה: 8 דקות
Editor X עובר ל-Wix Studio, הפלטפורמה החדשה שלנו לסוכנויות ופרילנסרים.פרטים נוספים על Wix Studio
רפיטר הוא רשימה של פריטים שיש להם אותם עיצוב ופריסה, אבל בכל אחד מהם יש תוכן אחר. זאת דרך מהירה ונוחה להצגת התוכן שלכם. 
ב-Editor X, רפיטרים מסודרים בפריסה גמישה שמארגנת את התוכן מחדש באופן אוטומטי כשהגודל שלו משתנה, כך שהוא ייראה נהדר בכל גודל מסך.
בעמוד המידע הזה נסביר על:
דוגמה לרפיטר שמעצבים ב-Editor X
טיפ:
ברפיטרים אפשר גם להציג תוכן דינמי מתוך אוספים – בשביל זה צריך לחבר את מערכת ניהול התוכן CMS. 

הוספת ריפיטר

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

כדי להוסיף רפיטר:

  1. ב-Editor X הקליקו משמאל על Add Elements (הוספת אלמנטים).
  2. הקליקו על Layout Tools.
  3. הקליקו על Repeaters.
  4. גררו רפיטר אל העמוד.
צילום מסך על חלונית Add Elements ב-Editor X, שבה רואים את הרפיטרים שאפשר להוסיף

הוספת תוכן לריפיטר

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

כדי להוסיף תוכן לרפיטר:


  1. ב-Editor X הקליקו למעלה על Add Elements (הוספת אלמנטים.
  2. גררו את האלמנט הרצוי ישירות אל הרפיטר. 
  3. הקליקו על האלמנט והתאימו אותו אישית לכל פריט בנפרד. 
טיפ:
כשמסירים אלמנט מפריט רפיטר אחד, האלמנט נמחק מכל שאר הפריטים. 
סרטון שמראה שהוספת אלמנט לפריט ברפיטר מוסיף את האלמנט לכל שאר הפריטים

ניהול הפריטים ברפיטר

דרך חלונית ה-Inspector (עריכה) אפשר לשכפל פריטים ברפיטר, לשנות להם את השם, לשנות את הסדר שלהם או למחוק אותם.

כדי לנהל את הפריטים:

  1. הקליקו על הרפיטר.
  2. הקליקו על האייקון של חלונית העריכה  בחלק העליון של Editor X.
  3. (בחלונית ה-Inspector) הקליקו על Manage (ניהול) ליד מספר הפריטים. 

    A screenshot of the top of the Inspector panel where you can click Manage to manage repeater items
  4. בחרו איך לנהל את הפריטים ברפיטר:
    • כדי לשכפל פריט: הקליקו על Duplicate Item למטה.
    • כדי למחוק פריט: הקליקו על אייקון הפעולות הנוספות ליד הפריט ואז על Delete.
    • כדי לשנות את שם הפריט: הקליקו על אייקון הפעולות הנוספות ליד הפריט ואז על Rename.
    • כדי לשנות את סדר הפריטים: הקליקו על הפריטים וגררו אותם למיקום חדש.
צילום מסך של חלונית Manage Items בחלונית ה-Inspector

עיצוב הרפיטר

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

כדי לעצב את הרפיטר:

  1. הקליקו על הרפיטר.
  2. הקליקו על האייקון של חלונית העריכה  בחלק העליון של Editor X.
  3. הקליקו על הטאב Design (עיצוב) . 
  4. היעזרו באפשרויות הזמינות לעיצוב הרפיטר:
    • שנו את צבע המילוי ואת רמת האטימות של כל הפריטים.
    • הוסיפו מסגרת והצללה כדי להבליט את הפריטים.
    • שנו את עיצוב הפינות לעגול או ריבועי יותר.
    • הוסיפו סמן עכבר מעניין שיופיע כשהגולשים עומדים עם העכבר מעל הרפיטר. 
משתמשים בתבנית עיצוב AB?
השינויים האלה בעיצוב יחולו על כל הפריטים ברפיטר, בלי קשר לתבנית ה-AB. 
צילום מסך של רפיטר והאפשרויות הזמינות בטאב העיצוב בחלונית ה-Inspector

הגדרת תבנית עיצוב AB לפריטים ברפיטר

כדי ליצור עיצוב משוכלל יותר, אפשר לחלק את פריטי הרפיטר ל-2 קבוצות. תבנית ה-AB מאפשרת ליצור שתי גרסאות של אותו עיצוב, עם אינטראקציות וסגנונות שונים.
כשמפעילים את תבנית ה-AB, הפריטים ברפיטר מתחלקים לקבוצות A ו-B. ב-Editor אפשר לראות אילו פריטים שייכים לכל קבוצה. כשאתם מעצבים פריט A או פריט B, שאר הפריטים בקבוצה משתנים אוטומטית בהתאמה. 
צילום מסך של רפיטר ושל חלונית ה-Inspector. המשתמש מעצב את הפריטים מקבוצה B.

כדי להגדיר תבנית עיצוב AB לפריטים ברפיטר:

  1. הקליקו על הרפיטר.
  2. הקליקו על האייקון של חלונית העריכה  בחלק העליון של Editor X.
  3. גללו למטה אל Display (תצוגה).
  4. הפעילו את המתג Set AB design pattern (הגדרת תבנית AB).
    A screenshot of the Display section in the Inspector panel, enabling the AB pattern toggle
  5. עצבו את הפריטים בקבוצות A ו-B:
    1. הקליקו על פריט A או B ברפיטר.
      טיפ: זה יכול להיות כל פריט מהקבוצה הרלוונטית.
    2. (בחלונית העריכה) הקליקו על הטאב Design (עיצוב).
    3. בחרו איך אתם רוצים לערוך ולעצב את קבוצת הפריטים:
      • בחרו עיצוב מוכן מראש מ-Design (עיצוב).
      • שנו את ה-Fill color & opacity (צבע מילוי ואטימות) של הפריטים.
      • דרך הטאב Interactions (אינטראקציות) אפשר להוסיף אינטראקציה של מעבר עכבר או הקלקה. 

שינוי הפריסה של הרפיטר

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

כדי עוד יותר לשנות את הפריסה של הרפיטר:

  1. הקליקו על הרפיטר.
  2. הקליקו על אייקון חלונית העריכה  בבחלק העליון של Editor X.
  3. שנו את הפריסה של הרפיטר בהתאם לסוג שבחרתם:
הערה לגבי CSS gaps:
יש דפדפנים ישנים שלא תומכים בתכונה הזו (למשל, Chrome 76-83, ‏Safari 12-14 ו-Edge 79-83). המשמעות היא שגולשים שנכנסים לאתר מהדפדפנים האלה לא רואים את הרווחים שהגדרתם בין פריטים ברפיטר. 
צילום מסך של חלונית העריכה ב-Editor X, שבה מגדירים את תצוגת הרפיטר
לפרטים נוספים על רפיטרים:
עברו אל Academy X כדי לגשת לשיעור ולתרגילים שלנו בנושא רפיטרים.  

זה עזר לך?

|
בעמוד מידע הזה
  • הוספת ריפיטר
  • הוספת תוכן לריפיטר
  • ניהול הפריטים ברפיטר
  • עיצוב הרפיטר
  • הגדרת תבנית עיצוב AB לפריטים ברפיטר
  • שינוי הפריסה של הרפיטר