תמונה מלבנית עושה את העבודה, אבל לא תמיד מספרת משהו על המותג. קשת רכה ליד הטקסט של סטודיו ליוגה, עיגול עם קו מקווקו סביב תמונת פרופיל במשרד עורכי דין, או צורה אורגנית שזזה לאט בעמוד של קליניקה: תמונה בצורה חותך את התמונה לצורה שבוחרים ומוסיף סביבה עיטורים, בלי לפתוח תוכנת עיצוב ובלי להעלות קובץ חדש.
מה הווידג'ט עושה
הווידג'ט מציג תמונה אחת בתוך צורה, ומסביבה שכבות עיטור שמפעילים לפי הטעם. הקובץ בספריית המדיה לא משתנה: הצורה נקבעת בעמוד, ואפשר להחליף אותה בכל רגע.
- כלול: 13 צורות מוכנות
עיגול, קשת, קשת מעוגלת, ריבוע רך, משושה, מעוין, עלה כותרת, עלה, כרטיס כניסה וארבע צורות אורגניות.
- כלול: צורה משלכם
בוחרים "צורת SVG מותאמת", והחלקים המלאים בקובץ הופכים לצורה.
- כלול: עיטורים
קו מתאר באותה צורה, דוגמה ברקע (נקודות, קווים אלכסוניים או רשת), כתם מעבר צבע ותג מרחף עם מספר או סמל וטקסט קצר.
- כלול: אפקטים במעבר עכבר
התקרבות, התרחקות, מעבר משחור-לבן לצבע או להפך, והטיה קלה לכיוון סמן העכבר.
- כלול: צורה שזזה
בצורות האורגניות אפשר להפעיל שינוי איטי של הצורה, עם כפתור השהיה לגולשים.
- כלול: כיתוב וקישור
כיתוב מספריית המדיה או טקסט חופשי, וקישור לכל עמוד.
ככה זה נראה
מימין, עיגול עם קו מתאר מקווקו ורשת ברקע. משמאל, צורה אורגנית שמשתנה לאט, עם כתם מעבר צבע וצל זוהר. מעבירים את העכבר מעל התמונות כדי לראות את ההתקרבות וההטיה, ומעל הצורה האורגנית מופיע גם כפתור שעוצר את התנועה (במסכי מגע הוא מוצג תמיד).
עיגול, קו מתאר מקווקו ורשת
צורה אורגנית שמשתנה לאט
למי זה מתאים
הווידג'ט מתאים לכל מקום שבו תמונה אחת צריכה למשוך את העין: אזור "אודות" של קליניקה או של משרד עורכי דין, עם תמונת פרופיל בעיגול ותג כמו "שנות ניסיון"; פתיח של סטודיו ליוגה עם קשת רכה; או עמוד של מסעדה, שבו מנה אחת מוצגת בצורה אורגנית עם כתם צבע מאחוריה. גם חנות אונליין יכולה להבליט מוצר אחד, ואתר של קורס יכול להציג כך את המרצה.
איך מגדירים
- בוחרים תמונה
בתוכן > תמונה בוחרים את התמונה. אם חלק חשוב נחתך, קובעים את "נקודת המיקוד", ואפשר להוסיף "כיתוב" או "קישור".
- בוחרים צורה
בתוכן > צורה בוחרים את ה"צורה", ואם צריך משנים את ה"פרופורציות". לצורה משלכם בוחרים "צורת SVG מותאמת" ואז את קובץ ה-SVG.
- מוסיפים עיטור
בתוכן > עיטור מפעילים מה שרוצים: "קו מתאר באותה צורה", "דוגמה ברקע", "כתם מעבר צבע ברקע" או "תג מרחף".
- בוחרים אפקט
בתוכן > אפקטים במעבר עכבר בוחרים את "התמונה במעבר עכבר", ומפעילים או מכבים את "הטיה לכיוון סמן העכבר".
- מעצבים
בסגנון > תמונה קובעים את ה"רוחב", ה"יישור" וה"צל". לכל עיטור יש אזור משלו בלשונית הסגנון, לצבעים ולגדלים.
טיפים
שאלות נפוצות
אילו קובצי SVG מתאימים לצורה מותאמת?
כל SVG עם צורה מלאה: באזור המלא מוצגת התמונה, והאזור הריק נחתך. צורות פשוטות ומלאות עובדות הכי טוב. WordPress מקבלת העלאות SVG אחרי שמפעילים את "אפשר העלאת קבצים ללא סינון" ב-Elementor > הגדרות > מתקדם.
למה העיגול שלי נראה כמו אליפסה?
ה"פרופורציות" אינן ריבועיות. קובעים אותן ל"כמו שהצורה מצוירת" או ל"ריבוע (1:1)".
מה רואים גולשים שביקשו מהמכשיר פחות תנועה?
אצלם אפקטי התנועה, כלומר שינוי הצורה, ההטיה וההתקרבות, נשארים ללא תנועה.
הווידג'ט "תמונה בצורה" כלול ב-PeleAddons, בחינם ובלי נעילות. הוא פעיל מיד אחרי ההתקנה, ומוצאים אותו בפאנל של Elementor בקטגוריה PeleAddons.