html2wp / התיעוד של html2wp / תוסף
תוסף ל-Claude Code ול-Codex
איך מתקינים את התוסף html2wp ב-Claude Code או ב-Codex ומשתמשים בו כדי להמיר אתר לתבנית WordPress, שלב אחר שלב, עד הבדיקה של העמודים המוגמרים. ממירים באפליקציית הדסקטופ? השלבים לאפליקציה נמצאים בתיעוד שלה.
מתי צריך מפתח רישיון
כדי לנסות לא צריך מפתח. הגרסה החינמית פתוחה לכולם ונותנת שלוש המרות של עד חמישה עמודים כל אחת, ועוד חמש הרצות חוזרות. שני המספרים נספרים לפי כתובת IP. רישיון צריך לעבודה ללקוחות, לאתרים עם יותר מחמישה עמודים ולחנויות WooCommerce. קונים אותו בעמוד המחירים, והמפתח מגיע באימייל. איך הרכישה עובדת.
התקנה
התוסף נמצא בשני מאגרי GitHub, אחד ל-Claude Code ואחד ל-Codex. בשניהם אותו תוכן ואותו מספר גרסה. הם שונים רק באופן שבו כל כלי טוען אותם. התקינו את המאגר ששייך לכלי שלכם, כי השני לא ייטען.
| כלי | מאגר |
|---|---|
| Claude Code | iOSDevSK/html2wp-cc-plugin |
| Codex | iOSDevSK/html2wp-codex-plugin |
עברו לכלי שלכם והריצו את שתי הפקודות, אחת אחרי השנייה:
/plugin marketplace add iOSDevSK/html2wp-cc-plugin/plugin install html2wp@html2wpהפקודה הראשונה מוסיפה מ-GitHub את קטלוג התוספים (ה-marketplace). אחר כך השנייה מתקינה ממנו את html2wp. ל-Codex יש מאגר משלו, כי הוא מוצא תוספים דרך הקובץ .agents/plugins/marketplace.json, ובמאגר של Claude Code אין את הקובץ הזה.
עדכונים
לפקודת העדכון יש שם שונה בכל כלי. ב-Codex היא upgrade, ב-Claude Code היא update:
/plugin marketplace update html2wpהפעלת עדכונים אוטומטיים ב-Claude Code
Claude Code לא מפעיל עדכונים אוטומטיים לקטלוגים של צד שלישי. בלעדיהם מקבלים גרסה חדשה של התוסף רק כשמבקשים אותה, וחלק מהגרסאות מתקנות באגי אבטחה. כדי להפעיל אותם, פתחו את /plugin, בחרו את html2wp תחת Marketplaces והפעילו auto-update.
כדי לראות את הגרסה המותקנת, הריצו codex plugin list ב-Codex. ב-Claude Code, עברו אל /plugin → Marketplaces → html2wp.
אם הגרסה ב-Codex לא השתנתה אחרי עדכון, Codex שומר עותק ישן. מחקו אותו והתקינו את התוסף מחדש:
rm -rf ~/.codex/plugins/cache/html2wpcodex plugin marketplace upgrade && codex plugin add html2wp@html2wpאם גם זה לא עוזר, ייתכן שב-Codex יש עותק אחר וישן יותר מהתקנה ידנית. הפקודה codex plugin marketplace list מדפיסה כל קטלוג. אם אתם רואים שם html2wp@<other-name>, הסירו אותו עם codex plugin remove html2wp@<that-name>.
רוב העבודה קורית בשירות html2wp, והשירות מתעדכן מעצמו, כך שההמרה הבאה שלכם כבר רצה על הגרסה החדשה. צריך לעדכן רק את החלק שרץ במחשב שלכם: הבדיקות, הסקריפטים והמסנן של הנתונים היוצאים. מה השתנה בכל גרסה מופיע בהיסטוריית ה-commits ב-GitHub.
דרישות מערכת
| Node.js | גרסה 20 ומעלה |
|---|---|
| Python 3 | עם החבילות Playwright (chromium) ו-Pillow |
| Docker | כולל docker compose, שמריץ את WordPress של הבדיקות |
| כלים אחרים | php-cli, jq, curl, bash, tar |
| אתר היעד | WordPress 6.6 ומעלה |
לא צריך לבדוק את זה בעצמכם. כשמתחילים המרה, התוסף בודק קודם את המחשב שלכם ומפרט מה חסר:
Node.js ok v22.14.0 Python ok 3.12.4 Playwright MISSING mirroring, prerendering and every screenshot Docker NOT RUNNING installed, but the daemon is not up
לחבילות שמותקנות רק בתיקיית המשתמש שלכם, כמו Playwright או הדפדפן chromium, התוסף מציע להתקין אותן בשבילכם. הוא שואל לפני כל פקודה. דברים שמשנים את המערכת כולה, כמו Docker Desktop או Node.js חדש יותר, הוא רק מדווח, ואז מחכה עד שתתקינו אותם בעצמכם.
אם אתם רוצים להתקין את חבילות ה-Python ידנית:
python3 -m pip install playwright pillow && python3 -m playwright install chromiumבאיזה מודל להשתמש
במהלך המרה ה-AI צריך לקבל הרבה החלטות. למשל: איזה עמוד הוא עמוד הבית, למה בדיקה נכשלה, או אם לקוח בכלל ישים לב להבדל בין שני צילומי מסך. לכן בחירת המודל משפיעה על התוצאה יותר מכל הגדרה אחרת.
| כלי | מודל מומלץ |
|---|---|
| Claude Code | Opus 5, עם Fable 5 כיועץ. |
| Codex | Luna ברמת חשיבה (reasoning effort) xhigh. |
האפשרות הזולה יותר
Codex עם Luna ברמה xhigh עולה פחות, והתוצאות שלו מעל הממוצע. אם עלות ההמרה חשובה לכם, בחרו בשילוב הזה.
ב-Claude Code, Opus 5 עושה את העבודה ו-Fable 5 מתייעץ בהחלטות החשובות, שבהן המרה משתבשת הכי הרבה.
מפתח רישיון
בגרסה החינמית לא צריך מפתח, אז דלגו על הסעיף הזה. אם יש לכם רישיון, שמרו את המפתח במחשב לפני ההמרה הראשונה. עושים את זה פעם אחת, מכל תיקייה:
mkdir -p ~/.config/html2wpprintf '%s' 'YOUR-KEY' > ~/.config/html2wp/licencechmod 600 ~/.config/html2wp/licenceאפשר גם להעביר את המפתח במשתנה הסביבה H2WP_KEY, שגובר על הקובץ. הקובץ בטוח יותר, כי כך המפתח לא נשאר בהיסטוריית הטרמינל.
הקובץ מקבל את מפתח הרישיון של html2wp שמקבלים כשקונים Pro. מפתח Visual Edit Pro לא נכנס לשם. אותו מזינים בתוסף Visual Edit באתר שעורכים, והוא לא עובד להמרות.
שמרו את המפתח לפני שמתחילים המרה
ממש בהתחלה התוסף מחשב כמה עמודים מותר לכם להמיר. אם עדיין אין לו מפתח, הוא מתכנן את ההמרה לפי המגבלה החינמית של חמישה עמודים. מפתח שנוסף בזמן שההמרה רצה לא משנה את זה.
כדי לברר אם מפתח תקף, למה אפשר להשתמש בו ועד מתי, הריצו npx html2wp-license YOUR-KEY. בדיקת המפתח בעמוד הרישיונות מסבירה מה פירוש התוצאה. מה רישיון כולל ואיך קונים אותו מופיע בעמוד הרישיונות.
המרת פרויקט
פתחו טרמינל בתיקיית הפרויקט שאתם רוצים להמיר, והפעילו שם את הסוכן שלכם:
git clone https://github.com/YOU/YOUR-LOVABLE-PROJECTcd YOUR-LOVABLE-PROJECTcodexאם אתם משתמשים ב-Claude Code, הקלידו claude במקום codex בשורה האחרונה.
אחר כך תנו לסוכן פקודה אחת:
/html2wp:html2wp convert this projectזה הכול. לא מריצים npm install או npm run build, ולא מגדירים כלום. פרויקטים מ-Bolt, v0, shadcn או ייצוא Next.js מומרים באותו אופן. אפשר גם להקליד רק /html2wp:html2wp ב-Claude Code, או לבקש מ-Codex להשתמש ב-html2wp. אז התוסף שואל אתכם מה להמיר.
הדקות הראשונות של המרה
> convert this project
Checking this machine first…
Node.js ok v22.14.0
Playwright MISSING
Two Python packages are missing. Shall I install them? (they go in your
user directory, no root)
> yes
… installed. Building the project, then prerendering it.
7 routes found: /, /about, /pricing, /blog, /blog/launch, /contact, /faq
Decided: /blog is the listing, /blog/launch an article, the rest are pages.
Written to the manifest; carrying on.
בשורות האחרונות התוסף רשם איך הוא מיין את העמודים: /blog הוא רשימת המאמרים, /blog/launch הוא מאמר, והשאר עמודים רגילים. בדקו את ההחלטה הזו באתר המוגמר בסוף.
קלט אחר
הפקודה convert this project ממירה את התיקייה שאתם נמצאים בה. אם הקבצים נמצאים במקום אחר, הקלידו את הנתיב אליהם, למשל convert ./dist.
| מה יש לכם | מה מקלידים |
|---|---|
| פרויקט שממנו האתר נבנה: Lovable, Bolt, v0, Vite, Astro, ייצוא Next.js | convert this project |
תיקייה של קובצי .html מוגמרים, תמונות וסגנונות | convert ./folder-name |
הקלט תמיד צריך להיות בדיסק שלכם. התוסף לא ממיר כתובת של אתר חי. הוא צריך את הקבצים שמהם האתר בנוי, לא את מה שהדפדפן מציג.
איך פרויקט Lovable מומר
אפליקציית Lovable בנויה ב-React. ה-index.html שלה מכיל רק רכיב ריק וסקריפט, והעמוד מתעורר לחיים רק בדפדפן. לכן התוסף קודם בונה את הפרויקט, פותח אותו בדפדפן אמיתי ושומר כל עמוד כ-HTML מוגמר. הוא לוכד גם תוכן שמופיע רק אחרי שהסקריפטים רצים, כמו אקורדיונים פתוחים או תפריטים נפתחים. אחר כך הוא יוצר מהעמודים האלה את התבנית. הפרטים נמצאים במדריך להמרה מ-Lovable ל-WordPress.
מה הוא מחליט בשבילכם
איזה עמוד הוא מה
להחלטה אחת יש ההשפעה הגדולה ביותר על התוצאה: איזה עמוד הוא עמוד הבית, איזה הוא רשימת המאמרים, אילו הם מאמרים ואילו מוצרים. התוסף מסיק את זה מקוד העמודים, רושם את ההחלטה וממשיך בלי לשאול. הוא עוצר רק כשהוא לא יכול להחליט. למשל, כשיש באתר יותר עמודים ממה שהמגבלה שלכם מאפשרת, או כששני עמודים נראים כמו אותו עמוד.
אם הוא טועה בזה, התיקון זול. מתקנים את המיון ומריצים את ההמרה שוב. זו הרצה חוזרת, והיא לא נספרת במגבלת ההמרות שלכם.
משם זה בעיקר רץ לבד
Flash לוקחת בערך חצי שעה, Full בערך שעה, תלוי במספר העמודים ובמהירות המחשב שלכם. בינתיים התוסף בונה את האתר, משווה אותו למקור ושולח אותו להמרה בשירות html2wp. אחר כך הוא מתקין את התבנית המוגמרת ב-WordPress זמני ב-Docker במחשב שלכם ובודק אותה שם.
הבדיקה שאי אפשר לדלג עליה
בסוף התוסף מציג לכם כל עמוד ליד המקור בתמונה אחת. הסתכלו על כל תמונה ואמרו מה אתם רואים.
למה אדם צריך לבדוק את העמודים
בדיקות אוטומטיות משוות מספרים, ולכן הן מעבירות גם טעויות שאדם היה מבחין בהן מיד. באחת ההמרות חסר מקטע שלם בהמשך העמוד, אבל ההשוואה הראתה הבדל של 0.4% בלבד, והבדיקה עברה. בשלב הזה קובץ ה-ZIP של התבנית כבר מוכן. הבדיקה הזו היא הדרך שבה אתם מחליטים אם אפשר למסור אותו.
מה מקבלים
- התבנית כקובץ ZIP. מעלים אותה ל-WordPress דרך עיצוב ← ערכות עיצוב ← הוספת ערכת עיצוב ← העלאת ערכת עיצוב (Appearance → Themes → Add New → Upload Theme). התוסף בכלל לא בונה תבנית שבורה: למשל, אם ב-PHP הייתה שגיאת תחביר, חסר תוכן, צילום המסך של התבנית היה בגודל שגוי, או שאי אפשר היה לקנות כלום בחנות.
- הדוח
CONVERSION-REPORT.mdבאותה תיקייה כמו ה-ZIP. הוא מפרט את העמודים שהומרו, התפריטים שחוברו, כל מה שמצאתם בבדיקה, כל אזהרה מההמרה ומה עוד נשאר לעשות. - קישור ל-Visual Edit Lite, העורך החינמי לעריכה בלחיצה. העורך אינו חלק מהתבנית, והתבנית עובדת בלעדיו. Visual Edit Pro הוא רישיון נפרד בתשלום.
התבנית עצמאית. עמודים, בלוג, טפסים, תפריטים, SEO והפניות הם חלק מהקוד שלה ועובדים בלי תוספים. הקוד הוא PHP, CSS ו-JavaScript קריאים. הוא שייך לכם ולא קשור אלינו. התבנית לא מתחברת לשום מקום. איך עורכים אותה בלחיצה מתואר בחלק על Visual Edit בתיעוד האפליקציה.
מה יוצא מהמחשב שלכם
המחשב שלכם עושה את עבודת הדפדפן: בניית העמודים, השוואת צילומי מסך והרצת WordPress זמני ב-Docker לבדיקות האחרונות. את התבנית עצמה יוצר שירות html2wp. לכן התוסף שולח אליו את האתר הבנוי ומקבל בחזרה את התבנית.
בדיקות התבנית רצות אצלכם, כך שהשירות לא רואה את התוצאות שלהן. לכן בסוף התוסף שולח אותן אליו. זו חובה: השירות לא מתחיל את ההמרה הבאה עד שהקודמת שלחה את התוצאות שלה.
- מה נשלח: שמות הבדיקות, אם הן עברו, מספרי עמודים, אחוז ההתאמה הגרוע ביותר והשמות הקצרים של העמודים שנכשלו, כמו
aboutאוpricing. - מה לא נשלח: הכתובת או הדומיין של האתר, קוד, טקסט, צילומי מסך, נתיבי קבצים, מפתח הרישיון או שם האתר. התוסף שולח רק שדות שהוגדרו מראש, ותו לא.
- בדקו בעצמכם: הפקודה
send-verdicts.sh <workspace> --dry-runמדפיסה בדיוק מה היה נשלח, אבל לא שולחת כלום. זה סקריפט קצר אחד שאפשר לקרוא.
התוסף לא שולח שום נתונים אחרים, והתבנית המוגמרת לא שולחת כלום. התיאור המלא, כולל כמה זמן אנחנו שומרים את הנתונים, נמצא בעמוד הפרטיות.
דיווח על באג
אם הממיר עצמו טועה, דווחו על כך בפקודה הזו:
curl -sS -X POST https://api.html2wp.dev/v1/report \
-H 'content-type: application/json' \
-d '{"subject":"what went wrong","body":"what you saw","evidence":"page keys, warnings"}'אדם קורא כל דיווח. התיקון נכנס לשירות, כך שהוא עוזר לכל המשתמשים.
באגי אבטחה מדווחים בדרך אחרת
לא בפקודה הזו, ולא כ-issue ב-GitHub. השלבים נמצאים בעמוד האבטחה.