מאפיינים מותאמים

כל רכיב ב-⁠Elementor יכול לקבל מאפייני HTML משלו: aria-⁠label לקוראי מסך, data-⁠*‎ למדידה, rel ו-⁠title לקישורים, role ו-⁠itemprop למבנה. מוסיפים אותם בלשונית "מתקדם" > "מאפיינים מותאמים", שורה לכל מאפיין. מתחת לכל דוגמה מוצג הקוד שהדפדפן קיבל בפועל.

דוגמאות

aria-label ו-title לכפתור

קורא מסך מקריא "הורדת המדריך המלא (PDF, 2MB)" במקום "הורדה".

…

data-*‎ למדידה

כלי מדידה כמו Google Tag Manager יכולים לזהות את הכותרת לפי data-⁠track.

מבצע הסתיו

…

rel ו-title לקישור

כרטיס שכולו קישור

קונטיינר עם תגית HTML מסוג a: המאפיינים rel ו-⁠title נוספים לקישור עצמו.

…

role ו-aria-label לאזור

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

שעות פתיחה

א-⁠ה 09:00-⁠18:00, ו 09:00-⁠13:00

…

itemscope ו-itemprop לנתונים מובנים

Google קורא את שם המוצר ואת תיאורו מתוך itemprop.

כוס קרמיקה בעבודת יד

זיגוג טורקיז, 350 מ"ל

…

id ו-class

…

style

style מותר רק למנהלים

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

…

lang ו-dir לציטוט בשפה אחרת

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

"Simplicity is the ultimate sophistication."

…

מה לא נכנס

כדי שאף אחד לא יוכל להריץ קוד דרך מאפיין: שורות של מטפלי אירועים (onclick, onmouseover וכל שם שמתחיל ב-⁠on), כתובות javascript: או data: ב-⁠href, src, action ו-⁠formaction, ונתוני Elementor עצמו (data-⁠id, data-⁠settings) מוסרות בשמירה וגם בהצגה. שם המאפיין שבשורה מסביר בעורך למה היא לא תופיע.

מאפיין שכבר קיים ברכיב נשאר כמו שהוא, חוץ מ-⁠class ו-⁠style שמתווספים אליו. id נכנס רק כשאין לרכיב מזהה CSS משלו.