שאלה יפה :)
כדי לתת ללקוח לשנות פרטים בלייב, את יכולה להכניס לעיצוב וידג’ט HTML, ולכתוב בתוכו תגית שיוצרת שדה הקלדה. את העיצוב לשדה תוכלי להגדיר עם קוד CSS.
קוד HTML להוספת שדה טקסט באלמנטור – להקלדת טקסט חופשי
- הוסיפי וידג’ט HTML למקום הרצוי בעמוד.
- כתבי בתוכו את הקוד הבא:
<input type="text" id="i-name" placeholder="למי ההזמנה מיועדת? הקלידו כאן">
- שימי לב למרכיבים של הקוד:
יש לך פה תגית input מסוג text, שמגדירה את השדה שהוספת כשדה טקסט.
יש לך id שיעזור לך לזהות את שדה הטקסט לצורך העיצוב שלו בCSS
ויש לך placeholder שקובע לך איזה טקסט יופיע בשדה, לפני שהמשתמש התחיל להקליד.
את כמובן יכולה לשנות את הטקסט המופיע בplaceholder לפי הצורך שלך.
עיצוב שדה הטקסט על ידי קוד CSS
בCSS מותאם אישית של וידג’ט HTML הדביקי את הקוד הבא:
input{
background-color: #ffffff00 !important;
border-width: 0px !important;
text-align: center !important;
}
#i-name, #i-name::placeholder{
color: #F1DA97 !important;
font-size: 24px !important;
}
הקוד של הinput מגדיר לו רקע שקוף, רוחב מסגרת 0 ויישור טקסט למרכז.
הקוד השני מעצב לך 2 דברים בבת אחת:
- את צבע הטקסט וגודל הטקסט של שדה ההקלדה.
- את צבע הטקסט וגודל הטקסט של הplaceholder.
תצליחי,
חגית