במידה ויש לנו עיצוב של תמונה וכותרת ובסוף השורה יש חץ המראה שהכותרת לחיצה, נוכל להוסיף זאת בקלות בעזרת קוד ה- CSS הבא, שימו לב איך זה נראה בווידג'ט כותרת כאן.
את החיצים ניתן לשנות לכל חץ או סימן אחר שנרצה, יש להעתיק את האייקון שנרצה מהאתר HTML by Toptal Designers ולשנות בקוד CSS ששמנו.
שימו לב לשוני בין הקודים:
- העליון מתאים לכותרת בעברית או ב- RTL מפני שהמרווח הוא מימין לאייקון
- התחתון מתאים לכותרת באנגלית או ב- LTR מפני שהמרווח הוא משמאל לאייקון
למה אנחנו צריכים את זה?
נכון שאפשר להשתמש בכפתור, להוריד את המסגרת והרקע ואז להוסיף שם איזה אייקון שנרצה אך לפעמים העיצוב משתמש בכותרת ותמונה בלבד ולא בכפתור לכן נשתמש בדרך הזו.
כתוב את הכותרת כאן
כתוב את הכותרת כאן
Title Goes here
/* יוסיף חץ בסוף טקסט הכותרת בכל ווידג'ט Heading */
selector .elementor-heading-title::after {
content: ' ↗'; /* אפשר לשנות את הסימן אם רוצים */
margin-right: 5px; /* מרווח קטן בין הטקסט לחץ */
}
/* יוסיף חץ בסוף טקסט הכותרת בכל ווידג'ט Heading */
selector .elementor-heading-title::after {
content: ' ↗'; /* אפשר לשנות את הסימן אם רוצים */
margin-left: 5px; /* מרווח קטן בין הטקסט לחץ */
}