Elementor התדמית שאתר תדמית עושה לבעל התדמית (או בקצרה- שיתוף)

[נועה סבאן]

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

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

אה רגע,
זה האתר: https://taler-arc.com/ (כמעט שכחתי...)

 

[נעמי חדד]

מטורףףף!!

 

[שלמה ויסברג]

מדהים מדהים!!
אגב, אולי תספרי לנו איך עשית את המרובע מסביב שרץ לאורך כל האתר,
זה הוכנס בתוך ההאדר?

 

[watermelon]

וואו
אתר מדהים!!!

 

[ראובן ליבוביץ]

וואוו אחד ענקק!!
אליפות ממש!
איזה נקיות, איזה עיצוב, איזה בנייה!!
שאפו ענק!!
ג"א מצטרף לשאלה של שלמה

אולי תספרי לנו איך עשית את המרובע מסביב שרץ לאורך כל האתר,
זה הוכנס בתוך ההאדר?

 

[זווית]

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

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

אה רגע,
זה האתר: https://taler-arc.com/ (כמעט שכחתי...)

אתר מושלם ! יצירתי!
עם שפה מקסימה ומדויקת

נהנתי מההמלצות בתפריט הקופץ
ומהעבודות אחרונות בהדר

 

[נועה סבאן]

המרובע מסביב שרץ לאורך כל האתר,

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

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

 

[שלמה ויסברג]

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

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

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

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


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

 

[נועה סבאן]

הייתי ממליץ קצת לעבות את הטקסט וגם את הקו התחתון שיהיה יותר בולט

קיבלתי, תודה.

לגבי הטופס- נטו בשביל הרגל הלקוחה, מה גם שתוספת בניה של דבר כזה זה תמחור נוסף...

 

[roni ravitz]

אתר מקסים

.elementor-element-958be49{
pointer-events: none;
}

ותיראי ישועות

 

[י ע ל]

אתר מקסים

.elementor-element-958be49{
pointer-events: none;
}

ותיראי ישועות

למה הקוד?
מעניין להחכים

 

[אלעזר 1]

למה הקוד?
מעניין להחכים

מבטל את לחיצות העכבר באלמנט, מאפשר לגשת עם העכבר לכל האלמנטים שמתחתיו

 

[שלמה ויסברג]

מבטל את לחיצות העכבר באלמנט, מאפשר לגשת עם העכבר לכל האלמנטים שמתחתיו

וזה בעצם מייתר את הצורך במשחק של ה-Z-INDEX?

 

[נועה סבאן]

אתר מקסים

.elementor-element-958be49{
pointer-events: none;
}

ותיראי ישועות

גאונות.
חבל שלא ידעתי קודם!

 

[אלעזר 1]

וזה בעצם מייתר את הצורך במשחק של ה-Z-INDEX?

כן

אגב, יש אפשרות לעשות את המסגרת הקבועה עם CSS במקום עם וידג'ט של אלמנטור:

body{ position: relative; }
body::after {
    outline: 1px solid black;
    outline-offset: -12px;
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 9999;
    user-select: none;
    pointer-events: none;
}

 

[נועה סבאן]

אגב, יש אפשרות לעשות את המסגרת הקבועה עם CSS במקום עם וידג'ט של אלמנטור:

ואיך זה מסתדר רספונסיבי?

 

[אלעזר 1]

ואיך זה מסתדר רספונסיבי?

יש לזה מיקום קבוע בראש העמוד עם גובה של 100% מגובה המסך (100vh) ורוחב 100%

תוכלו לבדוק את זה כאן:

https://codepen.io/witty_code/pen/YzOLjqp

 

[נועה סבאן]

מגובה המסך (100vh)

באתר שלי זה היה 95VH

 

[אלעזר 1]

באתר שלי זה היה 95VH

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

 

[י ע ל]

אתר מקסים

.elementor-element-958be49{
pointer-events: none;
}

ותיראי ישועות

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