דלג לתוכן
  • ראשי
  • אודות
    • מהתקשורת
    • המלצות
    • שאלות נפוצות
  • ההתמחות שלנו
    • בניית אתר מכירות
    • בניית אתרי תדמית לעסקים
    • בניית אתר וורדפרס
    • קידום אתרים אורגני
  • מאמרים
  • תיק עבודות
  • יצירת קשר
  • ראשי
  • אודות
    • מהתקשורת
    • המלצות
    • שאלות נפוצות
  • ההתמחות שלנו
    • בניית אתר מכירות
    • בניית אתרי תדמית לעסקים
    • בניית אתר וורדפרס
    • קידום אתרים אורגני
  • מאמרים
  • תיק עבודות
  • יצירת קשר
להתקשרות 054-395-1900

כפתור בטופס יצירת קשר בשני צבעים

דף הבית » טיפים לאלמנטור » כפתור בטופס יצירת קשר בשני צבעים

  • יוסי מזרחי
  • אוגוסט 16, 2024
כפתור בטופס יצירת קשר בשני צבעים איך עושים את זה? בדיפולט אלמנטור מאפשר צבע אחד בלבד בכפתור יצירת קשר וכך תעשו מעבר צבע
לרכישת אלמנטור פרו
לרכישת קרוקובלוק ג'ט

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

ככה נראה טופס רגיל שלא מציג מעבר צבע

העתיקו את קוד הCSS והדביקו בCSS מותאם של הטופס

				
					/* צבע דיפולט של הכפתור עם גרדיינט */
selector .elementor-button {
    background: linear-gradient(45deg, #3498db, #8e44ad); /* גרדיינט בזווית של 45 מעלות */
    color: #ffffff; /* צבע הטקסט */
    border: none; /* ללא גבול */
    transition: background 0.5s ease;
}

/* גרדיינט במצב hover */
selector .elementor-button:hover {
    background: linear-gradient(45deg, #e74c3c, #f39c12); /* גרדיינט שני במצב hover */
    color: #ffffff; /* צבע הטקסט */
}

				
			

וכעת הטופס שלכם במעבר צבע.אתם יכולים לשנות את 2 הצבעים במצב רגיל וגם במצב מעבר על הכפתור. 

למה שנרצה להציג כפתור בטופס בשני צבעים?

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

הצלחתם והשתמשתם במדריך? ספרו לי בתגובות

כתיבת תגובה לבטל

האימייל לא יוצג באתר. שדות החובה מסומנים *

קודםהקודםטקסט מסתובב באנימצייה קבועה
הבאכפתור קרא עוד – אלמנטורהבא
מה יש לנו במאמר
אוליי יעניין אתכם גם
undefined

יצירת מגה תפריט באלמנטור: UX מנצח לאתרים גדולים

לקריאת המאמר ⟵
יצירת מגה תפריט באלמנטור: UX מנצח לאתרים גדולים
כפתור קרא עוד - אלמנטור

כפתור קרא עוד – אלמנטור

לקריאת המאמר ⟵
כפתור קרא עוד – אלמנטור
טקסט מסתובב באנימצייה קבועה

טקסט מסתובב באנימצייה קבועה

טקסט מסתובב באנימצייה קבועה באלמנטור - טרנד עיצובי שתפגשו בהמון אתרים ועם ההדרכה הבאה תדעו גם להשתמש בה בפרויקטים שלכם >>
לקריאת המאמר ⟵
טקסט מסתובב באנימצייה קבועה
כותרת אלמנטור עם רקע תמונה מאחורה

כותרת אלמנטור עם רקע תמונה מאחורה

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

כותרת אלמנטור עם קו תחתון

כותרת אלמנטור עם קו תחתון בצבע לעיצוב חדשני
לקריאת המאמר ⟵
כותרת אלמנטור עם קו תחתון

כותרות במעבר צבע באלמנטור

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

חברה לבניית אתרים וקידום אורגני. בונים אתרי וורדפרס מתקדמים שמביאים תוצאות.

חייגו עכשיו לשיחת ייעוץ! 054-395-1900 וואטסאפ
google ביקורות גוגל
5.0
ראו את כל 20 הביקורות

ניווט באתר

  • ראשי
  • אודות
  • המלצות
  • תיק עבודות
  • צור קשר

שירותי החברה

  • בניית אתר מכירות
  • בניית אתרי תדמית
  • בניית אתר וורדפרס
  • קידום אתרים אורגני
  • קורס פיתוח אתרים

מאמרים אחרונים

  • מכירת מנויים (Subscriptions) וחיובים חוזרים בווקומרס
  • תוספי Wishlist והשוואת מוצרים: למה זה קריטי להמרה?
  • סינון מוצרים מתקדם (JetSmartFilters): שיפור חוויית הקנייה
א'-ה' · 10:00–18:00 054-395-1900 Yossimzhp@gmail.com תנופה 7-ב חריש

© 2026 YMdigital · כל הזכויות שמורות

מפת אתר הצהרת נגישות מדיניות פרטיות תקנון
חייגו עכשיו לשיחת ייעוץ! 054-395-1900