בניית אתרים באלמנטור מבלי להיות מתכנת

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

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

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

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

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

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

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

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

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

בשיעור זה נלמד איך להוסיף תמונות לאתר באמצעות אלמנטור. נלמד איך אפשר להוסיף ולערוך תמונות, איך להגדיר תגית ALT ואיך לשלוט ברוחב/גודל התמונה.

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

בשיעור זה נלמד לערוך את האפשרויות הנוספות שיש לכל אלמנט בעמוד. נלמד איך להוסיף מרווחים לאזורים שונים, נלמד איך להוסיף Class ואיך להוסיף ID לכל אלמנט בעמוד.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

לאחר שלמדנו ליצור את ה-Header וה-Footer באתר בשיעור זה נלמד מה אפשר לעשות אם אנחנו רוצים להפוך את זה לדינאמי ולהציג למשל Header אחר בעמודים אחרים באתר.

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

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

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

בשיעור הזה אנחנו נלמד איך ליצור עמוד גלובלי Single Page (עמוד יחיד) באלמנטור. התבנית עיצוב שאנחנו הולכים ליצור תטען את כל העמודים שאנחנו יוצרים באמצעות אלמנטור.

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

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

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

במידה ואנחנו מוסיפים תיבת חיפוש (Search Box) לאתר נצטרף להפנות את הגולש לעמוד שיציג את תוצאות החיפוש. בשיעור הזה נלמד כיצד להגדיר את התבנית של עמוד תוצאות חיפוש.

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

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

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

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

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

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

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

בשיעור הזה ננסה להבין מה זה SMTP ולמה לפעמים חלק משרתי האחסון גורמים לנו לבעיות בעת שליחת מיילים בתוך האתר. בנוסף נדבר על מה אפשר לעשות אם אנחנו לא מקבלים מיילים מהאתר.

בשיעור זה נלמד איך אנחנו יכולים להגדיר שרת SMTP ושליחת מיילים בתוך שרת האחסון (חברת האחסון) על מנת לוודא שכל מייל שנשלח דרך האתר יישלח בהצלחה וללא בעיות.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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