שמעתם לא פעם את המילים וורדפרס ואלמנטור בהקשר של בניית אתרים, אבל אתם מרגישים לפעמים מעט אבודים בין כל המידע המסתובב ברשת? הכתבה הזאת תעשה סדר בדברים.
הנושאים בהם הכתבה עוסקת:
- מה זה וורדפרס ומה ההבדל בין wordpress.com לבין wordpress.org
- מהן תבניות בוורדפרס?
- מהם תוספים (plugins) בוורדפרס?
- מהם ווידג׳טים?
- מה זה אלמנטור ולמה מדברים עליו כל כך הרבה?
- האם כדאי לי לבנות אתר לבד או במערכת מובנית כמו wix?
- איך מתחילים לבנות אתר?
מה זה וורדפרס
וורדפרס היא מערכת ניהול תוכן חינמית אשר הוצגה לראשונה לעולם אי אז בשנת 2003 והוקמה על ידי חברה בשם Automattic ששייכת ליזם מאט מולנווג.
המערכת מבוססת קוד פתוח, שזה אומר במילים פשוטות שכל הקוד של המערכת, שבנויה בשפת התכנות PHP, פתוח לכולם, כך שכל מי שיודע לעבוד עם קוד יכול בקלות לבצע בה שינויים.
בשנת 2005, בעקבות הפופולריות שהלכה וצברה מערכת וורדפרס, חברת Automattic הקימה שירות של אירוח אתרים שכמובן מבוסס גם הוא על וורדפרס, וקראה לו wordpress.com.
השירות מהווה פלטפורמה חינמית ליצירת בלוגים ואחסונם. בעבר פלטפורמות מסוג אלה היו פופולריות במיוחד לאחר שעוד ועוד אנשים החליטו לפתוח בלוגים ולהביא על הכתב את רשמיהם.
וורדפרס.קום היוותה פלטפורמת בלוגים מצליחה לצד פלטפורמות פופולריות אחרות כמו בלוגר ובלוגספוט. כל מי שרוצה ליצור בלוג ברשת, יכול לבצע הרשמה קצרה וחינמית באתר של וורדפרס.קום ולהתחיל לכתוב ולעצב את הבלוג/אתר שלו.
המערכת של וורדפרס.קום כוללת תוספים מסויימים שניתן להתקין בבלוג וכן עיצובים שונים שאפשר לבחור ביניהם. כאשר פותחים אתר בוורדפרס.קום אין צורך להתעסק עם התקנה של וורדפרס ועם חברת אחסון – המערכת מוכנה מיד לעבודה איתה.
זאת אפשרות נהדרת למי שזקוק למרחב אישי לכתיבת בלוג, אבל עם הפשטות מגיעות המגבלות: ראשית, לא ניתן להרוויח כסף מהבלוג, למשל על-ידי פרסומות של גוגל. בנוסף, אי אפשר להתקין תוספים שלא קיימים במאגר התוספים הרשמי של וורדפרס (נגיע אליו בהמשך), כך שאם ישנה חברה שפיתחה תוסף שאתם זקוקים לו וצריכים להתקין אותו באתר, לא תוכלו לעשות זאת. כך גם לגבי תבניות עיצוב (גם עליהן נדבר בהמשך).
מגבלה נוספת היא שהתוכן נמצא בשרתים של וורדפרס.קום והם יכולים להחליט מחר לסגור לכם את האתר וכל מה שכתבתם ויצרתם יילך לאיבוד. לסיכום, מדובר במערכת שנועדה בעיקר לכתיבת בלוגים ולא לפיתוח אתר מלא. במילים אחרות, זוהי מערכת וורדפרס ״לייט״ עם אפשרויות מאוד מוגבלות.
אם רוצים לבנות אתר עצמאי על גבי מערכת וורדפרס, כדי ליהנות מכל הפיצ׳רים של המערכת, כדי שתהיה אפשרות בלתי מוגבלת להרחיב ולשפר את האתר בטווח הרחוק וכדי שתהיה לכם גישה ושליטה מלאים על כל ההיבטים של האתר, צריך להתקין את וורדפרס באופן עצמאי, בחבילת אחסון משלכם.
כאן נכנס לתמונה אתר wordpress.org. באתר זה, אפשר בחינם להוריד את כל מערכת וורדפרס על מנת להתקינה בחברת האחסון שלכם. כיום כבר אין צורך לעשות זאת, ברוב חברות האחסון אפשר בכמה קליקים פשוטים להתקין את וורדפרס ולהתחיל ליהנות מכל האפשרויות המדהימות שלה לאחר תהליך קצר של הגדרות המערכת.
תבניות עיצוב בוורדפרס
תבנית עיצוב בוורדפרס, כשמה כן היא – מהווה את הבסיס העיצובי של האתר שלכם. בכל אתר וורדפרס מותקנת תבנית עיצוב, ולכל תבנית ישנה אפשרויות עיצוביות משלה.
ישנן תבניות חינמיות שניתן להתקין באתר שלכם ולהתחיל לעצב אותו, וישנן תבניות פרימיום בתשלום. ניתן להתקין תבניות וורדפרס דרך מאגר התבניות הרשמי של wordpress.org ואפשר גם לרכוש תבניות בתשלום דרך חברות המתמחות בכך, להוריד את קובץ העיצוב למחשב, להעלות אותו למערכת האתר שלכם ולהתחיל להשתמש בתבנית ולעצב בעזרתה את האתר.
את התבניות מפתחים אנשי קוד, והן כוללות ברוב המקרים את הגדרות הצבעים של האתר, הגופנים, מיקומי התפריטים והווידג׳טים (תכף נגיע לווידג׳טים) והנראות של חלקים שונים באתר, כמו ראש האתר (שנקרא בעגה המקצועית Header), החלק התחתון של האתר (Footer), עיצוב עמוד פוסטים בודד (Single) ועיצוב עמוד ארכיון פוסטים המציג את הפוסטים האחרונים שפורסמו באתר (Archive).
תוספי וורדפרס
כאשר מתקינים את מערכת וורדפרס באתר, מלבד לכתוב תוכן ולעצב אותו בצורה בסיסית, לא ניתן לעשות איתו הרבה. בשביל זה נוצרו התוספים שתפקידם להרחיב את יכולות המערכת.
לדוגמה, כדי להציב באתר טפסים שונים יש להתקין תוסף של טפסים. כדי להפוך את האתר לאתר מכר הכולל חנות וירטואלית, צריך להתקין תוסף איקומרס. כדי להוסיף פורומים לאתר ישנם תוספים ייעודיים לכך.
כמו תבניות העיצוב, ישנם תוספים חינמיים שניתנים להתקנה דרך מאגר התוספים הרשמי שבאתר wordpress.org, ויש תוספי פרימיום בתשלום שאפשר להתקין באופן ידני באתר ע״י הורדת קובץ למחשב והעלאתו לאזור התוספים באתר.
אלמנטור לדוגמה, הוא תוסף וורדפרס שמגיע בשתי צורות – כתוסף חינמי בסיסי אותו ניתן להתקין דרך מאגר התוספים הרשמי של וורדפרס, וכתוסף פרימיום שנקרא אלמנטור פרו אותו ניתן לרכוש ולהתקין באופן ידני באתר. בהמשך נדבר יותר לעומק על אלמנטור ואיך הוא שינה את חיי בוני האתרים (כן כן, ממש כך).
ווידג׳טים
ווידג׳טים בוורדפרס הם פריטי תוכן שניתן להוסיף לאזורים שונים באתר כך שיופיעו בהם באופן קבוע. למשל, ישנן תבניות עיצוב שמאפשרות הוספת סרגל צדי (sidebar) שיופיע באופן קבוע לצד כל כתבה בבלוג.
לסרגל הצדי ניתן להוסיף ווידג׳טים שונים שיופיעו בו, למשל – ווידג׳ט של תיבת חיפוש, ווידג׳ט שמציג את הכתבות האחרונות שפורסמו בבלוג, ווידג׳ט שמאפשר הרשמה לרשימת תפוצה וקבלת עדכונים על פוסטים חדשים ועוד ועוד.
לעתים כשתתקינו תוספי וורדפרס, תראו שהם יכללו גם ווידג׳טים. למשל, כאשר מתקינים את תוסף הפורומים bbpress יתווספו למערכת ווידג׳טים חדשים וייעודיים של תוסף הפורומים, שאותם ניתן להוסיף למשל לצדי האתר, כך שכאשר גולש קורא את אחד הפוסטים שלכם, יופיע לו בסרגל הצדי גם קישור לפורומים באתר כך שיוכל להגיע אליהם ישירות מהפוסט.
מה זה אלמנטור
כאמור, אלמנטור הוא תוסף וורדפרס שמוצע בחינם בגרסה בסיסית או בתשלום בגרסת פרו. אלמנטור נבנה בתחילת הדרך כ-Page Builder, שבעזרתו ניתן לעצב עמודים באתר בקלות ובמהירות במקום העיצוב הפשוט והגנרי שמגיע עם תבניות העיצוב.
לפני שהפייג׳ בילדרים הגיחו לאוויר העולם, את עמודי התוכן באתר לא ניתן היה לעצב בצורה פשוטה. את התוכן היו כותבים דרך כתבן שדומה לתוכנת וורד וניתן היה להוסיף למלל תמונות, להטמיע סרטונים, להדגיש טקסטים, להוסיף קישורים ועוד.
אבל, אם רציתם להציג את התוכן שלכם בצורה קצת יותר מעניינת כמו למשל להוסיף רקעים שונים, כותרות מעוצבות, חלוקת התכנים לעמודות ועוד – הייתם צריכים לדעת לכתוב קוד ולהוסיף אותו לאתר שלכם. הפייג׳ בילדרים עושים לנו כיום את החיים הרבה יותר פשוטים כשזה מגיע לאפשרויות עיצוב העמודים בפרט ועיצוב האתר כולו בכלל.
כאשר יוצרים עמוד באלמנטור, ניתן לחלק אותו לעמודות ולכל עמודה להכניס אלמנטים שונים כמו כותרות, תמונות, גלריית תמונות, קווים מפרידים מעוצבים בין אזורי התוכן, כפתורים, אייקונים ועוד. את כל האלמנטים האלה אפשר לעצב – לשנות להם את הרקע, את גודל הטקסטים, את הצבעים ועוד.
הנה דוגמה לשני עמודים באתר זה. האחד אינו מעוצב באלמנטור ונכתב כולו בעזרת עורך התוכן הפשוט של וורדפרס: לחצו כאן לצפייה, והשני עוצב במלואו באלמנטור – לחצו כאן לצפייה.
בדוגמה הראשונה ניתן לראות שהדף דיי ״משעמם״ וכולל טקסט בלבד וסרטון מוטמע. עיצוב הכותרת של הדף נעשה דרך תבנית העיצוב, כלומר זוהי כותרת שמופיעה באופן קבוע בכל מקום באתר בו ישנו דף שלא עוצב ע״י אלמנטור.
בדוגמה השניה אנחנו רואים דף שמעוצב כולו באלמנטור והוא נראה הרבה יותר צבעוני ומעניין. הכותרת וכותרת המשנה (עם העיגול מסביבה) עוצבו ע״י אלמנטור, ובהמשך הדף ישנו אזור תוכן בעמודה הימנית ומתחתיו כפתור מעוצב, כאשר בעמודה השמאלית ישנה תמונה גדולה ומזמינה. כך עוצב גם שאר הדף, בעזרת אלמנטים של אייקונים, קווים מפרידים, רקעים שונים ועוד.
בנוסף, דף זה אינו כולל את העיצוב הגנרי של שאר האתר. תראו שאין בו את החלק העליון הקבוע של האתר שכולל את הלוגו והתפריט, וגם החלק התחתון של דף זה שונה משאר חלקי האתר.
את זה אפשר לבצע בקלות באלמנטור – ניתן להגדיר כל דף כך שיוצג בתוך העיצוב הקבוע של האתר, או באופן עצמאי (ללא החלק העליון והתחתון) – דבר שמתאים בעיקר לדפי נחיתה.
במרוצת השנים, אלמנטור הרחיבו את יכולות התוסף וכיום הוא יכול להחליף לגמרי עיצוב של כל חלקי האתר, כך שאתר הוורדפרס לא צריך להיות תלוי בתבנית שמישהו אחר עיצב.
אתם יכולים (בעזרת גרסת הפרו) לעצב בעצמכם כל חלק וחלק באתר – את החלק העליון, התחתון, פוסט בודד, עמוד ארכיון פוסטים ואפילו לעצב פופאפ שיצוץ בעמודים מסויימים באתר בהתאם להגדרות שלכם.
האפשרויות האלה מגדילות את החופש העיצובי של כל מי שאינו יודע לכתוב קוד ומאפשרות לנו לעצב אתרים בדיוק כמו שאנחנו רואים אותם בדמיון שלנו והכי חשוב – בקלות ובצורה מהנה.
תראו לדוגמה את העיצוב של החלק העליון של אתר זה – הוא כולו נעשה בעזרת אלמנטור, ומופיע בכל מקום שבו הגדרתי שיופיע האזור הזה (header), כמו עמוד הבית, עמוד הבלוג, עמוד יצירת הקשר ועוד.
בנוסף, החלק התחתון של אתר זה (footer) עוצב גם הוא באלמנטור, וכך גם עמוד פוסט בודד כמו העמוד שבו אתם קוראים כעת.
עיצבתי פעם אחת בלבד את דף הפוסט שכולל במקרה שלי את הכותרת, תוכן הפוסט, אלמנט שמוביל לכתבה הבאה או הקודמת בבלוג, אזור שיתוף הכתבה ברשתות חברתיות, אזור של השארת תגובות דרך פייסבוק ועוד.
לאחר שסיימתי להגדיר את עיצוב דף הפוסט, כל כתבה חדשה שמתווספת לאתר מקבלת את אותו עיצוב, כאשר המלל משתנה בהתאם לתוכן הפוסט.
לסיכום, הגדולה של אלמנטור היא החופש העיצובי שמתאפשר כיום לכל אחד – אפשר לעצב בעזרתו את כל חלקי האתר, ויש לתוסף הזה עוד הרבה אפשרויות שקצרה היריעה מלפרט, אבל יש לנו הדרכת וידאו על אלמנטור למתחילים, מוזמנים לצפות ולראות איך עובדים עם התוסף.
לחצו למעבר לאתר הרשמי של אלמנטור
האם לבנות אתר עצמאי או במערכת סגורה לבניית אתרים כדוגמת wix?
זוהי שאלת השאלות… ברשת ישנם דיונים חוצי יבשות על הכדאיות שבפתיחת אתר ויקס לעומת אתר וורדפרס עצמאי. התשובה? כמו כל דבר אחר בחיים – תלוי.
יש כאן באתר כתבה שמפרטת את היתרונות והחסרונות של מערכת פתוחה לעומת סגורה, מוזמנים להציץ כאן.
איך מתחילים לבנות אתר לבד?
הגעתם למסקנה שמתאים לכם לבנות אתר לבד? מצויין, יש לנו את כל המידע שצריך!
ראשית, כדאי להתחיל מתכנון נכון של האתר. יש כאן חוברת תכנון אתר להורדה בחינם.
לאחר שיש לכם רעיון לגבי התכנים, העיצוב והמבנה של האתר, כדאי להתחיל מההדרכה הבסיסית שלנו שבה לומדים איך נרשמים לחברת אחסון, איך מתקינים את וורדפרס ואיך מחברים לאתר שלכם גם דומיין (כתובת אתר) משלכם. יש לנו גם קורס מבוא לוורדפרס חינמי שמלמד את כל הבסיס לעבודה עם וורדפרס בחלוקה לשיעורים קצרים ופשוטים, שמגיעים אליכם במשך 8 ימים למייל – כל יום שיעור חדש.
לאחר שלומדים את הבסיס, כדאי לבדוק את מגוון הקורסים וההדרכות שלנו:
- איך בונים אתר ובלוג בוורדפרס – הקורס המלא והמקיף [בתשלום] – קורס באורך 4 שעות בו לומדים לבנות אתר וורדפרס מלא מהצעדים הראשונים ועד שיש לכם אתר מעוצב באוויר. בין היתר לומדים איך עובדים עם אלמנטור בצורה מעמיקה, איך מתאימים את האתר למובייל, איך מעצבים את כל חלקי האתר, איך מוסיפים מערכת דיוור לאתר ועוד ועוד. אם הגעתם עד לכאן, קבלו קופון לרכישת הקורס 🙂 הקלידו yt10off במעמד התשלום ותקבלו 10% הנחה.
- איך בונים אתר בוורדפרס [בחינם] – קורס המלמד איך בונים אתר וורדפרס עם תוסף אלמנטור (הקורס מעודכן לשנת 2019). מדובר אמנם בהדרכה בסיסית על אלמנטור, אך הקורס בהחלט מתאים למתחילים שרוצים לבנות לעצמם אתר תדמיתי
- איך בונים חנות וירטואלית [בחינם] – קורס המלמד איך בונים אתר וורדפרס עם חנות אונליין המבוססת על תוסף ווקומרס
- איך בונים דפי נחיתה באלמנטור | איך בונים דפי נחיתה מתקדמים עם אלמנטור פרו
- איך בונים אתר עם אזור תוכן בתשלום [חינם] – קורס המלמד איך בונים אתר וורדפרס ובו אזור תוכן שעליו תרצו לגבות כסף, לדוגמה – מכירת סדנה אינטרנטית, מיני קורס, הרצאה.
בכל דרך בה תבחרו ללכת בבניית האתר שלכם – אני מאחלת לכם בהצלחה רבה, ולא פחות חשוב – שתהנו מהתהליך!
