מדריך ליצירת האדר מתכווץ בגלילה באמצעות אלמנטור

במדריך זה נלמד כיצד בעזרת התוסף Elementor Pro בלבד ניתן לייצר סטיקי האדר עם לוגו מתכווץ.

תוכן עיניינים

הקדמה

במאמר הזה תלמדו כיצד ליצור סטיקי האדר שקוף, אשר בגלילה משנה צבע ומתכווץ ע"י הקטנת הלוגו.

על מנת לעשות זאת, יש צורך בשני דברים מקדימים:

  • ידע בסיסי בפיתוח בוורדפרס (אין צורך ידע מוקדם בקוד)
  • התוסף אלמנטור פרו חייב להיות מותקן – קישור להתקנה
 

סדר הפעולות

1. הכינו את ההאדר עליו תרצו לעבוד

2. כעת, הגדירו את האזור כ-Sticky:

  • עריכת אזור
  • מתקדם
  • אפקטי תנועה

3. הגדירו את כל האלמנטים שבאזור (לוגו לדוגמה) בתוך השורה במרכז. עשו זאת תחת:

  • עריכת אלמנט
  • מתקדם
  • מיקום 

4. תנו Class ללוגו שלכם.

ניתן לבחור ב"logo". נעשה זאת כדי שבקוד שנטמיע נוכל לזהות את הלוגו שאותו נרצה לכווץ.

5. לבסוף העתיקו את הקוד לCustom CSS תחת:

  • עריכת אזור ההאדר
  • מתקדם
  • Custom CSS

מוזמנים לשחק עם הקוד ולשנות את הגודל של הלוגו המכווץ, את הצבע של הרקע של ההאדר וכו'.

 

				
					selector.elementor-sticky--effects {
background-color: rgba(0,0,0,0.2)!important
}

selector {
transition: background-color 1s ease !important;
}

selector.elementor-sticky--effects >.elementor-container {
min-height: 70px;
}

selector > .elementor-container {
transition: min-height 1s ease !important;
}

.logo img {
max-width: 150px;
height: auto;
transition: all 0.5s ease;
}

.elementor-sticky--effects .logo img {
max-width: 60px;
height: auto;
}
				
			

מדריכים נוספים חמים מהתנור

שרת אחסון בלוג
וורדפרס

בחירת חברת אחסון לאתר וורדפרס

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

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

AI
עיצוב ופיתוח אתרים

איך AI משפיע על תחום עיצוב ופיתוח אתרים?

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

איך היא משפיעה על עולם האינטרנט של היום בכלל ועל תחום עיצוב ופיתוח האתרים בפרט? האם זה מאיים על התחום או דווקא משרת ומייעל אותו?