تصدير Claude Design: تحويله إلى قالب WordPress في تطبيق html2wp
صدّر تصميمك من Claude Design وحوّله إلى قالب WordPress في تطبيق html2wp، دون الطرفية (Terminal). في خطوة التصدير تحفظ التصميم كملف HTML. ثم تضيفه إلى التطبيق، وتختار Flash أو Full، وفي النهاية تنزّل قالب WordPress يشبه تصميمك.
ما تحتاجه: Mac وحساب ChatGPT وملف تصدير من Claude Design
- جهاز Mac بمعالج Apple silicon (M1 أو أحدث) ونظام macOS 12 أو أحدث.
- حساب ChatGPT. الذكاء الاصطناعي في اشتراكك أنت هو من يجري التحويل، فلا تدفع لنا مقابل أرصدة.
- ملف التصدير من Claude Design: التصميم محفوظًا كملف HTML. إذا كانت لديك عدة صفحات، فاحفظ كل صفحة في ملف مستقل.
ملف HTML من Claude هو أقصر طريق إلى القالب، لأن التطبيق لا يحتاج إلى بنائه أو فتحه في متصفح أولًا. النسخة المجانية (Free) تحوّل ثلاثة مواقع، حتى خمس صفحات لكل موقع. ولأعمال العملاء تحتاج إلى ترخيص Pro من صفحة الأسعار.
التثبيت والبيئة وتسجيل الدخول
نزّل التطبيق لجهاز Mac وانقله إلى مجلد «Applications». في «Settings» (الإعدادات) انقر «Prepare environment»، فينزّل التطبيق Docker وبيئة التحويل. ثم سجّل الدخول عبر «Connect with ChatGPT». يشرح دليل Lovable للتطبيق كل خطوة من هذه بالتفصيل مع لقطات شاشة، والخطوات نفسها تنطبق على Claude.
تصدير Claude Design: إدخال التصميم إلى التطبيق
لتصدير التصميم من Claude Design، نزّل الـ artifact من Claude كملف .html. أنشئ مجلدًا واحفظ الملف فيه باسم index.html. إذا كان التصميم يشير إلى صور ليست داخل الملف، فضعها في المجلد نفسه، في المواضع التي يتوقعها الكود. الصفحات الأخرى، مثل «من نحن» أو «اتصل بنا»، توضع بجانبه باسم about.html وcontact.html. التطبيق يعرف من اسم الملف أي صفحة هي.
في التطبيق انقر «New project» (⌘N)، واترك «HTML WordPress theme» كمخرج، ثم اختر «Choose a folder». وإذا ضغطت المجلد في ملف ZIP، فاستخدم «Import a ZIP» بدلًا من ذلك.
Flash أم Full لقالب WordPress
Flash هو الخيار الافتراضي: كل خطوة تعمل مرة واحدة، ويستغرق نحو نصف ساعة. Full يشغّل كل الفحوص ويحاول إصلاح الأخطاء، لذا يستغرق نحو ساعة. التصميم ذو الصفحة الواحدة يميل إلى الطرف الأقصر، لكن الفحوص تعمل كاملة رغم ذلك.
أثناء التحويل، يعرض تبويب «Overview» (نظرة عامة) ما يفعله التطبيق. لإيقافه مؤقتًا انقر «Stop conversion»، ثم استأنفه بزر «Continue».
فحص التصميم في التطبيق
يعرض تبويب «Compare» (المقارنة) الأصل ونسخة WordPress جنبًا إلى جنب، بعرض سطح المكتب والجوال. راجع كل صفحة، لأن الفحوص الآلية تلتقط معظم الفروق لا كلها. إذا لم يتطابق شيء، فاكتبه في الدردشة. يحدث التغيير في المعاينة، ثم يحزّم زر «Make release» نسخة جديدة من القالب.
تصدير القالب: من Claude Design إلى WordPress
في تبويب «Exports» (التصديرات) انقر «Save» بجانب قالب WordPress واحفظ ملف ZIP. ثم ترفعه في WordPress من «المظهر ← قوالب ← أضف جديد ← رفع قالب» (Appearance → Themes → Add New → Upload Theme). القالب مستقل بذاته: الصفحات والنماذج والقوائم وSEO تعمل دون إضافة.
يضيف محرر Visual Edit التعديل بالنقر لعميلك. وإذا كنت تعمل في الطرفية، فإن الدليل مع إضافة Claude Code وCodex يشرح التحويل نفسه.