בניית אתרים בוורדפרס עם AI – קלוד קוד + Novamira + אלמנטור
נכתב ע"י יוחאי ירמיהו
בניית אתרים בוורדפרס עם AI זה כבר לא מדע בדיוני, באמצעות כלים שיעזרו לנו לחבר את האתר אל קלוד קוד תהיה לנו את היכולת לבנות אתרים שלמים בוורדפרס ואפילו לבנות אותם על אלמנטור מבלי הצורך לגעת באזור עריכה אפילו פעם אחת.
זה רחוק מהתכנים של "בניתי אתר ב-5 דקות עם AI" אבל אם אתם רוצים לשפר את תהליכי העבודה ולבנות אתרי וורדפרס בצורה יותר מהירה, כאן תהיה לכם היכולת ללמוד איך לעשות את זה בצורה האפקטיבית ביותר.
בניית אתרים בוורדפרס עם AI - קלוד קוד + Novamira ואלמנטור
שלושה כלים מעניינים לבניית אתרים בוורדפרס עם AI
מי שרוצה להתחיל בבניית אתרים בוורדפרס עם AI צריך להכיר קודם כל שלושה כלים מרכזיים שקיימים היום בשוק, וכל אחד מהם מתאים למצב קצת אחר.
1) הכלי הראשון הוא Angie של אלמנטור שמאפשר להוסיף צ'אט מתוך הפאנל של וורדפרס ולבצע עריכה של אזורים באתר, ליצור וידג'טים ואפילו לכתוב קוד.
הבעיה היא שהכלי עדיין לא מתקדם ברמה גבוהה במיוחד, הוא יעבוד טוב בעיקר עם אלמנטור PRO ובנוסף צריך לשלם על טוקנים בנפרד ולמי שכבר משלם על קלוד קוד זאת אופציה פחות טובה שתצריך לשלם על טוקנים פעמיים.
2) האופציה השנייה מגיעה מבית CrocoBlock. מדובר על החברה שמוכרת את תוספי Jet, והם פיתחו תוסף חדש בשם CrocoBuilder שדומה מאוד לאלמנטור אבל נבנה במיוחד לבניית אתרים באמצעות AI.
הכלי עדיין נמצא בגרסת בטא, אבל שווה לעקוב אחריו כי היתרון הגדול שלו הוא אפשרות לרכוש גישה לכל החיים במקום לשלם מנוי שנתי – וזה תמיד עדיף מאשר תשלום גבוה בכל שנה מחדש (אבל זה משתלם רק אם זה יחליף את אלמנטור בצורה אפקטיבית).
3) והכלי השלישי שנתמקד בו כאן במסגרת המאמר נקרא Novamira. התוסף שלהם מאפשר לנו באמצעות קלוד קוד להתחבר ישירות לאתר וורדפרס, לבצע איתו תקשורת מלאה ולערוך את האתר דרך שיחה פשוטה אבל ללא הצורך בידע טכני מקדים.
מה זה Novamira? ואיך לבנות איתו אתרי וורדפרס ב-AI?
נווה מירה (Novamira) הוא תוסף לוורדפרס שמאפשר לנו ליצור חיבור בין אתר וורדפרס לבין כלים של AI כמו קלוד קוד, Codex של Open AI וכלים נוספים לבניית אתרים או כתיבת קוד עם AI.
התוסף מאפשר לנו דרך שיחה בשפה טבעית לבצע שינויים באתר קיים וגם את היכולת לעבוד עם אלמנטור וליצור עמודי אלמנטור מלאים ומעוצבים, מה שהיה משימה בלתי אפשרי עד לנקודת הזמן הנוכחית.
התוסף של Novamira יכול לענות על שאלות פשוטות כמו כמה עמודים קיימים באתר, אבל גם לבצע פעולות בפועל כמו עריכת כותרות, יצירת עמודים חדשים ותיקון קוד שבור.
חשוב לזכור שהכלי הזה לא מיועד לעבודה ישירה על אתר שנמצא בלייב, אלא על גרסת פיתוח של האתר – ורק אחרי שמוודאים שהכל עובד כמו שצריך מעבירים את השינויים לאתר החי ומוחקים את התוסף מהאתר.
לתוסף של Novamira יש גרסה בחינם וגרסה בתשלום. ההבדל המשמעותי עד כמה שהבנתי בין 2 הגרסאות הוא שבגרסה בתשלום יש כבר אימון של המודלים של ה-AI לעבוד עם אלמנטור ותוספים שונים ובגרסה החינמית נצטרך לבצע את האימון בעצמנו.
בניית אתרים ב-AI עם אלמנטור - למה להתחיל קודם מעיצוב?
הטעות הנפוצה ביותר בבניית אתרי וורדפרס עם ב-AI היא לנסות לבנות ישירות בתוך וורדפרס מהשלב הראשון.
בשונה מאתרי HTML פשוטים שניתן לשנות אותם בקלות ובמהירות, אתרי וורדפרס ובמיוחד אתרי וורדפרס שבנויים באלמנטור מצריכים הרבה יותר כוח עיבוד והרבה יותר זמן כדי לבצע כל שינוי, וכמובן שצריכת הטוקנים גם תהיה גדולה יותר.
בגלל הצורך ביותר משאבים לאתרי וורדפרס התהליך המומלץ מתחיל דווקא ב-Claude Design, כלי העיצוב שנכלל במנוי הרגיל של קלוד (החל ממנוי בעלות 20 דולר) ולהתקדם משם לוורדפרס + אלמנטור ברגע שיש עיצוב.
השלב הראשון יהיה ליצור את העיצוב ולקבל קובץ HTML עם כל התוכן והעיצוב שאנחנו רוצים ובשלב הבא נצטרך להעביר את העיצוב וכל הפרטים לקלוד ולבקש ממנו להמיר את האתר לוורדפרס.
רק לצורך הבדיקה עשיתי ניסיונות עם כמה מודלים שונים של AI והתמקדתי בעיקר בקלוד קוד. הניסיון הראשון היה עם Sonnet 4.6 ולקח כחצי שעה ולא סיפק תוצאות טובות, והניסיון השני היה עם Sonnet 5 והוא לקח בין 50 ל-60 דקות אבל התוצאות היו הרבה יותר טובות מהמודל של 4.6.
מתחת ניתן לראות את תחילת העיצוב שיצרתי עם קלוד Design ולאחר מכן המרתי אותו אל עמוד באתר וורדפרס שבנוי עם אלמנטור.
איך מתקינים את Novamira ומתחברים לקלוד קוד?
במידה ואתם רוצים להתקין את Novamira באתר ולהתחיל לבצע שינויים באמצעות קלוד קוד, יש כמה שלבים שצריך לבצע בתהליך.
1) הורדה והתקנה של התוסף
נכנסים לאתר של Novamira לוחצים על אפשרות ההורדה בחינם ומורידים קובץ ZIP למחשב. עדיף להתחיל עם ההורדה בחינם ורק לאחר שאתם מצליחים להתחבר ורואים שהכל עובד תקין אפשר להתקדם לאפשרות בתשלום.
בנוסף, כנראה מסיבות אבטחה לא ניתן להוריד את התוסף מתוך ספריית התוספים של וורדפרס ולכן צריך להעלות אותו באופן ידני לאתר, במדריך כאן ניתן להבין איך לעשות את זה.
2) יצירת סיסמת אפליקציה
לאחר התקנת התוסף, בהגדרות התוסף אפשר לבחור את האפשרות של יצירת Application Password כדי לבצע את החיבור.
לאחר יצירת הסיסמה נקבל פרומפט שאיתו נוכל להתחבר לקלוד קוד וכל מה שיהיה נותר לעשות זה להעתיק את הפרטים שמופיעים ולשמור אותם במקום שנוכל לגשת אליו שוב (לאחר יצירת הסיסמה לא נוכל לראות את הפרטים פעם נוספת מבלי למחוק וליצור את הסיסמה מחדש).
3) התקנת Node.js
כדי לבצע חיבור ל-MCP של וורדפרס (מה שמאפשר לבצע שינויים באתר מרחוק) יש צורך להוריד ולהתקין באתר את Node.js.
אפשר לבצע את ההורדה וההתקנה מהקישור הבא או לבקש מקלוד קוד להתקין את זה עבורכם באתר:
4) יצירת החיבור והתחלת העבודה
התהליך של יצירת החיבור הוא יחסית פשוט, מומלץ לוודא קודם כל שהאתר הוא לא אתר לייב כי אנחנו לא רוצים לעבוד על אתר בלייב עם חיבור לקלוד קוד.
ברגע שלא מדובר על אתר לייב ולא ייגרם נזק עם יהיו בעיות בדרך אז כל מה שצריך לעשות זה לקחת את הפרומפט שקיבלנו מ-Novamira ולהשתמש בו על מנת להתחבר לאתר.
טיפ חשוב: מי שמתקין תוסף אבטחה באתר עשוי לגלות שהתוסף חוסם את היכולת של קלוד קוד להתחבר, ולעיתים יהיה צורך לבטל אותו זמנית כדי שהחיבור יעבוד כמו שצריך.
ומכאן צריך לתת לקלוד לעשות את העבודה ולפעמים לוקח 10-30 דקות עד שהחיבור מצליח בהצלחה כאשר התהליך תקין.
כמה זמן לוקח לבנות אתר וורדפרס עם AI?
בניית אתרים בוורדפרס עם AI חוסכת זמן משמעותי, אבל לא הופכת את התהליך למיידי, ובטח שלא מדובר על בניית אתרים ב-5-10 דקות כמו שאפשר לראות בכל סרטוני היוטיוב הקיימים.
עמוד מורכב עם עיצוב ייחודי יכול לקחת שעות ואפילו יותר. יש צורך להתחיל מהבנייה הראשונית, ההמרה לאלמנטור ובהרבה מקרים זה לא יהיה מושלם ויהיה גם צורך בתיקונים.
לעומת זאת, כשמדובר בשכפול עיצוב קיים לעמוד חדש או כאשר מדבור על יצירת עמודי בלוג נוספים, כאן התהליך הרבה יותר מהיר ופשוט, ופה נמצא היתרון האמיתי של השיטה כי החיסכון בזמן הוא עצום.
מי שמתחיל לעבוד עם הכלים האלה בפעם הראשונה כדאי שיידע מראש שיצוצו בעיות שלא רואים בסרטוני יוטיוב, ושיידרשו תיקונים ושיפורים לאורך הדרך. אבל, ברגע שמבינים איך לעבוד החיסכון בזמן והיכולות שאנחנו מקבלים הם עצומות.
אם אהבתם את המדריך ואתם רוצים לשתף אותו ניתן לעשות זאת על ידי לחיצה על כפתורי השיתוף מתחת:
יוחאי ירמיהו
בעל תואר ראשון בלוגיסטיקה וכלכלה ותואר הנדסאי בתעשייה וניהול עם התמחות בשיווק.
מעצב גרפי ומפתח אתרים עם ניסיון מעשי של למעלה מעשור בכל מה שקשור לעולם הדיגיטלי. נינג'ה מומחה למערכת המופלאה לבניית אתרים שנקראת וורדפרס, וזהו בסך הכל :-).
מאמרים נוספים שעשויים לעניין אתכם:
יש לכם שאלות או משהו להוסיף? שתפו אותנו בתגובות מתחת!
אם יש לכם שאלות או משהו להוסיף נשמח לשמוע מכם בתגובות מתחת ולסייע במידת הצורך.
יש לכם שאלות או משהו להוסיף? שתפו אותנו בתגובות מתחת!
אם יש לכם שאלות או משהו להוסיף נשמח לשמוע מכם בתגובות מתחת ולסייע במידת הצורך.