אלמנטור (Elementor) הינו תוסף WordPress המאפשר לעצב אתרים באופן פשוט בשיטת Drag and Drop ליצירת מבנה אלמנטים ישירות ב-Frontend של עמודי האתר. אלמנטור הוא לא ה- Page Builder הראשון שפותח לאתר WordPress שעובד בשיטה זו, אך הוא יצר מהפכה של ממש בתחום בניית אתרים בשל היכולת שלו לפשט יישומים שעד כל היו מורכבים במיוחד.
המשמעות בבניית האלמנטים ישירות ב-Frontend מבטלת את הצורך הסיזיפי של פיתוח תוך כדי בחינה מתמדת של הנראות העיצובית. באמצעות אלמנטור – כל נושא הפיתוח מתקיים בו זמנית עם הבחינה של הויז'ואל, מה שחוסר זמן משמעותי בתהליך הבנייה. אבל לא רק זה – הוידג'טים עצמם שאלמנטור יודעת לספק הם מתקדמים במיוחד ובעלי שליטה כמעט מושלמת בנראות שלהם (ומי שירצה להגיע לתוצאות Pixel Perfect יוכל גם להשפיע על אלמנטור באמצעותה Css).
אבל אם ראיתם עכשיו את המונחים Pixel Perfect ו- Css ונבהלתם, אז לא לדאוג, כי באמצעות הטכנולוגיה שלהם, אלמנטור למעשה הנגישה את תחום בניית האתרים גם למי שאין לו ידע בתכנות או עיצוב גרפי. זה משהו שהוא לא מובן מאליו בכלל: WordPress, שהיית נחשבת לפלטפורמה מאוד מורכבת טרום עידן האלמנטור, הפכה לקלה כמעט כמו לבנות אתר ב-Wix.
אז אם לבנות אתר WordPress באמצעות אלמנטור *כמעט קל* כמו Wix, למה שלא נשתמש ב-Wix?
חשוב לזכור – אלמנטור הוא תוסף וחלק אחד ממרכיב האתר שמפותח על בסיס WordPress. על כן, היתרונות של WordPress חלים גם במקרה זה. לרוב אני לא אוהב לענות על שאלת ההשוואה בין Wix לכל דבר אחר ואלמנטור בפרט בגלל שלכל אחד יש היתרונות והחסרונות שלו, ומה גם שמי ששואל שאלה כזו, לרוב לא מכיר אפילו את WordPress. אבל במאמר הזה אין מנוס וזה מתבקש.
אני אתן את ההבדלים העיקריים: בעוד ש-Wix היא אפליקציית CMS (מערכת לניהול תוכן) שמאפשרת ליצור וידג'טים רק מהמאגר הסגור שלה, אלמנטור (שהיא בכלל Plug ולא CMS) היא בעלת קוד פתוח, מה שמאפשר לה ליצור אין סוף אפשרויות. אני אציין כמה יכולות "בסיסיות" ואז אדבר על הפיתוחים שבוצעו על בסיס הקוד הפתוח של אלמנטור:
- באלמנטור ניתן ליצור שרשור פרמטרים דינמיים. שרשור הפרמטרים מאפשר ליצור תוכן על בסיס מידע שנמשך מנתונים שהוזנו במקום אחר באתר.
שימושים לדוגמה: טופס שמולא על ידי הלקוח ולא על ידי מנהל האתר שהופך לתוכן באתר (כמו לדוגמה פוסטים שאנחנו מעלים לפייסבוק שאנחנו בעצמנו כותבים אותם, או במקרה אחר – אתר יד 2 שבו אנחנו מעלים את התוכן). - אלמנטור מאפשר לפתח תבניות מותאמות אישית ולשייך אותם לקטגוריות, תגיות וסינונים אחרים לשליטתנו וכך ליצור מראה דינמי לאתר.
- ניתן לעשות שימוש בקבצי json לטובת הטמעת אנימציות באתר שיגבו לפי תנאים שנגדיר להם, ליצור טפסים מרובי שלבים ולהטמיע בהם Webhook, ליצור כפתורי Call To Action דינמיים ועוד. את כל הדברים לעיל לא אפשריים ב-Wix. ושוב אני אומר – אין כאן מקום להשוואה. וויקס היא לא מערכת שאמורים לפתח בה אתרים מורכבים ככה שהכל בסדר איתם.
בנוגע לקוד הפתוח של אלמנטור – על בסיס קוד זה, אלפי הרחבות לאלמנטור. ההרחבות נשענות על הטכנולוגיה של אלמנטור ומאפשרות עוד פיצ'רים ווידג'טים. להלן רשימה חלקים של הרחבות שיצרו שיפור משמעותי ליכולות של אלמנטור ואלמנטור פרו:
- Jet Elements
- Unlimited elements for Elementor
- Elementor Addon Elements
- Envato Elementor themes
וזו עוד רשימה מצומצמת וצנועה מאוד של הרחבות אלמנטור.
למעשה, נכון ליום כתיבת מאמר זה – לו תחפשו את מילת המפתח "Elementor" בחלון חיפוש התוספים ב-WordPress, אתם תמצאו 1,232 פריטים!
מה אפשר לעשות באמצעות אלמנטור וכמה זה עולה?
אלמנטור בגרסה החינמית שלו מאפשר לכם ליצור אתרי תדמית ואף חנויות אינטרנטיות באופן מלא לחלוטין! אלמנטור (בגרסה החינמית) כולל אלמנטים כמו כותרות, קופסות טקסט, תמונות, גלריות, אייקונים של רשתות חברתיות, וכך גם אלמנטים מתקדמים כמו בר התקדמות, SoundCloud, ספויילרים ועוד. עם זאת – יהיו כמה וידג'טים בסיסיים שכדי ליצור את אתר התדמית או החנות שלכם, אתם תצטרכו להתקין תוספים חדשים (כמו טופס יצירת קשר שלא קיים באלמנטור הפשוט) ולהסתמך על הנראות של תבנית העיצוב של האתר (כמו תפריט הניווט, ה-Header וה-Footer).
במידה ותחליטו לשדרג לאלמנטור פרו (מחיר אתר יחיד עולה 49$, מנוי ל-3 אתרים עולה 99$ ומנוי ל-1,000 אתרים עולה בסה"כ 199$) – תוכלו ליישם בייתר קלות את השלמת בניית האתר שלכם. מלבד אלמנטים נוספים שמתווספים לבנק האפשרויות של אלמנטור (כמו טופס יצירת הקשר ותפריט הניווט שדיברנו עליהם מקודם אבל לא רק), תוכלו גם לייצר תבניות בעלות שליטה עיצובית גבוהה של Header and Footer. ברגע שאתם שולטים באופן פשוט על עיצוב כל חלקי האתר (Header, Body and Footer) לא תישאר לכם הרבה עבודה מלבד ליהנות מהאפשרויות הבלטי נגמרות של העיצוב אלמנטור.
איך אלמנטור עובד?
אלמנטור מחלק לפי שיקולכם את העמוד לאזורים, עמודות ואזורים פנימיים. אולי זה נשמע מסבך, אבל בפועל זה ממש מייעל את העבודה ואת יכולת השליטה שלכם בעיצוב העמוד. עבור כל אזור, עמודה ואזורים פנימיים יש שליטה על מבנה הפריסה, סגנון הרקע ועוד. כך למשל – באמצעות שליטה זו תוכלו לבחור ליצור רקע לאזורים באתר עם צבעים שונים, תמונות ואפילו וידאו וגלריית תמונות. ראו דוגמה פשוטה ליישום עיצוב שלוקח בערך 2-3 דקות של עבודה ותוצאה שהיא כבר חמודה מאוד:
אחרי שתבינו את מבנה האזורים והעמודות, תעברו לאלמנטים (וידג'טים ואלמנטים אלו מילים נרדפות). בנק האלמנטים עשיר במיוחד. תוכלו לראות כאן את כל הפיצ'רים שאלמנטור ואלמנטור פרו מציעים. בשיטה זו, נבנו אתר אינטרנטיים למותגים מובילים כמו לדוגמה אופטיקה הלפרין, הבלוג של איסתא ורבים אחרים.
איך אפשר ללמוד לבנות אתרים באמצעות אלמנטור?
במידה ואתם רק רוצים להתנסות, אז תמיד תוכלו להתקין WordPress באופן לוקאלי על המחשב שלכם וככה אפילו לא לשלם על שרת אחסון. כמובן שהאתר שלכם לא יהיה באוויר, אבל זה מעולה להתלמדות. כדי להתקין את WordPress באופן לוקאלי גשו לאתר זה ופעלו לפי ההוראות: https://bitnami.com/stack/wordpress/installer.
ניתן גם לפתוח שרת בקלאודוויז (חודש ראשון מתנה + 25% הנחה ל3 חודשים ראשונים דרך הקישור שלי), ובו להתקין וורדפרס.
לאחר מכן, גשו לבנק התוספים של WordPress וחפשו את אלמנטור. הגרסה החינמית כמובן מספיקה להתלמדות והתנסות. במידה ותרצו לעשות צעד קדימה, תוכלו לרכוש רישיון לאלמנטור פרו. למי שמבצע את התהליך בפעם הראשונה ועדיין לא עבד כלל עם WordPress, אני מציע בחום לחבר הדרכות ב-YouTube כדי להבין איך הבסיס של אלמנטור עובד. זה יספיק כדי לקלוט את הבסיס ומשם רק לפרוח.
עובדת בונוס: אלמנטור היא חברה בקנה מידה בינלאומי אבל תאמינו או לא – אלמנטור הם משלנו 😊 גאווה ישראלית – משרדי אלמנטור ממוקמים בבורסה ברמת גן והם כנראה היהלום הכי יוקרתי במתחם.
לאתר של אלמנטור: https://elementor.com
מאמר זה נכתב ע"י חוליאן טרומפר.
