המרת Lovable ל-WordPress: שלב אחר שלב באפליקציית html2wp
המדריך הזה מראה איך ממירים פרויקט Lovable ל-WordPress באפליקציית html2wp. לא צריך טרמינל ולא צריך לתכנת. מוסיפים את הפרויקט כ-ZIP, בוחרים Flash או Full, ובסוף מורידים תבנית WordPress מוכנה שנראית כמו העיצוב שלכם.
מה צריך כדי להמיר Lovable ל-WordPress באפליקציה
- Mac עם Apple silicon (M1 ומעלה) ו-macOS 12 ומעלה.
- חשבון ChatGPT. ה-AI שבמנוי שלכם מבצע את ההמרה, כך שאתם לא משלמים לנו על קרדיטים או טוקנים.
- פרויקט ה-Lovable כ-ZIP או כתיקייה עם קוד המקור. השלבים להשיג אותו מופיעים בהמשך.
- מקום בדיסק. כל המרה שרצה תופסת כמה GB.
לא צריך להתקין את Docker Desktop מראש, כי האפליקציה מורידה ומתקינה אותו בעצמה כשצריך. הגרסה החינמית ממירה שלושה אתרים של עד חמישה עמודים כל אחד, וזה מספיק כדי להמיר אתר Lovable קטן ל-WordPress. לעבודה ללקוחות, לאתרים גדולים יותר ולחנות WooCommerce צריך רישיון Pro מעמוד המחירים.
התקנת אפליקציית html2wp
הורידו את האפליקציה ל-Mac, פתחו את קובץ ה-DMG וגררו את html2wp לתיקייה Applications. במדריך הזה שמות הכפתורים כתובים בדיוק כפי שהם מופיעים על המסך.
הכנת הסביבה
בהגדרות האפליקציה (Settings) לחצו על Prepare environment. האפליקציה מורידה ומפעילה את Docker אם צריך, ואז טוענת את סביבת ההמרה ואת האימג'ים של WordPress ומסד הנתונים. בפעם הראשונה זה לוקח כמה דקות. ה-Mac עשוי לבקש את הסיסמה שלכם, ו-Docker מציג את תנאי הרישיון שלו.
כשהכול מוכן, האפליקציה כותבת "Ready to work" והכפתור משתנה ל-Repair environment. צריך אותו רק אם הסביבה תישבר בהמשך.
התחברות עם ChatGPT
לחצו על Connect with ChatGPT. האפליקציה מציגה לכם קוד, והכפתור Open sign-in page פותח את העמוד של OpenAI. התחברו שם עם חשבון ChatGPT שלכם והזינו את הקוד מהאפליקציה. את הסיסמה מקלידים רק בעמוד של OpenAI, כך שהאפליקציה אף פעם לא רואה אותה.
אחרי ההתחברות בחרו את Conversion model ואת Reasoning effort, או השאירו את ברירות המחדל. אם יש לכם רישיון Pro, הזינו את המפתח בהגדרות ולחצו על Save & check. הגרסה החינמית לא צריכה מפתח.
פרויקט ה-Lovable שלכם באפליקציה
האפליקציה צריכה את קובצי המקור של הפרויקט, לא את הכתובת של האתר החי. Lovable מסנכרנת את הפרויקט למאגר GitHub. פתחו אותו ב-GitHub והורידו אותו דרך Code → Download ZIP. לא צריך לבנות את הפרויקט או להריץ npm install, כי האפליקציה עושה את זה בעצמה.
באפליקציה לחצו על New project (⌘N). תחת Output השאירו HTML WordPress theme ובחרו Import a ZIP, או Choose a folder אם פרסתם את הפרויקט. האפליקציה עובדת על עותק, כך שהקבצים המקוריים שלכם לא משתנים.
Flash או Full להמרה מ-Lovable ל-WordPress
במסך הפרויקט בוחרים כמה יסודית האפליקציה תמיר את אתר ה-Lovable ל-WordPress. Flash היא ברירת המחדל: כל שלב רץ פעם אחת, וזה לוקח כחצי שעה. Full מריצה כל בדיקה ומנסה לתקן את השגיאות שהיא מוצאת, ולכן היא לוקחת כשעה. הזמן המדויק תלוי במספר העמודים ובמהירות ה-Mac שלכם.
אם אתם לא צריכים WordPress, החליפו את הסוג ל-Astro 5. האפליקציה בונה אז אתר סטטי, ואפשר לפרסם אותו ב-Cloudflare Pages ישירות מהאפליקציה.
איך ההמרה מתנהלת
במהלך ההמרה, הלשונית Overview מציגה את השלבים שתוסף ההמרה עובד עליהם ואת התיקונים שהוא עשה בעצמו. רוב הזמן היא רצה בלעדיכם. בין שפרויקט ה-Lovable הוא אפליקציית React ישנה ובין שהוא פרויקט TanStack Start חדש יותר, האפליקציה קודם בונה אותו, פותחת אותו בדפדפן ושומרת כל עמוד כ-HTML מוגמר. רק אז היא הופכת את ה-HTML הזה לתבנית.
כדי לעצור, לחצו על Stop conversion, ואז המשיכו עם Continue. אם התוסף נעצר בשלב כלשהו בעצמו, Repair and continue נותן לו לתקן את השגיאה ולהמשיך.
בדיקת אתר ה-Lovable מול WordPress
הלשונית Compare מציגה כל עמוד של המקור ליד גרסת ה-WordPress, ברוחב מחשב (Desktop · 1440) וברוחב מובייל (Mobile · 390), עם ההבדל באחוזים. עברו על כל עמוד בעצמכם. בדיקות אוטומטיות תופסות את רוב ההבדלים, אבל לא את כולם: באחת ההמרות חסר מקטע שלם וההבדל היה 0.4% בלבד.
בלשונית Preview, הכפתור Open website פותח את אתר ה-WordPress המקומי, ו-WordPress admin פותח את לוח הבקרה שלו. אם אתם רוצים לשנות משהו, כתבו את זה בצ'אט מימין. השינוי מופיע בתצוגה המקדימה תוך כמה שניות. אחר כך לחצו על Make release, והאפליקציה אורזת את התבנית בדיוק כפי שאתם רואים אותה בתצוגה המקדימה.
ייצוא התבנית אחרי ההמרה מ-Lovable ל-WordPress
אחרי ההמרה מ-Lovable ל-WordPress, הקבצים המוגמרים נמצאים בלשונית Exports. ליד תבנית ה-WordPress לחצו על Save ושמרו את ה-ZIP. שם תמצאו גם את דוח ההמרה כ-PDF, את ה-ZIP של הפרויקט המקורי, ואחרי המרת Flash גם פרויקט Astro 5.
ב-WordPress עברו אל עיצוב ← ערכות עיצוב ← הוספת ערכת עיצוב ← העלאת ערכת עיצוב (Appearance → Themes → Add New → Upload Theme), בחרו את ה-ZIP והפעילו את התבנית. עמודים, בלוג, טפסים, תפריטים, SEO והפניות הם כולם חלק מהתבנית ועובדים בלי תוסף.
אם אתם רוצים שהלקוח יערוך טקסט ותמונות בלחיצה ישירה על העמוד, הוסיפו את העורך Visual Edit. אם אתם מעדיפים לעבוד עם סוכן בטרמינל, המדריך עם התוסף ל-Claude Code ול-Codex מכסה את אותה המרה.